برگه تقلب انتخابگر CSS کامل: راهنمای عملی با تصاویر😍

انتخابگرهای CSS می توانند چالش برانگیز به نظر برسند زیرا طیف گسترده ای از گزینه ها را برای انتخاب عناصر HTML به سبک ارائه می دهند و درک گزینه های مختلف موجود و نحوه کار آنها ضروری است. علاوه بر این، انتخابگرها به شما این امکان را میدهند که عناصر، کلاسها، شناسهها، ویژگیها و حتی شبه عناصر را بر اساس ساختار و روابط آنها با عناصر دیگر در HTML خود هدف قرار دهید.
📒 بنابراین، من راهنمای کامل/دوره خرابی/برگ تقلب، هر چه اسمش را بگذارید، انتخابگرهای CSS را ارائه کردهام تا زندگی شما را آسانتر کنم.
انتخابگرهای پایه
نام | CSS | شرح | نتیجه |
---|---|---|---|
Universal Selector |
* |
Select all elements |
![]() |
Type |
div |
Select elements of that type ` |
![]() |
Class |
ج | Select elements with that class |
![]() |
Id |
#i |
Select elements with that id |
![]() |
ترکیبی از انتخابگرها
صفت
انتخابگر شبه عنصر
نام | CSS | شرح | نتیجه |
---|---|---|---|
Before |
div::before |
Creates an empty element directly before the children of selected element |
![]() |
After |
div::after |
Creates an empty element directly after the children of selected element |
![]() |
حالت کلاس شبه
نام | CSS | شرح |
---|---|---|
Hover |
button:hover |
Select elements that are hovered by the mouse |
Focus |
button:focus |
Select elements that are focused. |
Required |
input:required |
Select inputs that are required |
Checked |
input:checked |
Select checkboxes/radio buttons that are checked |
Disabled |
input:disabled |
Select inputs that are disabled |
موقعیت کلاس شبه / سایر
نتیجه
امیدوارم همه این انتخابگرهای CSS را سریع برای شما توضیح داده باشم. اگر اشتباهی در مقاله وجود دارد یا چیزی را از قلم انداخته ام، لطفاً در قسمت نظرات ذکر کنید.
با تشکر از خواندن مقاله همه شما را در مقاله بعدی خود خواهم دید👨💻