Apakah terkadang buruk menggunakan <BR />?

Apakah kadang-kadang buruk menggunakan <BR/>tag?

Saya bertanya karena beberapa saran pertama yang diberikan tim pengembangan saya kepada saya adalah ini: Jangan gunakan <BR/>; alih-alih, gunakan gaya. Tapi kenapa? Apakah ada hasil negatif saat menggunakan <BR/>tag?

Alasan utama untuk tidak menggunakan <br>adalah bahwa itu bukan semantik . Jika Anda ingin dua item dalam blok visual yang berbeda, Anda mungkin menginginkannya dalam blok logis yang berbeda.

Dalam kebanyakan kasus ini berarti hanya menggunakan elemen yang berbeda, misalnya <p>Stuff</p><p>Other stuff</p>, dan kemudian menggunakan CSS untuk menempatkan blok dengan benar.

Ada kasus di mana <br>semantik berlaku, yaitu kasus di mana garis putus adalah bagian dari data yang Anda kirim. Ini hanya sebatas 2 kasus penggunaan - puisi dan alamat surat.

Saya pikir tim pengembangan Anda merujuk <br />di tempat jarak margin. Untuk membuat ruang kosong di antara elemen, gunakan gaya padding / margin melalui CSS.

Penggunaan salah <br />:

<div>
   Content
</div>
<br />
<br />
<br />
<br />
<div>
     More content...
</div>

Baik digunakan <br />:

<style>
     div {
          margin-top:10px;
     }
</style>

<div>
   Content<br />
   Line break
</div>

<div>
     More content...
</div>

Secara umum, <br/>merupakan indikasi HTML semantik yang buruk. Kasus yang paling umum digunakan <br/>untuk menyatakan pemisahan paragraf, yang ada banyak cara yang lebih baik untuk melakukannya secara semantik. Lihat Tempat Tidur dan BReakfast .

Ada saat-saat di mana itu adalah tanda yang tepat untuk digunakan, tetapi cukup sering disalahgunakan sehingga orang mengadopsi mentalitas "jangan gunakan" untuk memaksa pemikiran semantik yang lebih baik.

Apa yang dimaksud oleh tim Anda mungkin tidak menggunakan Situs untuk membagi antara paragraf.

<p>I am a paragraph</p>
<p>I am a second paragraph</p>

adalah cara yang lebih baik untuk melakukan itu, karena Anda kemudian dapat dengan mudah menyesuaikan spasi antara paragraf melalui CSS. Selain itu, saya tidak bisa memikirkan apa pun yang berbicara tentang garis putus seperti itu.

Konsep yang sama berlaku untuk mengapa kita tidak menggunakan tabel untuk tata letak - gunakan tabel untuk tabel dan CSS untuk tata letak.

Gunakan <br/>untuk memecah baris dalam blok teks dan CSS jika Anda ingin memengaruhi tata letak.

Menentukan tata letak secara langsung membuat sulit mengadaptasi situs untuk berbagai ukuran halaman atau font misalnya.

Saya biasanya akan selalu mengatur margin dan padding yang tepat pada elemen menggunakan CSS - itu jauh lebih berantakan daripada banyak <br />s di semua tempat selain lebih semantik benar.

Mungkin satu-satunya waktu saya akan menggunakan <br />dalam preferensi untuk margin dan padding yang ditetapkan oleh CSS, bahkan jika itu tidak benar secara teknis benar, adalah jika itu adalah insiden terisolasi di mana sedikit lebih banyak ruang diperlukan. Jika saya mendapatkan stylesheet yang cukup besar dan sepertinya tidak ada gunanya menyiapkan gaya tambahan hanya untuk satu kejadian, saya dapat menggunakan <br />sebagai satu kali.

Seperti kebanyakan hal, <br />itu bukan hal yang buruk asalkan mereka digunakan dengan benar.

Saya mencoba menulis markup dengan cara yang mudah dibaca dengan CSS dinonaktifkan. Jika Anda hanya menggunakan BRs untuk menambahkan spasi, lebih baik menggunakan margin dan padding.

<br />harus digunakan hanya untuk jeda baris, dan tidak untuk menerapkan gaya ke halaman. Misalnya, jika Anda membutuhkan ruang ekstra di antara paragraf, beri mereka kelas dan terapkan bantalan ekstra untuk paragraf. Jangan menyebar paragraf Anda dengan<br /><br ><br />

Mereka harus digunakan untuk mewakili baris baru. Tidak ada lagi. Tidak mengisi ruang seperti di situs geocities rata-rata. Namun hanya ada satu kasus di mana mereka mungkin berguna untuk tujuan lain selain meletakkan baris baru: untuk menghapus float.

<br style="clear: both;">

Jangan gunakan tiga atau lebih berturut-turut <br>, itu adalah sinyal yang Anda gunakan untuk tujuan gaya dan tidak, Anda tidak harus.

Beberapa orang akan mengatakan satu <br>sudah cukup dan bukan dua yang harus Anda gunakan <p></p>, tetapi ada situasi (misalnya skenario) di mana Anda ingin memperkenalkan jeda yang lebih lama tanpa menyiratkan perubahan topik atau periode baru dimulai, seperti paragraf biasanya.

Mereka baik-baik saja, jika digunakan dengan tepat. Misalnya, Anda tidak boleh menggunakannya sebagai pengganti <p>tag atau untuk membuat spasi antar elemen. Anda mungkin melakukan sesuatu yang salah jika Anda memiliki dua berturut-turut.

Jika kamu melakukan ini: <BR/> <BR/>

Anda akan mendapatkan tata letak yang berbeda pada browser yang berbeda.

Deeper:
Jika Anda gunakan <BR/>hanya untuk jeda baris - ok.
Jika Anda gunakan <BR/>sebagai pengatur garis - tidak ok.

Berikut ini contoh bagaimana <br>dapat secara negatif memengaruhi penataan (jalankan cuplikan untuk visual)

(perhatikan tombol yang tidak selaras dan ruang aneh di sebelah kanan):

button {
  width: 70px;
  height: 70px;
}
#arrows {
  border: solid thin red;
  display: inline-block;
}
#arrows span:first-of-type { 
  text-align: center; 
  display: block;
}
#moveUp {
  margin: 0;
}
/* In the current case instead of <br> use display */
/*
#arrows span:last-of-type { 
  display: block;
}
*/

<div id="arrows">
  <span>
    <button id="moveUp" value="üles">&uarr;</button> 
  </span>
  <button id="moveLeft" value="vasakule">&larr;</button> 
  <button id="moveDown" value="alla">&darr;</button> 
  <button id="moveRight" value="paremale">&rarr;</button> 
  <br>    <!-- note the shifted button and odd space on right -->
  <span>or move with keyboard arrows</span>
</div>

Dalam HTML (hingga HTML 4): gunakan <br>
Dalam HTML 5: <br> lebih disukai, tetapi <br/>dan <br />juga dapat diterima
Dalam XHTML: <br /> lebih disukai. Bisa juga menggunakan <br/>atau<br></br>

Jadi penggunaan <br>tag adalah HTML yang benar-benar valid. Tetapi penggunaan <br>tidak dianjurkan?

Alasan utama mengapa tidak digunakan <br>adalah karena ini bukan tag semantik & tidak memiliki konten di dalamnya. Penggunaannya bisa dihindari seperti,

<p>some<br>text<p>

dapat ditandai tanpa <br>sebagai

 <p>some</p>
 <p>text<p>

Jika Anda menggunakan <br>tujuan lain seperti top-spacing dll. Yang dapat dicapai melalui marginproperti CSS .