Czy używanie <BR /> czasami jest złe?

Czy używanie <BR/>tagów jest czasami złe ?

Pytam, ponieważ pierwsza rada, której udzielił mi mój zespół programistów, brzmiała: Nie używaj <BR/>; zamiast tego użyj stylów. Ale dlaczego? Czy używanie <BR/>tagów ma negatywne skutki ?

Głównym powodem nieużywania <br>jest to, że nie jest semantyczny . Jeśli chcesz mieć dwa elementy w różnych blokach wizualnych, prawdopodobnie chcesz, aby były w różnych blokach logicznych.

W większości przypadków oznacza to na przykład użycie różnych elementów <p>Stuff</p><p>Other stuff</p>, a następnie użycie CSS do prawidłowego rozmieszczenia bloków.

Istnieją przypadki, w których <br>jest semantycznie poprawne, tj. Przypadki, w których podział wiersza jest częścią wysyłanych danych. Jest to tak naprawdę ograniczone tylko do 2 przypadków użycia - poezji i adresów pocztowych.

Myślę, że twój zespół programistów odnosi się do <br />odstępów między marginesami. Aby zrobić pustą przestrzeń między elementami, użyj stylu dopełnienia / marginesów przez CSS.

Złe użycie <br />:

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

Dobre wykorzystanie <br />:

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

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

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

Ogólnie <br/>jest oznaką słabego semantycznego kodu HTML. Najczęstszym przypadkiem jest użycie <br/>do deklarowania separacji akapitów, które są znacznie lepsze, aby zrobić to semantycznie. Zobacz Łóżko i BReakfast .

Są sytuacje, w których jest to właściwy tag, ale jest on nadużywany na tyle często, że ludzie przyjmują mentalność „nie używaj”, aby wymusić lepsze myślenie semantyczne.

Twój zespół prawdopodobnie miał na myśli to, że nie używaj klawiszy <br> do dzielenia akapitów.

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

jest lepszym sposobem, aby to zrobić, ponieważ możesz łatwo dostosować odstępy między akapitami za pomocą CSS. Poza tym nie przychodzi mi do głowy nic, co mówi o przerwach między wierszami.

Ta sama koncepcja dotyczy tego, dlaczego nie używamy tabel do układu - użyj tabel do tabel i CSS do układu.

Używaj <br/>do łamania linii w bloku tekstu i CSS, jeśli chcesz zmienić układ.

Bezpośrednie określenie układu utrudnia na przykład dostosowanie witryny do różnych rozmiarów stron lub czcionek.

Generalnie zawsze będę ustawiał odpowiednie marginesy i dopełnienie elementów za pomocą CSS - jest o wiele mniej bałaganu niż mnóstwo <br />s w każdym miejscu, poza tym, że jest bardziej poprawny semantycznie.

Prawdopodobnie jedyny przypadek, w którym użyłbym a <br />zamiast marginesów i wypełnienia ustawionych przez CSS, nawet jeśli nie jest to ściśle technicznie poprawne, to przypadek odizolowany, w którym potrzebne było nieco więcej miejsca. Gdybym dostał sporą stylów i nie wydaje się wart utworzenie dodatkowego stylu tylko dla tego jednego wystąpienia, ja może używać <br />jako jednorazową.

Jak większość rzeczy, <br />nie są one złe, pod warunkiem, że są prawidłowo używane.

Staram się pisać moje znaczniki w taki sposób, aby były czytelne przy wyłączonym CSS. Jeśli używasz tylko BR do dodawania odstępów, lepiej jest użyć marginesów i dopełnienia.

<br />powinien być używany tylko do znaków końca wierszy, a nie do stosowania stylu do strony. Na przykład, jeśli potrzebujesz dodatkowej przestrzeni między akapitami, nadaj im klasę i zastosuj dodatkowe wypełnienie do akapitów. Nie rozkładaj akapitów za pomocą<br /><br ><br />

Mają być używane do reprezentowania nowych linii. Nic więcej. Nie zapełniają przestrzeni, jak na przeciętnej stronie geocities. Jest jednak tylko jeden przypadek, w którym mogą one być użyteczne do innych celów niż wstawianie nowej linii: do wyczyszczenia pływaków.

<br style="clear: both;">

Nie używaj trzech lub więcej kolejnych <br>s, to sygnał, że używasz ich do celów stylistycznych i nie, nie powinieneś.

Niektórzy powiedzieliby, że <br>wystarczy jeden , a zamiast dwóch powinieneś użyć <p></p>, ale są sytuacje (np. Scenariusze), w których chcesz wprowadzić dłuższą pauzę bez sugerowania zmiany tematu lub rozpoczęcia nowego okresu, jak zwykle robi to akapit.

Są w porządku, jeśli są odpowiednio używane. Na przykład nie należy ich używać zamiast <p>tagów lub do tworzenia odstępów między elementami. Prawdopodobnie robisz coś złego, jeśli kiedykolwiek będziesz mieć dwa z rzędu.

Jeśli to zrobisz: <BR/> <BR/>

Otrzymasz inny układ w różnych przeglądarkach.

Głębiej:
jeśli używasz <BR/>tylko do łamania linii - ok.
Jeśli używasz <BR/>jako przekładki liniowej - nie jest w porządku.

Oto przykład, jak <br>może negatywnie wpłynąć na stylizację (uruchom fragment kodu dla wizualizacji)

(zwróć uwagę na niewyrównany przycisk i dziwną spację po prawej stronie):

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>

W HTML (do HTML 4): użyj <br>
W HTML 5: <br> jest preferowane, ale <br/>i <br />jest również dopuszczalne.
W XHTML: <br /> jest preferowane. Można również użyć <br/>lub<br></br>

Zatem użycie <br>tagu jest całkowicie poprawnym kodem HTML. Ale użycie <br>nie jest zalecane?

Głównym powodem, dla którego nie należy go używać, <br>jest to, że nie jest to znacznik semantyczny i nie zawiera treści. Można tego uniknąć, np.

<p>some<br>text<p>

można oznaczyć bez <br>jako

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

Jeśli używasz <br>innych celów, takich jak górne odstępy itp., Można to osiągnąć za pomocą marginwłaściwości CSS .