آموزش CSS (فصل دوازدهم - جلسه دوم) : سایر گزینشگرها در CSS

دسته بندی: آموزش
زمان مطالعه: 1 دقیقه
۱۱ خرداد ۱۳۹۲

در این جلسه از آموزش css با گزینشگرهای صفت یا همان attr selectors آشنا خواهیم شد. همانطور که میدانید تگ‌های html دارای صفت هایی نیز هستند ما در این جلسه خواهیم آموخت که چگونه به هر تگ با صفت‌های مختلف استایل متفاوتی دهیم.

گزینشگرهای صفت

برای انتخاب یک صفت در css پس از انتخاب تگ، صفت و مقدار آنرا در داخل [] قرار می‌دهیم به کد زیر دقت کنید :

tagname[attribute="value"] {
// some code
}

برای مثال می‌خواهیم با استفاده از صفت alt رنگ متن مان را تغییر دهیم کد html

<p alt="red-text">7learn</p>
<p alt="blue-text">7learn</p>

کد css

p[alt="red-text"] {color: red;}
p[alt="blue-text"] {color: blue;}

دقت داشته باشید که می‌توان از همه صفت‌های موجود استفاده کرد حتی class و id به طور مثال :

p[class="blue-text"] {color: blue;}

این کد تعیین میکند تگ p که مقدار صفت class ان برابر با blue-text است رنگش را برابر با آبی قرار بده. کد بالا و کد

.blue-text {color: blue;}

کار یکسانی را انجام می‌دهند. البته فقط مرورگرهای مدرن و ie9+ از همه ی صفت‌ها پشتیبانی می‌کنند مرورگرهای قدیمی فقط از تگ input، صفت type پشتیبانی می‌کنند. بسیار خب اموزش این جلسه به پایان رسید در جلسه بعدی با سایر خصوصیات موجود در css آشنا خواهیم شد.

چه امتیازی به این مقاله می دید؟
نویسنده طاها دریس

جلسات دوره

نظرات کاربران

عرفان

ممنون

safiran

سلام
آقا دمت گرم، خسته نباشی… بسیار مفید بود
فقط فکر کنم اون تگ input تو بعضی از مرورگرهای قدیمی هم پشتیبانی نمیشن.(مرورگرهای خیلی قدیمی و فاجعه 😀 )

حسن

سجاد جان واقعا دمت گرم !
خیلی حال کردم ! میبینم ! آموزش ها باز پشت سر هم مرتب میزاری !
واقعا خسته نباشی دست مریزاااااااااااا

سجاد دریس

سلام حسن جان.
ما مخلص شماییم.!
ممنون.

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.