آموزش سی اس اس سلکتور (CSS Selector)

بروزرسانی شده در ۰۲ تیر ۱۳۹۹
آموزش سی اس اس سلکتور (CSS Selector)
زمان مطالعه : 2 دقیقه 307 بازدید 0 نظر

آموزش مهم ترین و پرکاربرد ترین سلکتور های css

انتخابگر سی اس اس (css selectors) برای یافتن عناصر html صفحه استفاده می کنیم.

انتخابگر های css 

انتخابگر ساده (Simple selectors) (عناصر را بر اساس اسم آن و id , class انتخاب کنید.)

همینطور که در تصویر می بینید

Element Selector

تگ های html رو اگه صدا بزنیم مثل (bodyوh1) تمام عناصری که در صفحه با این تگ ها ساخته شده اند انتخاب می شوند.

Id Selector

علامت (#) برای انتخاب یک id هست (id Selector) که شما در صفحه html تون تعریف کردید نکته (id فقط یکی از آن در صفحه باید باشد)

 Class Selector

علامت (.) نشان دهنده class هستش و می توان برعکس id کلاس رو به چند تگ html داد که خصوصیاتشان یکسان است (مثلا رنگشون آبی هستش میشه با یک کلاس به تگ های که رنگ آبی دارن رنگ مورد نظر خودمون رو اضافه کنیم.)

 

selector css آموزش

 

یک انتخابگر به نام انتخابگر جهانی (Universal Selector) موجود است که تمام عناصر html  موجود در صفحه رو انتخاب می کند. (در مثال کل عناصر صفحه رو رنگشون قرمز کردیم)

 

انتخابگر جهانی css

 

انتخاب گروهی عناصر صفحه (html tag) مواردی که 2 عنصر یا چند عنصر خصوصیات مشترک داشته باشند مورد استفاده قرار می گیرد. (در مثال سه تا تگ که خصوصیات مشترک داشتن با , از هم جدا کردیم و شکل یکسانی به هر سه داریم)

 

 

برای آشنایی با سلکتور های بیشتر می توانید ما رو دنبال کنید

 

با عضویت در خبرنامه می توانید از جدیدترین مقالات، اخبار و تخفیف های ویژه در ایمیل خود با خبر شوید...