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

انتخابگر های CSS یا همان Selector ها از مهمترین و پایه ای ترین قسمت های مربوط به CSS هست

در این آموزش میخواهم چند تای آنها رو معرفی کنم

/* All tags */
*
{
   color:red;
}

/* All p tags */ 
p 
{
   color:blue; 
}

/* Tag with specified id */ 
#title1
{
   color:pink
} 

/* All tags with specified class */ 
.class1 
{ 
   color:green; 
} 

/* All a tags with specified attribute */
a[target] 
{ 
   color: black;
} 
a[target=_blank] 
{ 
   color:yellow;
}

*: انتخابگر تمام عناصر صفحه

p: انتخابگر تگ همنام با آن در اینجا style روی تمام تگ های p اعمال میشود

# : انتخابگر id است یعنی style نوشته شده برروی تگی با id مشخص شده (title1) اعمال میشود

.: انتخابگر class است یعنی style روی تمام تگ هایی که کلاس مشخص شده را دارند (class1) اعمال میشود

[]: ​انتخابگر صفت که در مثال بالا به معنی انتخاب تمام تگ های  a که دارای صفت target میباشند.همان طور که میبینید میشه مقدار صفت رو هم داخل [] قرار بدیم 

 

نکته دیگه ای که باید در نظر گرفته بشه اینه که میتونیم از این انتخابگرها به صورت ترکیبی هم استفاده کنیم 

مثال:

p,a
{
    color:black;
}
#title1,#title2
{
    color:gray;
}
.class1, #title1
{
    color:yellow;
}
.class1,.class2.class3
{
   color:brown ;
}

توضیح مثال: برای استفاده از چند انتخابگر به طور همزمان فقط کافی است بین آنها از "," استفاده کنیم

ادامه دارد . . .

 

نوشته شده در چهارشنبه ۱۳۴۸/۱۰/۱۱ ساعت ۱۲:۰۰ توسط مهدی باقری | تعداد بازدید ۱۴ | نظر بدهید