Yalnızca satır aralığı (<br> gibi) css'yi kullanarak

<br> gibi bir satır sonu oluşturmak için ek html etiketleri eklemeden saf css'de mümkün mü? ama her zaman "kullanımı gibi cevaplarla,Yalnızca satır aralığı (<br> gibi) css'yi kullanarak

h4 { display: inline; }

Böyle birçok soru bulduk

HTML

<li> Text, text, text, text, text. <h4>Sub header</h4> Text, text, text, text, text. </li>

CSS: Ben <h4> öğeden sonra satır sonu istiyorum, ama önce değil Ekran bloğu;" <h4> aynı satırda kalması gerektiğinde yapamadığım.

kaynak

2012-06-07 Steeven

Neden bu unsur bir h4 geçerli: http://jsfiddle.net/Bb2d7/

hüner buradan geliyor? Neden böyle bir yerde kullanıyorsun? – toniedzwiedz

Bizim merakımız,
kullanmak istememenizin sebebi nedir? –

Sebep: Çok fazla liste öğesi var. Ayrıca zarif bir çözümün var olup olmadığını merak ediyordum. Öğeler arasında br etiketler kullanmak genellikle hoş değildir (ve başlığın kendi öğesi olarak görüyorum) – Steeven

111

Bu gibi çalışır:

h4 { 
    display:inline; 
} 
h4:after { 
    content:"\a"; 
    white-space: pre; 
}

Örnek: https://stackoverflow.com/a/66000/509752 (daha fazla açıklama için)

kaynak

2012-06-07 14:44:27 adriantoine

Güzel. \ A ne yapar? – Steeven

'\ a', satır sonu, karakter U + 000A ve' white-space: tarayıcılara işlem sırasında satır sonu olarak davranmasını söyler. –

Tamam, teşekkürler @ JukkaK.Korpela. Öyleyse neden ilk etapta satır sonu olarak gösterilmiyor? Bu çözüm basit olsa da, diğer beyaz boşluk komutlarını geçersiz kılar. – Steeven

sizin css

h4{ display:block;}

deneyin

http://jsfiddle.net/ZrJP6/

kaynak

2012-06-07 14:30:24

artı “margin-bottom” in bir miktar kullanımı sizi oraya götürmelidir. –

Ama eğer iyi anlarsam, h4 daha önce metinle aynı çizgide olmalı. Ekranda: blok, h4'ten önce bir satır sonu var. – adriantoine

Ne? 'margin-bottom' h4'ü önceki metinle aynı çizgiye koyacaktır? – Steeven

Etkili sonraki satıra <h4> sonra bir şey taşır, hangi <h4> sonra 0px -height blok oluşturmak için ::after kullanabilirsiniz :

h4 { 
 
    display: inline; 
 
} 
 
h4::after { 
 
    content: ""; 
 
    display: block; 
 
}

<ul> 
 
    <li> 
 
    Text, text, text, text, text. <h4>Sub header</h4> 
 
    Text, text, text, text, text. 
 
    </li> 
 
</ul>

kaynak

2012-06-07 14:35:43 0b10011

Yalnızca satır aralığı (<br> gibi) css'yi kullanarak

cevap

İlgili konular