سبد خرید (0)

تبلیغات

گزینش عناصر بر اساس ویژگی

style دادن به عناصر HTMLی که یک صفت (Attribute) خاص دارند

Wiki

علاوه بر اینکه عناصر HTML را می توان بر اساس id یا classشان style داد، این امکان نیز وجود دارد که آنها را بر اساس یک attribute خاص قالب بندی کرد.

توجه: IE7 و IE8 مورد بالا را تنها در صورتی که یک DOCTYPE! در بالای صفحه اعلان شده باشد، پشتیبانی می کنند. در IE6 و نسخه های پایین تر گزینشگر attribute پشتیبانی نمی شود.


گزینشگر Attribute

Wiki

در مثال زیر، رنگ متن تمام عناصر با صفت title آبی خواهد شد:

مثال (گزینش عناصر بر اساس ویژگی)

[title]
{
color:blue;
}
خودتان امتحان کنید »

گزینشگر و مقدار یک Attribute

Wiki

در مثال زیر، تمام عناصری که صفت title آنها با مقدار "beyamooz" تنظیم شده است، styleدهی شده:

مثال (گزینش عناصر بر اساس ویژگی)

[title=beyamooz]
{
border:5px solid green;
}
خودتان امتحان کنید »

در مثال زیر، رنگ متن همه عناصری که صفت title آنها شامل کلمه "hello" باشد، آبی خواهد شد:

مثال (گزینش عناصر بر اساس ویژگی)

[title~=hello] { color:blue; }
خودتان امتحان کنید »

در مثال زیر، رنگ متن همه عناصری که صفت lang آنها شامل کلمه "en" یا "-en" باشد، آبی خواهد شد:

مثال (گزینش عناصر بر اساس ویژگی)

[lang|=en] { color:blue; }
خودتان امتحان کنید »

Style دادن عناصر input

Wiki

گزینشگر Attribute به طور خاص برای style دادن به فرم هایی که کلاس یا ID ندارند مفیداند:

مثال (گزینش عناصر بر اساس ویژگی)

input[type="text"]
{
width:150px;
display:block;
margin-bottom:10px;
background-color:yellow;
}
input[type="button"]
{
width:120px;
margin-left:35px;
display:block;
}
خودتان امتحان کنید »

دیدگاه‌ها  

+2 # Pouriya 1395-02-20 12:17
سلام .
میخواستم بپرسم در این قسمت
[title~=hello] { color:blue; }
علامت ~ به چه علت قرار گرفته ؟ چون تو مثال های قبلی برای انتخاب صفت ها از ~ استفاده نشده بود .
با تشکر از سایت خوبتون .
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # ali bayervand 1394-07-02 17:44
سلام و خسته نباشد
چرا از این style هایی که بهattribute اختصاص داده میشود استفاده میکنید.
ممنون
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # شهربانو دوستی 1394-07-02 23:46
با سلام
استفاده از استایل ها در حالت کلی برای ایجاد تغییرات دلخواه بر روی شکل ظاهری عنصر مورد نظر استفاده می شود.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن

آموزش صوتی CSS

بستن
مدرس:
سوال و جواب:

ابزاری که در پیش روی دارید یکی از ابزارهای بسیار کاربردی سایت بیاموز در زمینه آموزش است، این ابزار برای سهولت یادگیری شما کاربران محترم طراحی شده است.

فقط کافی است روی عنوان پاراگراف مورد نظرتان کلیک کنید تا پخش صدا آغاز شود ...!

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت پرداخت آنلاین - بانک پارسیان پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی