Voting Chart

Votos totales : 5

Is the line-height CSS property considered to be a readability/typography or layout choice?

  •  
    Readability
  •  
    Layout
  •  
    Both

line-height legibilidad o de presentación?

  • mindfullsilence
  • Professor
  • Professor
  • Avatar de Usuario
  • Registrado: Ago 04, 2008
  • Mensajes: 846
  • Status: Offline

Nota Mayo 22nd, 2011, 9:34 pm

He estado contemplando la categoría de la propiedad line-height cae; legibilidad o de presentación? Considere los siguientes escenarios:
HTML Código: [ Select ]
<p>Elit sed nascetur tempor urna ultrices est a nunc? Mattis, vel turpis nunc sed est turpis, in cras tempor, proin risus mid a pid, scelerisque, a duis nec velit a, magna. Penatibus urna parturient pulvinar? Nascetur, lacus placerat rhoncus ut odio urna dolor tincidunt in hac, ac proin elementum nec? Mus! Enim risus pulvinar, duis tincidunt! Sit est ridiculus rhoncus. Odio come massa?</p>
 
  1. <p>Elit sed nascetur tempor urna ultrices est a nunc? Mattis, vel turpis nunc sed est turpis, in cras tempor, proin risus mid a pid, scelerisque, a duis nec velit a, magna. Penatibus urna parturient pulvinar? Nascetur, lacus placerat rhoncus ut odio urna dolor tincidunt in hac, ac proin elementum nec? Mus! Enim risus pulvinar, duis tincidunt! Sit est ridiculus rhoncus. Odio come massa?</p>
  2.  

CSS Código: [ Select ]
p {
width: 200px;
line-height: 1.8;
}
 
  1. p {
  2. width: 200px;
  3. line-height: 1.8;
  4. }
  5.  

Con el código anterior, line-height se utiliza como un medio de separar cada línea del párrafo para una mejor legibilidad. Sin embargo, el código siguiente se muestra algo diferente:
HTML Código: [ Select ]
<header>
<h1>website.com</h1>
</header>
 
  1. <header>
  2. <h1>website.com</h1>
  3. </header>
  4.  

CSS Código: [ Select ]
header {
height: 50px;
}
 
h1 {
line-height: 50px;
vertical-align: middle;
}
 
  1. header {
  2. height: 50px;
  3. }
  4.  
  5. h1 {
  6. line-height: 50px;
  7. vertical-align: middle;
  8. }
  9.  

Esto permitirá que la etiqueta H1 a sentarse verticalmente en el centro de la cabecera, algo más congruentes con una opción de diseño. Estos son ejemplos un tanto primitivo, pero creo que ilustra mi punto. Entonces, ¿cuál es la propiedad line-height más consistentes en; facilitar la lectura, o el diseño?
Use your words like arrows to shoot toward your goal.
  • Anonymous
  • Bot
  • No Avatar
  • Registrado: 25 Feb 2008
  • Mensajes: ?
  • Loc: Ozzuland
  • Status: Online

Nota Mayo 22nd, 2011, 9:34 pm

  • Bigwebmaster
  • Site Admin
  • Site Admin
  • Avatar de Usuario
  • Registrado: Dic 20, 2002
  • Mensajes: 8925
  • Loc: Seattle, WA & Phoenix, AZ
  • Status: Offline

Nota Mayo 24th, 2011, 10:36 am

Cuando se trata de texto en párrafos como usted ha mencionado, el uso principal de que probablemente sería para mejorar la legibilidad. Todavía se puede considerar el diseño, ya que afecta el estilo de la página web también. Sin embargo, tengo que utilizar el atributo line-height en muchos lugares fuera de los apartados justo, por ejemplo, para ayudar con estructuras de navegación, imágenes de fondo en las listas, los iconos en las leyendas, listas ordenadas, botones de radio, y mucho más. He votado a favor los dos, porque lo he utilizado tanto para la lectura y problemas de diseño.
Ozzu Hosting - Want your website on a fast server like Ozzu?

Publicar Información

  • Total de mensajes en este tema: 2 mensajes
  • Usuarios navegando por este Foro: No hay usuarios registrados visitando el Foro y 126 invitados
  • No puede abrir nuevos temas en este Foro
  • No puede responder a temas en este Foro
  • No puede editar sus mensajes en este Foro
  • No puede borrar sus mensajes en este Foro
  • No puede enviar adjuntos en este Foro
 
 

© 2011 Unmelted, LLC. Ozzu® es una marca registrada de Unmelted, LLC