:root Pseudo-class
شبه کلاس root: در CSS به شما این اجازه را می دهد که بالاترین سطح عنصر DOM را در ساختار html را هدف قرار دهید.
شاید به هنگام کار با شبه کلاس root: اینطور به نظر برسد که تفاوتی میان این سودو کلاس و انتخابگر html در CSS وجود نداشته باشد. اما از آنجایی که زبان استایل دهی CSS در دیگر قالبها از جمله XML و SVG نیز کاربرد دارد، لذا در این موارد، شبه کلاس root: به عنصر دیگری اشاره خواهد کرد. صرف نظر از قالب سندی (document) که استفاده می شود، root: به بالاترین عنصر در ساختار درختی عناصر اشاره خواهد کرد.
در مثال زیر شبه کلاس root: برای هدف قرار دادن رنگ پیش زمینه <body> استفاده شده است. در این مورد استفاده از انتخابگر html تاثیر مشابهی خواهد داشت:
html
<p>این مثالی از کاربرد سودو کلاس root: می باشد.</p>
css
:root {
background-color: tomato;
padding: 3em;
}
body {
background-color: white;
padding: 1.5em;
direction: rtl;
}
مشاهده و ویرایش کد در حالت تمام صفحه
پشتیبانی مرورگرها
تمام مرورگرها از این شبه کلاس در CSS پشتیبانی می کنند.
