CSS Sayaç artışı ve karşıdan sıfırlama

Lütfen birisi bana sıfırlama sayacı alt birimine uygulanmadığı halde neden '1' aldığımı açıklayabilir.Yani 1.1 yerine 1.2, 1.2, 1.3 almamalıyım 1.1.1.1 Aynı h1 etiketi altında tüm h2 etiketi için? Ben CSS öğrenmede yeni başlayan biriyim ve herhangi biri açıklayabiliyorsa bana çok yardımcı olacaktır.Şimdiden teşekkürler. kodudur:CSS Sayaç artışı ve karşıdan sıfırlama

<!DOCTYPE html> 
<html> 
<head> 
<style> 
body { 
    counter-reset: section; 
} 

h1 { 
    counter-reset: section; 
} 

h1:before { 
    counter-increment: section; 
    content: "Section " counter(section) ". "; 
} 

h2:before { 
    counter-increment: subsection; 
    content: counter(section) "." counter(subsection) " "; 
} 
</style> 
</head> 

<body> 

<p><b>Note:</b> IE8 supports these properties only if a !DOCTYPE is specified.</p> 

<h1>HTML tutorials</h1> 
<h2>HTML Tutorial</h2> 
<h2>XHTML Tutorial</h2> 
<h2>CSS Tutorial</h2> 

<h1>Scripting tutorials</h1> 
<h2>JavaScript</h2> 
<h2>VBScript</h2> 

<h1>XML tutorials</h1> 
<h2>XML</h2> 
<h2>XSL</h2> 

</body> 
</html>

Çıktı: output

kaynak

2016-04-10 SFar

bu deneyin:

yerine

h1 { 
    counter-reset: section; 
}

ait Olacak

h1 { 
    counter-reset: subsection; 
}

kaynak

2016-04-10 18:04:26 satya

teşekkür ama aslında ben neler olduğunu öğrenmek istedi h1 yazınız {counter-reset: section} – SFar

counter-reset özellikli bu çok güzel makaleye bakın. o söylediği gibi

https://css-tricks.com/almanac/properties/c/counter-reset/

, h1 eleman yeni h1 kodunda meydana geldiğinde h2counter-increment sıfırlamak için kullanılır.

Örnek:

<h1>HTML tutorials</h1> // count 1 
<h2>HTML Tutorial</h2> // count 1.1 because you have one h1 above 
<h2>XHTML Tutorial</h2> // count 1.2 
<h2>CSS Tutorial</h2> // count 1.3 

<h1>Scripting tutorials</h1> // count 2 because of the new h1 tag 
<h2>JavaScript</h2> // count 2.1 because of the reset after the new h1 appears 
<h2>VBScript</h2> // count 2.2

Yani reset h2:before tezgahın üzerine düzgün çalışmasını sağlamak için bu kodu kullanmak zorunda:

h1 { 
    counter-reset: subsection // which is the name of h2 counter-increment; 
}

kaynak

2016-04-10 18:14:34

Teşekkürler ama ben h1 yazarken neler olup bittiğini bilmek istedim. {counter-reset: section} – SFar

Bu h1 değerini artırmaz: onu artırmak için ries, sıfırla. –

Tamam.Ama h2 ile ne oluyor: önceki değer? Neden bu bir artış değil? Alt bölüm sayacı herhangi bir yerde sıfırlanmıyor. – SFar

CSS Sayaç artışı ve karşıdan sıfırlama

cevap

İlgili konular