Generar ingresos en casa creando páginas web: Estilos, Colores y Formatos de texto (Cap.6).
Títulos, párrafos, links e imágenes en HTML
Ya hemos visto la estructura HTML, algunas etiquetas, atributos particulares y propiedades básicas para dar formato a nuestros elementos. En este capítulo ampliaremos el manejo de la etiqueta style, explicaremos los tipos de notación para definir colores y veremos algunas etiquetas para dar formato a los elementos de texto.
El atributo style
El atributo style permite definir propiedades CSS dentro de la misma etiqueta HTML, sabemos que CSS es un lenguaje donde se definen clases y se agregan propiedades que dan formato a todo el documento HTML, más adelante entraremos en detalle y explicaremos las diferentes propiedades con las que cuenta este lenguaje, por ahora definiremos estas propiedades a través del atributo style.
<elemento style=»propiedad1:valor1; propiedad2:valor2; …»></elemento>
Colores
Para la WEB y en general para diferentes herramientas de diseño existen diferentes tipos de formatos en el que podemos definir colores, debido a la cantidad de colores y tonos existentes. HTML soporta al rededor de 140 nombres de colores como blue, red, green, yellow,…, sin embargo estos nombres no cubren todos los colores que puede manejar una pantalla, para esto se utilizan dos tipos de formato aparte de los nombres ya definidos, el formatos RGB y el HEXADECIMAL.
[supsystic-tables id=4]
Para más referencias de colores puedes visitar W3Schools.
Etiquetas para formato de texto
Existe una serie de etiquetas que nos permiten definir algunos formatos o darle cierta relevancia dentro del documento a palabras, frases o secciones particulares de algún texto.
- <b> – Texto con negrilla.
- <strong> – Texto con negrilla, la diferencia con <b>, es que <strong> define además una sección importante dentro del documento.
- <i> – Texto con formato Itálica.
- <em> – Texto con formato Italica, define además una sección importante dentro del texto.
- <mark> – Texto marcado o destacado.
- <small> – Texto pequeño.
- <del> – Texto quitado de documentos actualizados.
- <ins> – Texto insertado en textos actualizados.
- <sub> – Subíndice.
- <sup> – Superíndice.
HTML
NOTA: En los ejemplos encontramos una propiedad nueva font-family, que define la familia de fuentes o la fuente que vamos a utilizar para dar formato a nuestro documento, la familia de fuentes que utilizan por defecto los exploradores son ‘Sans-serif’, ‘Serif’, ‘Monospace’, ‘Cursiva’, ‘Fantasy’, para utilizar otra familia debemos cargarla de forma externa a nuestro documento y definirla para poder utilizarla, en nuestro curso de CSS aprenderemos a hacerlo.
También encontramos background-color, cuya función es declarar el color para este caso, del fondo de nuestro elemento. Más adelante veremos como agregar imágenes a los fondos de los elementos.
Agrega colores de fuentes y fondos a los elementos <p> y juega con los valores de los colores. Cuál es el Hexadecimal y el RBG del NEGRO, averigua estos mismos formatos para tus colores favoritos, ingresa en W3School y descubre estos valores.
