الخاصية quotes
< CSS
الخاصية quotes في CSS تُشير إلى الطريقة التي يجب أن يعرض فيها المتصفح علامات الاقتباس.
بطاقة الخاصية
| القيمة الابتدائية | تختلف حسب المتصفح. |
|---|---|
| تُطبَّق على | جميع العناصر. |
| قابلة للوراثة | نعم |
| قابلة للحركة | لا |
| القيمة المحسوبة | كما حُدِّدَت. |
/* كلمة محجوزة */
quotes: none;
/* <string> سلاسل نصية */
quotes: "«" "»"; /* ضبط علامة الاقتباس الابتدائية والنهائية */
quotes: "«" "»" "‹" "›"; /* ضبط مستويين من الاقتباس */
/* القيم العامة */
quotes: inherit;
quotes: initial;
quotes: unset;
أمثلة
مثال على جملة فيها علامة اقتباس مفردة، وسنضيف حولها علامتَي اقتباس مزدوجتين، وذلك باستخدام الخاصية content:
<q>To be or not to be. That's the question!</q>
شيفرة CSS:
q {
quotes: '"' '"' "'" "'";
}
q::before {
content: open-quote;
}
q:after {
content: close-quote;
}
سنستخدم جملةً فيها مستويين من الاقتباس وسنجرِّب مختلف القيم عليها:
<p class="ex1">Set <q>quotes <q>inside</q> quotes</q> quotation marks.</p>
<p class="ex2">Set <q>quotes <q>inside</q> quotes</q> quotation marks.</p>
<p class="ex3">Set <q>quotes <q>inside</q> quotes</q> quotation marks.</p>
<p class="ex4">Set <q>quotes <q>inside</q> quotes</q> quotation marks.</p>
شيفرة CSS:
q::before {
content: open-quote;
}
q:after {
content: close-quote;
}
.ex1 { quotes: '‘' '’'; }
.ex2 { quotes: '“' '”' '‘' '’'; }
.ex3 { quotes: '\'' '\'' '"' '"'; }
.ex4 { quotes: '«' '»' '‹' '›'; }
دعم المتصفحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | 11 | 1.5 | 8.0 | 4.0 | 9.0 |
البنية العامة
الخاصية quotes تقبل القيم الآتية.
none
القيمتان open-quote و close-quote في خاصية content لن تؤديا إلى إظهار علامة اقتباس.
[<string> <string>]+
زوجٌ من القيم النصية <string> أو أكثر لتُستعمَل مع open-quote و close-quote في الخاصية content. لاحظ أنَّ أوّل زوج يُمثِّل أعلى مستوى من مستويات الاقتباس، أما الزوج الثاني فهو يمثل المستوى الذي يليه، وهكذا.
هذا جدولٌ يضم بعض أشكال علامات الاقتباس:
| علامة الاقتباس | الوصف |
|---|---|
"
|
علامة اقتباس مزدوجة |
'
|
علامة اقتباس مفردة |
‹
|
علامة اقتباس مفردة على شكل زاوية |
›
|
علامة اقتباس مفردة على شكل زاوية |
«
|
علامة اقتباس مزدوجة على شكل زاوية |
»
|
علامة اقتباس مزدوجة على شكل زاوية |
‘
|
علامة اقتباس مفردة على شكل الرقم 6 (للبداية) |
’
|
علامة اقتباس مفردة على شكل الرقم 9 (للنهاية) |
“
|
علامة اقتباس مزدوجة على شكل الرقم 6 (للبداية) |
”
|
علامة اقتباس مزدوجة على شكل الرقم 9 (للنهاية) |
„
|
علامة اقتباس مزدوجة على شكل الرقم 9 (سفلية) |
البنية الرسمية
quotes: none | [ <string> <string> ]+;
مصادر ومواصفات
- مواصفة CSS Level 2 (Revision 1).