آموزش شبه کلاس empty در CSS
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش شبه کلاس empty در CSS با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
شبه کلاس Empty در CSS
با استفاده از شبه کلاس ( یا هم انتخابگر ) empty در CSS میتوان برای عناصری که خالی هستند ( محتوایی ندارند ) استایل دلخواه تعریف کرد.
اگر در یک عنصر حتی ۱ عدد فاصله وجود داشته باشد، دیگه اون عنصر خالی نیست و یک عنصر محتوا دار حساب میشه.
| نسخه | CSS3 |
|---|
Free-Learn
مثال از شبه کلاس Empty در CSS
در ادامه میتوانید یک مثال از این انتخابگر / شبه کلاس را در زبان CSS مشاهده نمایید.
مثال شماره ۱ : استفاده سراسری ( تمامی عناصر خالی در صفحه را انتخاب میکند )
|
1 2 3 4 |
:empty{ background-color:#607D8B; color:#fff; } |
مثال شماره ۲ : استفاده در یک تگ خاص
|
1 2 3 4 |
p:empty{ background-color:#607D8B; color:#fff; } |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از انتخابگر / شبه کلاس empty در CSS پشتیبانی میکنند یا خیر.
| نام انتخابگر | Chrome | Firefox | Opera | Safari | IE |
| empty: | ۴٫۰ | ۳٫۵ | ۹٫۶ | ۳٫۲ | ۹ |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این انتخابگر / شبه کلاس در CSS بصورت زیر می باشد.
|
1 2 3 |
:empty { دستورات سی اس اس در اینجا } |
Free-Learn
نکات و توضیحات
در مثال های شماره ۱ و ۲ با استفاده از شبه عنصر after و ویژگی content تونستیم کاری کنیم که یک متن ( مثلا این عنصر خالی هست ) در عناصر خالی چاپ شود.
