الفرق بين المراجعتين لصفحة: «CSS/:lang»
< CSS
لا ملخص تعديل |
لا ملخص تعديل |
||
| (مراجعتان متوسطتان بواسطة مستخدمين اثنين آخرين غير معروضتين) | |||
| سطر 15: | سطر 15: | ||
== أمثلة == | == أمثلة == | ||
استخدمنا الصنف الزائف <code>:lang()</code> في المثال الآتي لمُطابقة العنصر الأب للاقتباسات <code>[[HTML/q|<nowiki><q></nowiki>]]</code> باستخدام [[CSS/Child Selectors|مُحدِّد الأبناء]]:<syntaxhighlight lang="html"> | استخدمنا الصنف الزائف <code>:lang()</code> في المثال الآتي لمُطابقة العنصر الأب للاقتباسات <code>[[HTML/q|<nowiki><q></nowiki>]]</code> باستخدام [[CSS/Child Selectors|مُحدِّد الأبناء]]:<syntaxhighlight lang="html"> | ||
<div lang="en"><q> | <div lang="en"><q>هذا الاقتباس يحوي على <q>اقتباس داخلي</q> فيه.</q></div> | ||
<div lang="fr"><q> | <div lang="fr"><q>هذا الاقتباس يحوي على <q>اقتباس داخلي</q> فيه.</q></div> | ||
<div lang="de"><q> | <div lang="de"><q>هذا الاقتباس يحوي على <q>اقتباس داخلي</q> فيه.</q></div> | ||
</syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css"> | </syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css"> | ||
| سطر 41: | سطر 41: | ||
|3.1 | |3.1 | ||
|} | |} | ||
==مصادر ومواصفات== | ==انظر أيضًا== | ||
* صفحة الخاصية <code>[[CSS/direction|direction]]</code> التي تضبط اتجاه النص. | |||
== مصادر ومواصفات == | |||
*مسودة [https://drafts.csswg.org/selectors-4/#lang-pseudo Selectors Level 4]. | *مسودة [https://drafts.csswg.org/selectors-4/#lang-pseudo Selectors Level 4]. | ||
*مواصفة [https://drafts.csswg.org/selectors-3/#lang-pseudo Selectors Level 3]. | *مواصفة [https://drafts.csswg.org/selectors-3/#lang-pseudo Selectors Level 3]. | ||
*مواصفة [http://www.w3.org/TR/CSS2/selector.html#lang CSS Level 2 (Revision 1)]. | *مواصفة [http://www.w3.org/TR/CSS2/selector.html#lang CSS Level 2 (Revision 1)]. | ||
[[تصنيف:CSS]] | [[تصنيف:CSS|{{SUBPAGENAME}}]] | ||
[[تصنيف:CSS Selectors]] | [[تصنيف:CSS Selectors|{{SUBPAGENAME}}]] | ||
[[تصنيف:CSS pseudo-class]] | [[تصنيف:CSS pseudo-class|{{SUBPAGENAME}}]] | ||
المراجعة الحالية بتاريخ 14:11، 24 أكتوبر 2018
الصنف الزائف :lang() في CSS (أي pseudo-class) يطابق العناصر اعتمادًا على لغة تلك العناصر.
هذا المُحدِّد يُحدِّد أيّة عناصر <p> مكتوبة باللغة الإنكليزية:
p:lang(en) {
quotes: '\201C' '\201D' '\2018' '\2019';
}
لاحظ أنَّ اللغة في مستندات HTML تُحدَّد عبر الخاصية lang، والعنصر <meta>، وقد تؤخذ معلومات من البروتوكول (مثل ترويسات HTTP).
الشكل العام لهذا المحدد:
:lang( <language-code> )
حيث <language-code> هي سلسلة نصية <string> تُمثِّل اللغة التي تريد تحديد العناصر المكتوبة فيها، والقيم المسموحة مُعرَّفة في مواصفة BCP 47.
أمثلة
استخدمنا الصنف الزائف :lang() في المثال الآتي لمُطابقة العنصر الأب للاقتباسات <q> باستخدام مُحدِّد الأبناء:
<div lang="en"><q>هذا الاقتباس يحوي على <q>اقتباس داخلي</q> فيه.</q></div>
<div lang="fr"><q>هذا الاقتباس يحوي على <q>اقتباس داخلي</q> فيه.</q></div>
<div lang="de"><q>هذا الاقتباس يحوي على <q>اقتباس داخلي</q> فيه.</q></div>
شيفرة CSS:
:lang(en) > q { quotes: '\201C' '\201D' '\2018' '\2019'; }
:lang(fr) > q { quotes: '« ' ' »'; }
:lang(de) > q { quotes: '»' '«' '\2039' '\203A'; }
دعم المتصفحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | 1.0 | 1.0 | 8.0 | 8.0 | 3.1 |
انظر أيضًا
- صفحة الخاصية
directionالتي تضبط اتجاه النص.
مصادر ومواصفات
- مسودة Selectors Level 4.
- مواصفة Selectors Level 3.
- مواصفة CSS Level 2 (Revision 1).