html - link - ¿CSS ha reemplazado<br/>?

link html

Question

Hoy en día veo muchos sitios web que tienen pocas o ninguna etiqueta <br/> . ¿CSS ha obviado la necesidad de <br/> , o es <br/> todavía útil?

Estoy pidiendo esto para saber si usar o no <br/> en el futuro.

Answer 1

Como dijo DA , algunas veces es apropiado y otras no. Depende de para qué lo uses. Aquí hay algunos ejemplos de lo que CSS debe usar en lugar de <br> , en los casos en que no es apropiado.

Margen vertical o relleno

Si está utilizando <br> para agregar espacio vertical solo porque se ve mejor (no porque los saltos de línea sean parte del contenido), debe usar un margen vertical o relleno. En lugar de esto:

<div class="foo">some content</div>
<br><br>
<div class="bar">more content</div>

Es posible que desee esto:

<div class="foo">some content</div>
<div class="bar">more content</div>

.foo { margin-bottom: 2em; }

Dependiendo de la situación, es posible que desee cambiar la distancia, utilizar el padding lugar del margin o colocar el espacio en la parte superior de .bar lugar de la parte inferior de .foo .

display: block

Si está utilizando una única <br> para dividir una línea en dos únicamente para efectos visuales, podría ser mejor usar display: block . Si tiene este HTML en un formulario:

<label for="first-name">First name:</label>
<br>
<input type="text" id="first-name" name="first-name" />

entonces deberías hacer algo como esto en su lugar:

<label for="first-name">First name:</label>
<input type="text" id="first-name" name="first-name" />

form label { display: block; }

<label> s son display: inline por defecto, lo que significa que pueden sentarse en una línea con otro texto. Cuando creas un elemento display: block y no establece su width en un valor fijo como 100px , el elemento se expande para llenar toda la línea, forzando el elemento después a la siguiente línea.

Answer 2

Use <br> siempre que el contenido contenga un salto de línea. Hay algunos casos:

• En un foro, si el cartel firma su post:

  <p>See you,<br>Jon Doe<br>

• Para las direcciones postales, si sería una exageración usar <div> s dedicados cada uno con su propia clase para el nombre, la calle, el estado, etc.

  <p>Jon Doe<br>Sunrise Avenue 123<br>Saint Nowhere</p>

• Más generalmente, si los usuarios pueden ingresar texto con formato y alguien ingresa un salto de línea.

Answer 3

<br> es una etiqueta válida. Pero es solo un salto de línea. Por lo general, NO NECESITA saltos de línea, ya que normalmente hay etiquetas semánticamente mucho más significativas para usar para dar formato a su contenido. Pero todo depende del contexto.

Sería mejor preguntarnos si un uso específico de la etiqueta <br> tiene sentido. Publica algunos ejemplos de cómo lo usas.

Answer 4

<br> etiquetas de <br> están bien para usar, solo asegúrate de usarlas adecuadamente. Si se encuentra usando más de uno para obtener un espaciado adicional, entonces debería usar css en su lugar. Un uso común de la etiqueta <br> es cuando se inserta algo como una dirección.

<p>Company Name<br>
Address Line 1<br>
Address Line 2<br>
City, State, Zip</p>

Trate de no usarlos para la presentación, si necesita más de un salto de línea, use margen o relleno en css.

No hagas esto

<p>some paragraph text</p>
<br><br><br>
<p>more content</p>