Cómo dar formato a sitios web

Un sitio web eficaz debe transmitir contenido a sus lectores a través de un formato atractivo. Un formato deficiente puede hacer que un sitio web sea poco atractivo o incluso ilegible. Con el lenguaje de marcado de hipertexto (HTML), puede controlar el formato de un sitio web para que aparezca exactamente como lo desea. Además, las hojas de estilo en cascada (CSS) le permiten dar formato a un sitio web utilizando una hoja de estilo externa. Esta técnica es útil si desea aplicar el mismo estilo a varias páginas dentro de su sitio.

Formato HTML

1

Crea tablas para posicionar los distintos elementos de tu página web. Use una etiqueta para comenzar la tabla en sí. Use una etiqueta para comenzar una fila de la tabla y una

etiqueta para crear una celda de datos de tabla dentro de la fila. Las celdas de datos de la tabla generalmente se pueden considerar como las columnas de una tabla. Para posicionar adecuadamente sus elementos, experimente con los parámetros de altura, ancho, relleno y espaciado de filas individuales y celdas de datos.

2

Agregue efectos de texto y estilo de fuente dentro de las etiquetas para los elementos que contienen el texto. Por ejemplo, si desea formatear el texto dentro de un elemento de párrafo:

Esto representaría el contenido del párrafo en la fuente Comic Sans.

3

Agregue un fondo a todo su sitio web en la etiqueta, utilizando el atributo bgcolor. Por ejemplo:

Esto hace que el fondo de toda la página sea de color rosa.

CSS y hojas de estilo externas

1

Abra un nuevo documento de texto en el Bloc de notas.

2

Formatee cada elemento dentro de su nuevo documento. Utilice la etiqueta del elemento seguida de un corchete abierto para introducir estilos para ese elemento. Por ejemplo:

pags {

familia de fuentes: "comic sans ms";

color de fondo :: # CC3366;

}

Cada párrafo de su documento HTML tendrá la fuente Comic Sans y tendrá un color de fondo rosa.

3

Utilice una ID o una clase si desea introducir estilos que se utilizarán en varios tipos diferentes de elementos o en casos individuales. Una identificación solo se puede usar una vez y se introduce con el símbolo "#". Una clase se puede utilizar varias veces y se indica con "." símbolo. Por ejemplo:

.comicrose {

familia de fuentes: "comic sans ms";

color de fondo :: # CC3366;

}

Esta clase le permite diseñar un elemento con Comic Sans y un fondo rosa donde quiera que llame a su clase. Por ejemplo, en el código HTML de su página,

diseña un párrafo como se describe.

4

Enlace a una hoja de estilo externa en la sección de su código HTML. Por ejemplo:

.

Esto enlaza a una hoja de estilo externa llamada pagestyles.css.