آی دی ها و کلاس ها به شما اجازه می دهند تا یک استایل خارجی ایجاد کنین و در مواقعی از تکرار یک کد css برای کد های HTML جلوگیری کنید و حجم وب خود را کم نمایید.
آی دی (id)
در کد های HTML باید کدی نوشته شده باشد که استایل خارجی را به آن تگ وصل نماید که این کار را با id می توان انجام داد.
آی دی را در استایل خارجی با آوردن # در قبل از انتخابگر (selector) مشخص می کنیم.
در تگ های HTML نیز برای متصل نمودن آنها به هم از id="yourID" استفاده می کنیم به طوری که به جای yourID هر کلمه ای به غیر از اعداد می توان استفاده کرد که دقیقا این کلمه یا جمله باید بعد از # در استایل خارجی بیاید تا این دو به هم متصل گرددند.
کلاس ها (class)
در کلاس ها شما می توانید چند استایل خارجی را به یک تگ HTML وصل کنید.
برای مثال فکر کنید که شما چند متن دارید که یکی به رنگ آبی ، یکی تو پر و دیگری به صورت ایتالیک نوشته شده که با استفاده از استایل خارجی طراحی گردیده اند و شما می خواهید آنها را با هم ترکیب کنید و در متن چهارم تمام صفات سه متن قبلی را در آن قرار دهید. در این صورت باید نام کلاس های هر کدام که فقط می تواند یک کلمه باشد و در آنها نباید از فاصله و یا اعداد استفاده کرد را در سه متن بالا استفاده شده با فاصله در کنار هم قرار دهیم.
برای ایجاد استایل خارجی مانند id عمل می کنیم فقط به جای # از نقطه استفاده می کنیم.
به جای id="" از class="" استفاده می کنیم.
شما می توانید این کد را به صورت خاصی در سلکتور های متفاوتی برای مشخص کردن دقیق انجام دهید.
مثال زیر در یک پاراگراف استایل csnter را مشخص می کند یعنی در صورتی که در یک تگ div استایل center قرار داشته باشد این استایل به آن وصل نمی شود و باید به جای p از div استفاده کنیم تا تگ برای آن استایل فعال و برای استایل پاراگراف غیر فعال شود.
