جلسه سوم CSS انتخاب المان

جلسه سوم CSS انتخاب المان

CSS Selector چیست؟

اولین و رایج ترین نوع Selector ها در زبان سی اس اس (CSS) تحت عنوان Element Selector شناخته می شوند. همانطور که در دوره اچ تی ام ال (HTML) توضیح دادیم منظور از Element تگ های اچ تی ام ال (HTML) به همراه محتوای داخل آنها است.انتخاب‌ کردن یک المان اچی تی ام ال، یکی از مهمترین قواعد سی‌اس‌اس است. در واقع شما برای اینکه یک المان اچ تی ام ال را در سی اس اس تغییر دهید اول باید  آن را فراخوانی کنید. یعنی به نوعی آن را صدا بزنید! به این کار انتخاب کردن سی اس اس می‌گویند و شما با کمک انتخابگر، المان اچ تی ام ال مورد نظر را انتخاب یا پیدا می‌کنید. 

برای صدا کردن یک المان اچ تی ام ال، نیاز داریم که اسم آن را صدا بزنیم. المان‌های اچ تی ام ال هر کدام نام عمومی اختصاصی خود را دارند. مثلا متون با تگ p شناخته می‌شوند و لینک‌ها با تگ a شناخته می‌شوند. در واقع تگ‌های اچ تی‌ ام‌ ال نام‌های عمومی هستند و اگر شما از آن‌ها استفاده کنید به نوعی با کلی مخاطب روبرو خواهید شد.

 

جلسه سوم  CSS انتخاب المان  جلسه سوم  CSS انتخاب المان جلسه سوم  CSS انتخاب المان css 3

جلسه سوم CSS انتخاب المان

مثلا در زیر ما نوشته‌ایم p و بدین ترتیب هر نوع پاراگرافی که در متن وجود دارد را انتخاب کرده‌ایم.

در کد HTML  زیر در نظر بگیرید

 

و همچنین

جلسه سوم  CSS انتخاب المان  جلسه سوم  CSS انتخاب المان جلسه سوم  CSS انتخاب المان Capture 12

جلسه سوم CSS انتخاب المان

حالا از خودتان می‌پرسید اگر ما قصد تغییر همه پاراگراف‌ها را نداشته باشیم و تنها بخواهیم یکی از المان‌ها، مثلا پاراگراف سوم را تغییر دهیم چکار باید کنیم؟ اینجاست که استفاده از id و class‌ به کار می‌آید. کلاس و id در واقع بهترین روش برای انتخاب المان‌ها در سی اس و اچ تی ام ال است. 

پس برای اضافه کردن ID به هر المان اچ تی ام ال کلمه ID را در تگ مورد نظر یادداشت کرده و در مقابل آن "نام آی‌دی"= را می‌نویسیم:

ID = ” نام آی‌دی مورد نظر”

حالا که با نحوه‌ی اضافه کردن id به المان‌های اچ تی‌ام‌ال آشنا شدیم؛ در قدم دوم وقت آن رسیده است تا آن‌ها را با سی‌اس‌اس انتخاب کنیم. برای انتخاب یک آی دی خاص در سی اس اس باید علامت # و سپس نامی که به عنوان آی‌دی به المان داده‌ایم را بنویسیم.  

 

جلسه سوم  CSS انتخاب المان  جلسه سوم  CSS انتخاب المان جلسه سوم  CSS انتخاب المان Capture 13

جلسه سوم CSS انتخاب المان

 

 

به طور کلی نامگذاری در برنامه نویسی از اهمیت ویژه ای برخوردار است چرا که یک اشتباه کوچک منجر به این خواهد شد که برنامه به درستی اجرا نگردد. نامگذاری در اچ تی ام ال (HTML) و سی اس اس (CSS) هم از این قاعده مستثنی نیست.

در نامگذاری id ها و class ها حتماً به خاطر داشته باشیم که از علائمی همچون @ و $ و % و … استفاده نکنیم. علاوه بر این اجازه نداریم تا در نامگذاری از Space یا فاصله هم استفاده کنیم.

سی اس اس (CSS) اصطلاحاً case-sensitive است. به عبارت دیگر نام myClass با myclass دو چیز مجزا تلقی می شوند. بنابراین همواره نام هایی که برای id ها یا class های خود انتخاب می کنیم را می بایست به خاطر داشته باشیم.

 

جلسه سوم css انتخاب المان به پایان رسید امیدوارم از این جلسه نهایت استفاده رو برده باشید

آموزش CSS آموزش طراحی وب

دیدگاه خود را بیان کنید