▷ HTML5 y CSS3: Aplicar estilos a una página web sin usar una hoja de estilos

Hay que tener en cuenta, que para hacer más atractiva nuestra página y/o sitio web, no tenemos la obligación y/o necesidad de crear y cargar una hoja de estilos CSS a nuestros documentos .html; sin embargo, sí es lo más recomendable.

Para aplicar los famosos estilos (color, tipo y tamaño de fuentes, etc...) existe la opción de hacerlo de forma interna en nuestros documentos .html; para ello, tenemos 2 formas de realizar dicha operación, las cuales son:

VIDEO TUTORIAL (PASO A PASO)

¡Suscríbete HOY!

🔻

1. Nos ubicaremos sobre la etiqueta de cierre de la cabecera de nuestro documento .html (</head>) y allí aplicaremos las etiquetas:

<style>

</style>

Luego, sólo bastará con colocar dentro de dichas etiquetas, todos los estilos de los distintos elementos y/o componentes de nuestra página web, tal cual como la haríamos en una hoja de estilos.

"Etiquetas style"

NOTA: Ya sea que uses esta forma para aplicar estilos a tus sitios web, o emplees una hoja de estilos, debes tener muy en cuenta el correcto y debido uso de los llamados selectores CSS.

2. La segunda opción que tenemos, es usar el atributo "style" en cada elemento al que le queremos dar y/o aplicar estilos específicos.

La forma de usar dicho atributo, es ubicándonos dentro de la etiqueta de apertura del elemento correspondiente, y luego de la palabra o letra que representa dicha etiqueta, dejaremos un espacio y colocaremos la palabra "style"; a continuación, aplicaremos el signo igual (=) seguido de un par de comillas dobles (""). Dentro de dichas comillas, colocaremos los estilos que hemos de aplicar al elemento, y los separaremos con un punto y coma (;) uno de otro.

<etiqueta_apertura style="estilo1; estilo2"> 

</etiqueta_cierre>

"Atributo style"

¿Aprendiste a aplicar estilos a una página web sin usar una hoja de estilos?

Si te fue de gran ayuda esta información, no olvides compartirla con tus amigos y en tus redes sociales.

Si tienes dudas o sugerencias al respecto; abajo puedes dejarnos tus comentarios.

Bendiciones...