Cómo dar formato a los sitios web

Un sitio web efectivo 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 la posibilidad de formatear 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 diversos elementos de tu página web. Utilizar una

Etiqueta para comenzar la tabla en sí. Utilizar 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 estilos de fuente dentro de las etiquetas para los elementos que contienen el texto. Por ejemplo, si desea dar formato al texto dentro de un elemento de párrafo:

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

3.

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

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

CSS y hojas de estilo externas

1.

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

2.

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

pag {

familia de fuentes: "comic sans ms";

color de fondo :: # CC3366;

}

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

3.

Use una identificación o clase si desea introducir estilos que se usarán en diferentes tipos 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 usar varias veces, y se denota con "." símbolo. Por ejemplo:

.comicrose {

familia de fuentes: "comic sans ms";

color de fondo :: # CC3366;

}

Esta clase te permite diseñar un elemento con Comic Sans y un fondo rosa donde llames 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.

Cosas necesarias

  • Editor de texto

Entradas Populares