کلاس و آیدی برای این هستن که بتونید یه سری المان خاص یا عملکرد مشخص به المانهای داخل صفحه بدید.
فرض کنید یه دکمه "ارسال" دارید و میخواید بهش بکگراند آبی و رنگ متن سفید بدید و یکم گوشههاش رو گرد کنید.
باید بتونید یه جوری این دکمه رو صدا کنید که بهش بگید چه شکلی بشه دیگه؟ یا وقتی روش کلیک شد چه اتفاقی بیوفته.
آیدی شبیه به یه شماره شناسنامه است. یعنی هر المان فقط یکبار میتونه آیدی داشته باشه و اون آیدی هم یکتاست. برای همین، از آیدی بیشتر واسه مشخص کردن یک المان خاص استفاده میکنیم که قراره استایل یا ویژگی خاصی فقط به اون تعلق بگیره. برای استفاده از آیدی تو CSS، از # قبل از اسمش استفاده میکنیم؛ مثلاً #header.
کلاس اما مثل یه دستهبندی یا برچسبه. یعنی میتونید یه کلاس رو به چندین المان بدید و همه اونا یه سری استایلهای مشترک بگیرن. اینجوری مدیریت استایلها سادهتر میشه، چون کافیه کلاس رو تغییر بدید تا هر جایی که اون کلاس استفاده شده، تغییر کنه. برای استفاده از کلاس تو CSS، از . قبل از اسمش استفاده میکنیم؛ مثلاً .button.