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

10 / 10 از 1 کاربر

در این بخش از آموزش css ، انتخابگرها  را برای شما نام می بریم.

از جمله مواردی که سی اس اس در اختیار شما می گذارد تعیین انتخابگرهایی به نام class و id می باشد.در اینجا انواع انتخابگرها را برای شما توضیح می دهیم.
class : عناصری که به آنها این دستور وارد شده را به style مورد نظر تبدیل میکند.
#id : عناصری که دستور id=name را  دارند را به style موزد نظر تبدیل می کند.
* : همه ی عناصر را انتخاب می کند و دستورات مورد نظر را اعمال میکند.
 element : تگ های <p> را انتخاب میکند و دستورات مورد نظر را در طراحی سایت به آنها اعمال می کند.
 elementءelement : تگ های p , h1 را انتخاب میکند و style موردنظر را در آنها اعمال می کند.
element element : همه ی تگهای p که داخل تگ div قرار گرفته اند را انتخاب می کند و دستور مورد نظر را در آنها اعمال می کند.
element>element : تگ ها p که داخل تگ div می باشند و داخل این تگ ها به وجود آمده اند را انتخاب می کند و style موردنظر را به اعمال می کند.
element+element : تگ های p که بلافاصله پپس از تگ div قرار گرفته اند را انتخاب می کند و دستورات مورد نظر را به انها اعمال می کند.

attribute تگ های a که ویژگی target را داشته باشند را انتخاب کرده و style مورد نظر را به آن اعمال می کند.

 attribute=value: این ویژگی در طراحی سایت تگ های a که ویژگی target=_blank را داشته باشند را انتخاب می کند و style مورد نظر را به آن اعمال می کند.

attribute~=value : تگ های a که ویژگی title=pars را دارند را انتخاب کرده و style مورد نظر را به آن اعمال می کند.
attribute|=value : این انتخابگر عناصری که ویژگی lang آنها با fa شروع میشود را انتخاب کرده و style موردنظر را بر روی آن اعمال می کند.

link : این انتخابگر تگ های a ای را که روی آنها کلیک نشده است را انتخا کرده و style موردنظر را به آن اعمال می کند.
visited : گ های a ای که روی آن کلیک شده باشد را انتخاب کرده و style موزدنظر را بر روی آن اعمال میکند.
 hover:این ویژگی در طراحی سایت تگ های a ای که با ماوس روی آن ها میروید را انتخاب می کند و دستورات موردنظر را به آن اعمال می کند.
focus:همه ی تگ های input را انتخاب کرده و دستور موردنظر را اجرا می کند.

first-letter : این انتخابگر اولین حرف تگ p را انتخاب کرده و دستور مورد نظر را به آن اعمال می کند.مواردی که می تواند در first-letter مورداستفاده قرار داد عبارتند از:


  √  font properties
  √  color properties
  √  background properties
  √  margin properties
  √  padding properties
  √  border properties
  √  text-decoration
  √  vertical-align (only if float is 'none')
  √  text-transform
  √  line-height
  √  float
  √  clear

first-line : این انتخابگر اولین خط از تگ p را انتخاب می کند و style مورد نظر را به آن اعمال می کند.first-line شامل ویژگی هایی می باشد که عبارتند از :


 √  font properties
  √  color properties
  √  background properties
  √  word-spacing
  √  letter-spacing
  √  vertical-align
  √  text-decoration
  √  text-transform
  √  line-height
  √  clear

first-child : این انتخابگر تمام تگ های p را انتخاب می کند و دستور مورد نظر را به آن اعمال می کند.

before : به اول تمامی تگ های p لینک http://sitedesign-co.ir را اضافه می کند.

after : بعد تگ های p لینک http://sitedesign-co.ir را اضافه می کند.

lang : این انتخابگر تمام تگ های p که با ویژگی lang=it شروع می شوند ر انتخاب کرده و دستورات مورد نظر را به آنها اعمال می کند.

element1~element2 : تمام تگ های ul که والد مشترکی با تگ p دارند را انتخاب می کند و دستورات را در آن ها اعمال می کند.

attribute^=value : تمام تگ های div که با ویژگی class="test" شروع میشوند را انتخاب کرده و style موردنظر را به آنها اعمال می کند.
attribute$=value : تمام تگ ها ی div که با ویژگی class="test"  هستند را انتخاب می کند و style مورد نظر را به آنها اعمال می کند.
attribute*=value : این انتخابگر تگ های div که ویژگی class="test" را شامل می شود را انتخاب کرده و style موردنظر را به آن اعمال می کند.

