Читать книгу El gran libro de HTML5, CSS3 y Javascript - Diego Gauchat Juan - Страница 51

Al aplicar estilos a los elementos HTML cambia la forma en la que estos se presentan en pantalla. Como dijimos antes, los navegadores proporcionan un conjunto de estilos por defecto que en la mayoría de los casos no se ajustan a las necesidades de los diseñadores. Para cambiar esto, podemos sobrescribirlos con nuestros propios estilos utilizando diferentes técnicas. Una de estas técnicas es asignar estilos dentro del elemento como un atributo. El Código 2-5, presentado a continuación contiene un sencillo documento HTML que muestra el elemento <p> modificado por el atributo style con el valor font-size: 20px. Esta propiedad cambia el tamaño predeterminado del texto dentro del elemento <p> a 20 px.

Código 2-5

Estilos CSS dentro de las etiquetas HTML.

Hágalo usted mismo

Copie en un archivo de texto el código y ábralo en su navegador para comprobar su funcionamiento. Tenga en cuenta que el archivo debe tener la extensión .html para abrirlo correctamente (por ejemplo, miarchivo.html).

Usar la técnica descrita anteriormente es una buena manera de probar estilos y ver sus efectos, pero no se recomienda para un proyecto más grande. La razón es simple: con esta técnica es necesario escribir y repetir cada estilo para cada elemento, aumentando así considerablemente el tamaño del documento. De este modo se acaba haciendo imposible actualizar y mantener el sitio. Imagínese que decide que en vez de 20 px, el tamaño del texto en cada elemento <p> debe ser de 24 px. Tendría que cambiar cada estilo en cada etiqueta <p> en todo el documento y en cada uno de los documentos de su sitio web.