Vous êtes sur la page 1sur 11

Han causado visualizacin plataformas.

problemas de en distintas

Otro antecedente ha hecho el desarrollo de tecnologa consiste en pginas web mezclado de cdigo HTML

Tiene inconvenientes la lectura del cdigo HTML se ha pesada y difcil de buscar errores o depurar las paginas.

Solucionar problemas utilizando tcnicas para la utilizacin de tablas, imgenes para ajustarlas.

INTRODUCCION A LAS CSS

A la hora de almacenar contenido estos textos est&aacuteen mezclados etiquetas incrustadas dar forma degrada su utilidad.

Aplicarle forma a un documento concebido para otros usos muchos ms amplios.

Centmetros (cm) CARACTERISTICAS Y VENTAJAS DE LAS CSS Puntos (pt) Pulgadas (in) Pixeles (px) y porcentajes (%), como antes.
Definir la visibilidad de los elementos, mrgenes, subrayados, tachados Podemos colocar elementos en la pgina con mayor precisin y sin lugar a errores. Se puede aplicar identado a las primeras lneas del prrafo. Podemos definir la distancia entre lneas del documento. Una etiqueta en concreto llegando incluso a poder definir varios estilos diferentes para una sola etiqueta. Una porcin del documento, aplicando estilos visibles en un trozo de pgina. Se puede definir la forma, en un pequeo trozo de cdigo en la cabecera, a toda la pgina. Un web entero, de modo que se puede definir la forma de todo web de una sola vez

Queremos definir los estilos entre las {}

</STYLE>

Cabecera de la pgina

<STYLE>

<Body>

Define el color del fondo de la pgina.

Subrayado Centrado

<H1>

<STYLESHEET>

Indicando que el enlace es con una hoja de estilos.

USOS DE LAS CSS Y II

<Text/css>

<estilos.css>

Archivo es de texto, en sintaxis CSS

Nombre del fichero fuente de los estilos.

Declaracin de estilos con fichero externo.

Importar guardados.

estilos

Declaracin de estilos para toda la pgina.

Estilos definidos en una parte de una pgina.

Reglas de importacin en los estilos.

Definidos en una etiqueta en concreto

Estilo para porcin pequea del documento.

Pautas bsicas estilos.

con

Font-Weight.anchura de los caracteres (bold) Font-Family.indicamos la familia de tipografa del texto (cursive)

Font-Style.estilo de la fuente (normal)

Line-Height.alto de una lnea espaciado.

TextDecoration.decoracin del texto (overline)

FUENTES -FONT
FONT-SIZE.indica el tamao de las fuentes (small). Text-align.alineacin del texto (left).

PARRAFOS- TEXT

COLOR.- indica el color del texto (RGB).

FONDO-BACKGROUND
TextTransform.transforma el texto.

Text- Indent.sangrado o mrgenes en las pginas

Background color.- color de fondo de un de la pagina.

Backgroundimage.- color de fondo de la pgina.

Marginbottom.margen en la parte de abajo. Margin-top.tamao del margen arriba de la pgina.

Padding-left.espacio insertado por la izquierda.

Paddingright.- espacio insertado por la derecha.

Paddingbottom.insertado por abajo.

BOX-CAJA
Margin-right.tamao del margen a la derecha. Padding-top.insertado por arriba.

Margin-left.tamao del margen a la izquierda.

Border-color.color del borde del elemento.

Borderstyle.- estilo de borde.


Border-width.el tamao del borde.

Float.- alinear elemento a la izquierda a la derecha.

Clear.- altura imgenes alineados a la izquierda.

ESTILOS EN LOS ENLACES

Enlaces normales A:link {atributos}

Enlaces visitados A: visited {atributos}

Enlaces activos A: hover {atributos}

Text-decoration Para darle color

<A> Atributo style.

<SPAN> estilo a una pequea parte de una pgina HTML.

Visibility.- definir si la capa es visible o no.

<DIV> aplicar estilos a partes de la pagina HTML.

Clip.- sirve para recortar una capa y parte de ellas no visibles.

CAPAS

<LAYER> objetivo construir capas.

Z-index.- indica que capas se ven encima de que otras.

Left y top.- distancia del borde izquierdo y derecho de la pgina.

Width y height.- indica altura y anchura de la capa

Atributo color.- indica el color del texto de capa.

Font-size.- indica el tamao del texto y as con todos los atributos ya vistos.

ATRIBUTOS PARA CAPAS.

Atributo position.- posicionamiento en capa Relative.- posicin de la capa es relativa. Absolute.- posicin de la capa se calcula.

Atributo top.- distancia vertical donde se coloca la capa

Atributo left.- indica la distancia en horizontal a la que estar situada la capa.

Atributo height.- indica la distancia horizontal a la que estar situada la capa.

Atributo clip.- sirve para recortar determinadas areas de la capa y que no se pueden ver.

Atributo width.- indica la anchura de la capa.

Atributo Visibility.- si la capa puede ver en la pgina o permanece oculta al usuario La capa se podr ver, indicara que esta oculta, hereda la visibilidad de la capa.

Atributo z-index.- posicin sobre el eje z que tendr las distintas capas de la pagina.

MAQUETACION CSS (Ventajas y Desventajas) (VENTAJ


La separacin del contenido de la pgina y del estilo o aspecto con el que se deben mostrar. Ahorro en la transferencia.
Facilidad para alterar el aspecto de la pgina sin tocar el cdigo HTML.

Las hojas del estilo en cascada ayudan a separar el contenido de la forma, es decir lo forma con la que se muestran. Utilizacin de las hojas de estilo a su grado mximo, capas a las que se aplica un posicionamiento. Para crear las etiquetas <DIV> es decir mostradas en filas y columnas. Tablas para ajustar la posicin de los elementos de la pagina.

Compatibilidad con navegadores antiguos. Diferencias entre navegadores Dificultad

los

FORMAS DE APLICAR ESTILOS EN MAQUETACION CSSS

APLICACIN DE ESTILOS A ETIQUETAS.

DEFINICION DE CLASES.

ESTILOS QUE SOLO SE UTILIZAN UNA VEZ.

Declaracin de estilos escribimos la etiqueta y entre llaves, los atributos de estilo.

Declaracin de estilos se declaran con un punto antes del nombre de la clase.

Los identificadores se definen utilizando el atributo id en la etiqueta que deseamos identificar.

Indicamos las etiquetas seguidas por comas y luego, entre llaves, los atributos que queremos definir.

Simplemente se aade el atributo class a la etiqueta que queremos aplicar dicha clase.

Seguido del identificador indicado en la etiqueta y entre llaves los atributos css que deseemos

En este caso se define que los encabezados de nivel 1 y los prrafos, tenga letra roja

El prrafo anterior se presentara con color azul.

En este caso se asignado fuente de tamao 12 puntos y cuerpo arial.

Vous aimerez peut-être aussi