Publicado el 31 de Agosto del 2018
667 visualizaciones desde el 31 de Agosto del 2018
1,7 MB
9 paginas
Creado hace 12a (16/01/2012)
MÓDULO 3
MODELO DE CAJA CSS
3
MÓDULO 3
MODELO DE CAJA CSS
4
Ejemplo:
<DOCTYPE html PUBLIC “- / / W3C / / DTD
XHTML 1.0 Transitional / / EN” “Http://
www.w3.org/TR/xhtml1/DTD/xhtml1-tran-
sitional.dtd”>
<html>
<head>
<style type=”text/css”>
div.ex{
width: 220px;
padding: 10px;
border: gris sólido 5px;
margin: 0px;
}
</ style>
</ Head>
MÓDULO 3
MODELO DE CAJA CSS
5
MÓDULO 3
MODELO DE CAJA CSS
6
7
MÓDULO 3
MODELO DE CAJA CSS
3.3. OUTLINE
Es una línea que se dibuja alrededor de los elementos (fuera de
los bordes) para hacer que el elemento “destaque”. Sin embargo, es
diferente de la propiedad border.
Outline no es una parte de las dimensiones del elemento, por lo tanto,
la anchura y altura del elemento no contienen a la propiedad
ouline.
PROPIEDAD
DESCRIPCIÓN
VALORES
outline
outline-color
Establece todas las propiedades
de outline en una sola linea.
CSS 2
Establece el color.
CSS 2
outline-style
Establece el estilo.
CSS 2
outline-width
Establece el ancho.
CSS 2
outline-color
outline-style
outline-width
inherit
color_name
hex_number
rgb_number
invert
inherit
none
dotted
dashed
solid
double
groove
ridge
inset
outset
inherit
thin
medium
thick
length
inherit
MÓDULO 3
MODELO DE CAJA CSS
3.4. MARGIN
Es el espacio de margen que hay alrededor de un elemento (fue-
ra del border). El margen no tieneun color de fondo, y es completamen-
te transparente.
El margen superior, derecho, inferior e izquierda se puede cambiar de for-
ma independiente usando las propiedades por separado. Los posibles
valores:
8
Es posible utilizar valores negativos para superponer contenido.
Margin - individualemente
En CSS, es posible especificar diferentes márgenes para diferen-
tes lados.
Margin - individualemente
En la propiedad margin se pueden tener de uno a cuatro valores.
margin: 25px 50px 75px 100px;
margen superior es de 25px
margen derecha 50px
margen inferior es 75px
margen izquierdo es 100px
margin: 25px 50px 75px;
margen superior es de 25px
márgenes derecho e izquierdo son 50px
margen inferior es 75px
margin: 50px 25px;
márgenes superior e inferior son 25px
márgenes derecho e izquierdo son 50px
margin: 25px;
los cuatro márgenes son 25px
MÓDULO 3
MODELO DE CAJA CSS
9
Crear cuenta
Comentarios de: Módulo 3 - Modelo de caja CSS - CSS Avanzado (0)
No hay comentarios