first-of-type : این خصوصیت در طراحی سایت ، اولین تگ p را انتخاب کرده و سپس دستور مورد نظر را در آن اعمال می کند.
last-of-type : این انتخابگر آخرین تگ p را انتخاب کرده و  دستورات مدنظر را در آن اعمال می کند.
only-of-type : این انتخابگر تگ p را که only child  والد خود باشد را انتخاب می کند و style موردنظر را به آن اعمال می کند.
()nth-child : تگ های p که دومین فرزند والد خود باشد را انتخاب کرده و دستور موردنظر را به آن اعمال می کند.

()nth-last-child : هر تگ <p>  که دومین فرزند (only child) والد (parent) خود از آخر باشد را  انتخاب و style مورد نظر را به آنها اعمال میکند.
()nth-of-type : هر تگ <p>  که دومین تگ <p> از والد (parent) خود  باشد را  انتخاب و style مورد نظر را به آنها اعمال میکند.
()nth-last-of-type : هر تگ <p>  که دومین تگ <p> از والد (parent) خود از آخر باشد را  انتخاب و style مورد نظر را به آنها اعمال میکند.
last-child :  برای هر تگ <p>  که آخرین فرزند (child) از والد (parent) خود  باشد را  انتخاب و style مورد نظر را به آنها اعمال میکند.
root : این عنصر در طراحی سایت تمامی تگ های html را انتخاب می کند و style مورد نظر را به آن اعمال می کند.

empty :  هر تگ <p>  که محتوایی نداشته باشد را  انتخاب و style مورد نظر را به آنها اعمال میکند.
enabled : تمام تگ های <input>  که  "type="text باشند و فعال باشند را  انتخاب و style مورد نظر را به آنها اعمال میکند.

disabled : تمام تگ های <input>  که  "type="text باشند وغیر فعال باشند را  انتخاب و style مورد نظر را به آنها اعمال میکند.
checked : تمام تگ های <input>  که  "type="checked باشند را  انتخاب و style مورد نظر را به آنها اعمال میکند. 
not :  تمامی تگ ها جز  تگ <p>  را  انتخاب و style مورد نظر را به آنها اعمال میکند.
selection : متن هایی که با دوبار کلیک کردن بر آنها انتخاب میشوند ، style مورد نظر را به آنها اعمال میکند.

ارسال نظر و نظرات ثبت شده
نام شما :
ایمیل :
تلفن تماس :
متن پیغام :
style انتخاب تگ های داخل تگ در سی اس اس مرجع انتخابگرها در CSS انتخابگر class در سی اس اس انتخابگر با نقطه در css class انتخاب بر اساس آی دی تگ در css انتخابگر ستاره در سی اس اس انتخاب بر اساس نام تگ در css انتخاب چند تگ با سی اس اس انتخاب تگ های فرزند و والد در سی اس اس انتخاب تگ بعدی در css انتخابگر hover انتخابگر hover در سی اس اس انتخابگر hover در css انتخابگر focus انتخابگر focus در سی اس اس انتخابگر بر اساس attribute انتخابگرها در css انتخاب ویژگی خاص در سی اس اس نتخاب تگ انتخاب تگ a انتخاب تگ لینک visited انتخاب تگ لینک hover انتخابگر first-letter انتخابگر first-letter در سی اس اس انتخابگر first-line در css انتخاب اولین حرف با سی اس اس انتخاب اولین خط با سی اس اس انتخابگر first-child در سی اس اس انتخابگر before در سی اس اس انتخابگر first-of-type در سی اس اس انتخاب اولین تگ از یک نوع با css انتخابگر last-of-type در سی اس اس انتخابگر only-of-type در سی اس اس انتخابگر nth-child در سی اس اس انتخاب انتخاب گر nth-last-child در سی اس اس nth-of-type در سی اس اس انتخابگر nth-last-of-type در سی اس اس انتخاب آخرین فرزند با سی اس اس سلکتور last-child در سی اس اس انتخابگر empty در css انتخابگر enabled در سی اس اس انتخابگر disabled در سی اس اس انتخابگر checked در سی اس اس انتخابگر after در css انتخابگر lang در سی اس اس انتخابگر والد مشترک در سی اس اس انتخابگر root در سی اس اس انتخابگر not در سی اس اس انتخابگر selection در سی اس اس