CSS Ben bir paragraf önce açık tırnak eklemek için aşağıdaki CSS kullanıyorum 1 tırnak işareti

Question

gösterir:

blockquote { 
    padding: 22px; 
    quotes: "\201C""\201D""\2018""\2019"; 
    font-size: 15px; 
} 
blockquote:before { 
    color: #111; 
    content: open-quote; 
    font-size: 4em; 
    line-height: 0; 
    vertical-align: -0.4em; 
} 

Ben ikiden fazla blockquotes eklemek

sadece 1 tırnak işareti göstermektedir. 2 "'u göstermek istiyorum. Bunun neden olduğunu anlayamıyorum. Örneğin jsfiddle'a bakınız.

http://jsfiddle.net/yg7j5mkm/

Answer 1

Sen tırnak önce başka birini açmak kapanmalıdır.

İşte bir çözüm: Tırnakları kapatın, ancak görünmez.

blockquote { 
 
    padding: 22px; 
 
    quotes: "\201C""\201D""\2018""\2019"; 
 
    font-size: 15px; 
 
} 
 
blockquote:before { 
 
    color: #111; 
 
    content: open-quote; 
 
    font-size: 4em; 
 
    line-height: 0; 
 
    vertical-align: -0.4em; 
 
} 
 
blockquote:after { 
 
    visibility: hidden; 
 
    color: #111; 
 
    content: close-quote; 
 
    font-size: 4em; 
 
    line-height: 0; 
 
    vertical-align: -0.4em; 
 
}

<blockquote> 
 
    <p style="display:inline;">Lorem ipsum dolor...</p> 
 
</blockquote> 
 

 
<blockquote> 
 
    <p style="display:inline;">Lorem ipsum dolor...</p> 
 
</blockquote> 
 

 
<blockquote> 
 
    <p style="display:inline;">Lorem ipsum dolor...</p> 
 
</blockquote>

Answer 2

http://www.w3.org/TR/CSS21/generate.html#quotes-insert:

kullanıldığı tırnak çifti tırnak yuvalanma düzeyine bağlıdır : 'open-quote olay sayısını her oluşturulan metinde Mevcut olaydan önce, eksi 'yakın teklif' olaylarının sayısı. Derinlik 0 ise derinliği 1 ise, birinci çifti vb

Eğer ikinci için, burada close-quote kullandığınız Since, ikinci çifti kullanılır, kullanıldığı sen bir var daha önce open-quote oluşumu ve close-quote - anlamı, derinlik 1, yani ikinci çift olarak belirttiğiniz alıntılar kullanılır. ,

Bunu düzeltmek için (. “Yuvalama” mutlaka bu tanım gereği iç içe unsurları anlamına gelmez) yanı close-quote kullanmak - Bunları göstermek istemiyorsanız onları ve gizlemek:

blockquote:after { 
    content: close-quote; 
    visibility:hidden; /* to hide closing quote – don’t use display:none here, 
         because that would mean close-quote is absent again */ 
} 

http://jsfiddle.net/yg7j5mkm/2/