ALTAVOZ: Resulta que HTML no es el único lenguaje que puede utilizar en el interior de una página web. Puedes usar algo llamado CSS, o Hojas de Estilo en Cascada, también. CSS permite especificar mucho más precisamente la estética de una Web página, incluyendo el diseño y el tamaño y la colores y las fuentes y mucho más. Por ejemplo, vamos a crear una página web aquà se llama css0 que representa un tu página de inicio para, por ejemplo, John Harvard.
En esta página, vamos a tener de John Harvard nombrar, debajo de la cual será un mensaje para sus visitantes, por debajo de que será un pie de página, con decir, un poco de información del copyright. Para ello, vamos a definir tres divisiones por la página usando una etiqueta llamado div. Abrir div soporte, John Harvard, cerca div soporte, otro div paréntesis abierto, y ahora vamos a especificar algo como, bienvenido a mi página de inicio! Y vamos a cerrar este div, también.
Y ahora una tercera y última div, los derechos de autor. Sólo para ser de lujo, permÃtanme usar ahora un archivo HTML entidad, un sÃmbolo que representa un personaje que no podÃa de otro modo escriba en el teclado. En particular, me voy a hacer signo, libra, 169, punto y coma. Resulta que es el código numérico para el sÃmbolo de derechos de autor. Entonces vamos a especificar John Harvard aquà en la parte inferior. Vamos a cerrar el div y guarde el archivo.
Ahora, ¿qué es esta etiqueta div? La etiqueta div simplemente define una división de la página, que es esencialmente un región rectangular. Asà que en este momento en el tiempo, tengo tres regiones rectangulares, uno en la parte superior de la otra. Asà que por ahora, el efecto es casi tan aunque yo tenÃa tres párrafos. Pero no vamos a ver absolutamente tanto espacio en blanco entre ellos.
Vamos a guardar el archivo, cambie su permisos y echar un vistazo por una momento en Chrome. Chmod a + r CSS0.html. Ahora vamos a abrir Chrome y visita http://localhost.CSS0.html. De hecho, esta es una página de inicio por John Harvard. Ahora vamos a stylize un poco más con precisión utilizando un poco de CSS.
De vuelta en gedit, vamos a entrar en este primera etiqueta div y añadir un estilo Atribuyo especificando que me gustarÃa un tamaño de la fuente de, por ejemplo, 36 pÃxeles o pÃxeles. Y me gustarÃa que el peso de esta fuente ser audaces en lugar de la predeterminada, lo cual es normal. Por segundo div, vamos a especificar otro atributo de estilo que tiene un tamaño de fuente de 24 pÃxeles, por lo un poco más pequeño. Cerrar comillas, tras el punto y coma.
Por último, en esta tercera div, vamos a hacer estilo es igual al tamaño de presupuesto, la fuente, y digamos 12 pÃxeles en esta ocasión. Cerrar cotización después del punto y coma. Nótese entonces que me parece que tienen especificado un poco de estilización para cada uno de estos tres divs utilizando, resulta, CSS. De hecho, la sintaxis que se ve en entre esas comillas es CSS, CSS especÃficamente propiedades con valores. Y por esa primera etiqueta, donde tuve dos de estas propiedades, tamaño de fuente y peso de la fuente, simplemente me separé con punto y coma.
Ahora, sólo por el bien de estilo, me punto y coma también incluidos en el final de cada lÃnea. Pero no son estrictamente necesarios, sobre todo cuando sólo tiene un propiedad definida. Ahora vamos a guardar el archivo y vuelva a cargar en Chrome, y ver lo que el efecto neto es. De vuelta en Chrome aquÃ, hagamos click en Recargar.
Ahora tenemos un poco más interesante tu página de inicio para John Harvard, en el que la primera lÃnea con su nombre, que se encuentra dentro de ese primera div, es de 36 pÃxeles de alto y también negrita, en el que la segunda lÃnea, que es en ese segundo div, es decir 24 pÃxeles de alto, pero no en negrita. Y por lo que la tercera lÃnea en ese tercer div es de 12 pÃxeles de alto y también No negrita. Pero supongo que ahora me gustarÃa cambiar todo de este texto sobre de tal manera que está centrada.
Yo podrÃa alinear cada uno de los individuos divs como está centrada. Pero más fácilmente, podrÃa envolver los tres divs dentro de un cuarto, un div div padre, por asà decirlo, y especificar que que div y la totalidad de su descendientes deberÃan estar centrar el texto alineado? Vamos a echar un vistazo.
Dentro de gedit, vamos a volver a mi cuerpo y añadir un nuevo div encima de la tapa con div, estilo es igual entre comillas Centro texto alinee, cerca postular después del punto y coma. Y ahora, vamos a seguir adelante y todo guión de aquellas lÃneas que hemos escrito antes. Y por debajo de la tercera div, vamos a cerrar esta nueva div.
En otras palabras, debido a los tres divs originales ahora son hijos, por lo que Hablo, por un nuevo div padre y no tengo especifiqué que me gustarÃa para alinear el texto de ese div padre en el centro de la página, que la propiedad será heredado por todos esos niños. De hecho, vamos a guardar el archivo y echar un vistazo en un navegador. Vamos Recargar en Chrome. Y ahà lo tenemos, un aún mejor La página principal de John Harvard.