انتخاب‌گرهای عناصر CSS

انتخاب‌گرهای عناصر CSS

معروف‌ترین انتخاب‌گرهای CSS، انتخاب‌گرهای عنصر هستند. به عبارت دیگر، عناصر سند، انتخاب‌گرهای پایه هستند.

وقتی استایل‌های HTML را تنظیم می‌کنید، انتخاب‌گر معمولاً یک عنصر HTML است، مانند p، h1، em، a، حتی می‌تواند html خود باشد:

html {color:black;}
h1 {color:blue;}
h2 {color:silver;}

آزمایش کنید

می‌توان استایل را از یک عنصر به عنصر دیگری تغییر داد.

فرض کنید که تصمیم گرفته‌اید پاراگراف‌های بالا (و نه عناصر h1) را به رنگ خاکستری تنظیم کنید. کافی است انتخاب‌گر h1 را به p تغییر دهید:

html {color:black;}
p {color:gray;}
h2 {color:silver;}

آزمایش کنید

انتخاب‌گر نوع

در استاندارد W3C، انتخاب‌گر عنصر نیز به عنوان انتخاب‌گر نوع (type selector) شناخته می‌شود.

«انتخاب‌گر نوع، نام نوع عناصر زبان سند را تطبیق می‌دهد. انتخاب‌گر نوع با هر نمونه‌ای از نوع عناصر در درخت سند مطابقت دارد.»

این قوانین با تمام عناصر h1 در درخت سند مطابقت دارند:

h1 {font-family: sans-serif;}

بنابراین، ما می‌توانیم برای عناصر سند XML نیز استایل‌ها تنظیم کنیم:

سند XML:

<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href="note.css"?>
<note>
<to>George</to>
<from>John</from>
<heading>یادآوری</heading>
<body>Nezarm dar shabeh ra nabargah kon!</body>
</note>

مستند CSS:

note
  {
  font-family:Verdana, Arial;
  margin-left:30px;
  }
to
  {
  font-size:28px;
  display: block;
  }
from
  {
  font-size:28px;
  display: block;
  }
heading
  {
  color: red;
  font-size:60px;
  display: block;
  }
body
  {
  color: blue;
  font-size:35px;
  display: block;
  }

نتیجه را مشاهده کنید

با توجه به مثال‌های بالا، می‌توانید ببینید که انتخاب‌گرهای عناصر CSS (انتخاب‌گرهای نوع) می‌توانند استایل‌های عناصر مستندات XML را تنظیم کنند.

اگر نیاز به اطلاعات بیشتری در مورد افزودن استایل به مستندات XML دارید، لطفاً به CodeW3C مراجعه کنید آموزش XML.