- Konu sahibi
- #1
HTML
Etiketin içeriği yoktur ve HTML kullanımında kapanış etiketi yazılmaz. Doğru temel kullanım şöyledir:
Bu dosyayı
Bir bölüm içinde konu değişiyor, fakat yeni bir başlık açmak gerekmiyorsa
Aşağıdaki ayrım, doğru HTML öğesini seçmeyi kolaylaştırır:
Bir sayfada sadece dekoratif bir çizgi istiyorsanız, mevcut uygun öğeye
Tersine, iki paragraf arasında gerçekten tematik bir ayrım varsa yalnızca CSS ile çizgi çizmek anlamı kaybettirir. Bu durumda
Burada
Hayır.
Hayır. HTML’de
Yeni HTML’de görsel ayarları CSS ile yapın. Eski sunum öznitelikleri yerine hizalama için margin, kalınlık ve renk için border gibi özellikleri kullanmak anlam ile görünümü ayırır. Tematik ayrımı anlatan hr öğesi bu sırada korunabilir.
<hr> etiketi, aynı bölüm içindeki iki içerik grubu arasında anlamsal bir konu geçişini belirtir. Örneğin bir makalede sahne değişimini, yeni bir alt konuya geçişi veya birbirinden ayrılan içerik gruplarını göstermek için kullanılır. Tarayıcılar bunu çoğunlukla yatay bir çizgi olarak gösterir; ancak etiketin asıl amacı çizgi çizmek değil, içerik akışındaki tematik ayrımı ifade etmektir.Etiketin içeriği yoktur ve HTML kullanımında kapanış etiketi yazılmaz. Doğru temel kullanım şöyledir:
Kod:
<!doctype html>
<html lang="tr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>hr örneği</title>
</head>
<body>
<h1>Proje notları</h1>
<p>İlk bölümde kurulum adımları anlatılıyor.</p>
<hr>
<p>Buradan sonra sorun giderme bilgileri başlıyor.</p>
</body>
</html>Bu dosyayı
hr-ornek.html adıyla kaydedip tarayıcıda açtığınızda, iki paragraf arasında varsayılan tarayıcı görünümünde bir ayraç görmelisiniz. Çizgi görünmüyorsa önce dosyanın gerçekten HTML olarak kaydedildiğini ve <hr> ifadesinin açılış-kapanış etiketiyle yanlış yazılmadığını kontrol edin. Görünüm farklıysa bu genellikle tarayıcının varsayılan stilinden veya sayfadaki CSS kurallarından kaynaklanır; etiketin anlamsal görevi değişmez.hr ne zaman kullanılmalı?
Bir bölüm içinde konu değişiyor, fakat yeni bir başlık açmak gerekmiyorsa
<hr> uygun bir seçimdir. Örneğin haber metninde ana anlatımdan ek bilgiye geçiş veya hikâyede yeni bir sahneye geçiş bu kapsama girer.Aşağıdaki ayrım, doğru HTML öğesini seçmeyi kolaylaştırır:
| İhtiyaç | Uygun çözüm | Nedeni |
|---|---|---|
| İçerik içinde konu geçişi | <hr> | Anlamsal tematik ayrım belirtir |
| İki bölüme açıklayıcı ad vermek | <h2> veya başka bir başlık | Yeni bölümün konusunu açıklar |
| Yalnızca dekoratif çizgi göstermek | CSS border | Görsel tasarım amacını karşılar |
hr ile yalnızca görsel çizgi arasındaki fark
Bir sayfada sadece dekoratif bir çizgi istiyorsanız, mevcut uygun öğeye
border vermek veya uygun bir tasarım kuralı kullanmak daha doğrudur. Çünkü bu durumda çizginin içerik yapısında bir konu geçişi anlamı yoktur.Tersine, iki paragraf arasında gerçekten tematik bir ayrım varsa yalnızca CSS ile çizgi çizmek anlamı kaybettirir. Bu durumda
<hr> kullanıp görünüşünü CSS ile değiştirebilirsiniz:
Kod:
hr {
border: 0;
border-top: 1px solid #999;
margin: 1.5rem 0;
}Burada
<hr> anlamı, CSS ise görünümü sağlar. CSS kuralı çizgiyi kalınlaştırabilir, rengini değiştirebilir veya boşluklarını ayarlayabilir; fakat etiketi sırf boşluk oluşturmak için kullanmamak gerekir. Sadece dikey veya yatay mesafe istiyorsanız, ilgili kapsayıcının margin ya da padding özelliklerini düzenleyin.Sık yapılan hatalar
-
<hr></hr>yazmak: HTML’de bu öğe için kapanış etiketi gerekmez;<hr>yeterlidir. - Her bölüm başlığının arasına
<hr>eklemek: Başlıklar ve bölüm yapısı zaten konu değişimini ifade ediyorsa ek ayraç gereksiz olabilir. - Boşluk bırakmak için kullanmak:
<hr>anlamsal bir öğedir; aralık oluşturma görevi CSS’e aittir. - Dekoratif çizgiyi anlamsal öğe sanmak: Çizgi içerik geçişi anlatmıyorsa CSS
bordertercih edilmelidir.
<hr> gördüğünüz çizgiden daha fazlasıdır: HTML belgesinde konu akışının anlamlı biçimde değiştiğini belirtir. Önce çizginin içerik açısından bir geçiş ifade edip etmediğine karar verin; ediyorsa <hr> kullanın, etmiyorsa yalnızca CSS ile görsel tasarım yapın.Sık sorulan sorular
hr etiketi sayfanın bölüm yapısını değiştirir mi?
Hayır.
<hr> bir konu geçişini belirtir; yeni bir başlık veya yeni bir bölüm adı oluşturmaz. Bölüm hiyerarşisi için başlık ve bölüm öğelerini kullanmalısınız.HTML’de hr sonuna eğik çizgi koymak zorunda mıyım?
Hayır. HTML’de
<hr> bir void öğedir; kapanış etiketi olmaz. <hr /> yazımı HTML’de kullanılabilir, ancak eğik çizgi öğeye ayrı bir kapanış davranışı eklemez. XML/XHTML sözdiziminin kuralları farklıdır.Eski align veya size özniteliklerini kullanmalı mıyım?
Yeni HTML’de görsel ayarları CSS ile yapın. Eski sunum öznitelikleri yerine hizalama için margin, kalınlık ve renk için border gibi özellikleri kullanmak anlam ile görünümü ayırır. Tematik ayrımı anlatan hr öğesi bu sırada korunabilir.
