Download - Estilo css
![Page 1: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/1.jpg)
![Page 2: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/2.jpg)
Hojas de estilos en cascada.Instrucciones que debe seguir un navegador para presentar la información
css
![Page 3: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/3.jpg)
1996.Recomendaciones para mejorar la visualización de un html.
css
![Page 4: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/4.jpg)
Separar al máximo la forma (presentación) y el fondo (datos)
css
![Page 5: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/5.jpg)
Determina la presentación de la información de acuerdo con el dispositivo que se emplee.
css
![Page 6: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/6.jpg)
media=“screen”
media=“print”
media=“aural”
![Page 7: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/7.jpg)
Su sintáxis
![Page 8: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/8.jpg)
body{
background-color:#FFFFFF;}
![Page 9: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/9.jpg)
body{
background-color:#FFFFFF;}
Selector: Etiqueta ¿Dónde?
![Page 10: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/10.jpg)
#encabezado{
background-color:#FFFFFF;}
Selector: Identificador individual ¿Dónde?
![Page 11: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/11.jpg)
.datos{
background-color:#FFFFFF;}
Selector: Identificador común ¿Dónde?
![Page 12: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/12.jpg)
p strong{
background-color:#FFFFFF;}
Selector: Elemento contextual ¿Dónde?
![Page 13: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/13.jpg)
a:hover{
background-color:#FFFFFF;}
Selector: Pseudo elemento ¿Dónde?
![Page 14: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/14.jpg)
a:hover{
background-color:#FFFFFF;}
Declaración
Selector: Pseudo elemento ¿Dónde?
![Page 15: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/15.jpg)
a:hover{
background-color:#FFFFFF;}
Declaración
Propiedad: Atributo ¿Qué?
Selector: Pseudo elemento ¿Dónde?
![Page 16: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/16.jpg)
a:hover{
background-color:#FFFFFF;}
Declaración
Propiedad: Atributo ¿Qué? Valor: ¿Cómo?
Selector: Pseudo elemento ¿Dónde?
![Page 17: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/17.jpg)
Reglas básicas
![Page 18: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/18.jpg)
01Jerarquía
![Page 19: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/19.jpg)
Autor - Usuario - Navegador
![Page 20: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/20.jpg)
<h1>Hola</h1>
![Page 21: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/21.jpg)
Hola<h1>Hola</h1>
![Page 22: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/22.jpg)
<h1>Hola</h1> Hola
h1{
color:red;}
![Page 23: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/23.jpg)
Hola<h1>Hola</h1>
h1{
color:red;}
![Page 24: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/24.jpg)
02Lo específicovence a lo genérico
![Page 25: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/25.jpg)
Ante un conflicto de definicionesel navegador tomará la que se determinó
con mayor especificidad
![Page 26: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/26.jpg)
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 27: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/27.jpg)
HolaContenido
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 28: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/28.jpg)
HolaContenido
body{
color:red;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 29: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/29.jpg)
HolaContenido
body{
color:red;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 30: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/30.jpg)
HolaContenido
body{
color:red;}body p{
color:blue;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 31: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/31.jpg)
HolaContenido
body{
color:red;}body p{
color:blue;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
Elemento contextual
![Page 32: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/32.jpg)
HolaContenido
body{
color:red;}body p{
color:blue;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 33: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/33.jpg)
03Orden
![Page 34: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/34.jpg)
El último en ser leído esquien define la propiedad
![Page 35: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/35.jpg)
HolaContenido
h1{
color:red;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 36: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/36.jpg)
HolaContenido
<body><h1>Hola</h1><p>Contenido</p>
</body>
h1{
color:red;}
h1{
color:blue;}
![Page 37: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/37.jpg)
HolaContenido
<body><h1>Hola</h1><p>Contenido</p>
</body>
h1{
color:red;}
h1{
color:blue;}
![Page 38: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/38.jpg)
04Sintaxis estricta
![Page 39: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/39.jpg)
Un error provoca que el navegadoromita la definición del estilo
![Page 40: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/40.jpg)
HolaContenido
BODY{
color:red;}
<body><h1>Hola</h1><p>Contenido</p>
</body>
![Page 41: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/41.jpg)
05Unidades de medida
![Page 42: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/42.jpg)
Absolutas
p{
font-size:14px;}
![Page 43: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/43.jpg)
Absolutas
p{
font-size:12pt;}
![Page 44: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/44.jpg)
Relativas
h1{
font-size:4em;}
![Page 45: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/45.jpg)
Porcentuales
#encabezado{
width:50%;}
![Page 46: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/46.jpg)
Propiedadesimportantes
![Page 47: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/47.jpg)
01position
![Page 48: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/48.jpg)
www.kiutnorma.com
![Page 49: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/49.jpg)
<div id=“marco”><input id=“campo” />
</div>
![Page 50: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/50.jpg)
#marco{
position:relative;border-color:red
}input#campo{
position:absolute;left:25px;top:10px;
}
<div id=“marco”><input id=“campo” />
</div>
![Page 51: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/51.jpg)
#marco{
position:relative;border-color:red
}input#campo{
position:absolute;left:25px;top:10px;
}
<div id=“marco”><input id=“campo” />
</div>
![Page 52: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/52.jpg)
02float
![Page 53: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/53.jpg)
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
123
![Page 54: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/54.jpg)
#caja1{
border-color:redfloat:left;
}
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
123
![Page 55: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/55.jpg)
#caja1{
border-color:redfloat:left;width:25px;
}
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
1 23
![Page 56: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/56.jpg)
#caja1{
border-color:redfloat:left;width:25px
}#caja2{
border-color:bluefloat:left;width:25px;
}
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
23
1
![Page 57: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/57.jpg)
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
1 2 3
#caja1{
border-color:redfloat:left;width:25px
}#caja2{
border-color:bluefloat:left;width:25px;
}
![Page 58: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/58.jpg)
03clear
![Page 59: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/59.jpg)
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
1 2 3
#caja1{
border-color:redfloat:left;width:25px
}#caja2{
border-color:bluefloat:left;width:25px;
}
![Page 60: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/60.jpg)
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
1 2 3
#caja2{
border-color:bluefloat:left;width:25px;
}#caja3{
width:25px;clear:both;
}
![Page 61: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/61.jpg)
<div id=“caja1”>1
</div><div id=“caja2”>
2</div><div id=“caja3”>
3</div>
13
2
#caja2{
border-color:bluefloat:left;width:25px;
}#caja3{
width:25px;clear:both;
}
![Page 62: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/62.jpg)
04z-index
![Page 63: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/63.jpg)
#marco{
position:relative;border-color:red
}input#campo{
position:absolute;left:25px;top:10px;
}
<div id=“marco”><input id=“campo” />
</div>
![Page 64: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/64.jpg)
#marco{
position:relative;border-color:red
}input#campo{
position:absolute;left:25px;top:10px;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 65: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/65.jpg)
#marco{
position:relative;border-color:red
}input#campo{
position:absolute;left:25px;top:10px;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 66: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/66.jpg)
input#campo{
position:absolute;left:25px;top:10px;
}#marco button{
position:absolute;left:100px;top:10px;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 67: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/67.jpg)
input#campo{
position:absolute;left:10px;top:10px;
}#marco button{
position:absolute;left:100px;top:10px;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 68: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/68.jpg)
input#campo{
position:absolute;left:10px;top:10px;
}#marco button{
position:absolute;left:100px;top:10px;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 69: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/69.jpg)
input#campo{
position:absolute;left:10px;top:10px;z-index:1;
}#marco button{
position:absolute;left:100px;top:10px;z-index:2;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 70: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/70.jpg)
input#campo{
position:absolute;left:10px;top:10px;z-index:1;
}#marco button{
position:absolute;left:100px;top:10px;z-index:2;
}
<div id=“marco”><input id=“campo” /><button></button>
</div>
![Page 71: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/71.jpg)
05contenedores
![Page 72: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/72.jpg)
<div id=“caja1”>1
</div>1
#caja1{
border-color:redfloat:left;width:25px;
}
![Page 73: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/73.jpg)
<div id=“caja1”>1
</div>
#caja1{
border-color:redfloat:left;width:25px;
}
1
![Page 74: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/74.jpg)
<div id=“caja1”>1
</div>
#caja1{
border-color:redfloat:left;width:25px;padding:
}
1
![Page 75: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/75.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;padding:
}
![Page 76: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/76.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;padding:5px 10px 4px 9px;
}
![Page 77: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/77.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;padding:5px 10px 4px 9px;
}
5px
10px
4px
9px
![Page 78: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/78.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;padding:5px 10px 4px 9px;margin:
}
![Page 79: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/79.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;padding:5px 10px 4px 9px;margin:
}
![Page 80: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/80.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
7px
3px
2px
8px
![Page 81: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/81.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;
}
![Page 82: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/82.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;
}
![Page 83: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/83.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;
}
![Page 84: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/84.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:dotted;
}
![Page 85: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/85.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:dotted;
}
![Page 86: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/86.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:dashed;
}
![Page 87: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/87.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:dashed;
}
![Page 88: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/88.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:none;
}
![Page 89: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/89.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:none;
}
![Page 90: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/90.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border-color:redfloat:left;width:25px;border-width:4px;border-style:solid;
}
![Page 91: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/91.jpg)
<div id=“caja1”>1
</div>
1#caja1{
float:left;width:25px;border:4px solid red;
}
![Page 92: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/92.jpg)
Los dolores de cabeza
![Page 93: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/93.jpg)
![Page 94: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/94.jpg)
Primer Advil:Las márgenes
![Page 95: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/95.jpg)
<h1>Titulo</h1><p>Contenido</p>
IE
MF
TituloContenido
![Page 96: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/96.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;}p{
color:blue;}
IE
MF
TituloContenido
![Page 97: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/97.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;}p{
color:blue;}
IE
MF
TituloContenido
![Page 98: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/98.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;}p{
color:blue;}
IE
MF
TituloContenido
¿?
![Page 99: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/99.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;}p{
color:blue;}
IE
MF
TituloContenido
Titulo
Contenido
![Page 100: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/100.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;margin:0 0 0 0;
}p{
color:blue;margin:0 0 0 0;
}
IE
MF
TituloContenido
Titulo
Contenido
![Page 101: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/101.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;margin:0 0 0 0;
}p{
color:blue;margin:0 0 0 0;
}
IE
MF
TituloContenido
TituloContenido
![Page 102: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/102.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;margin:10px 0 10px 25px;
}p{
color:blue;margin:0 0 10px 25px;
}
IE
MF
TituloContenido
TituloContenido
![Page 103: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/103.jpg)
<h1>Titulo</h1><p>Contenido</p>
h1{
color:red;margin:10px 0 10px 25px;
}p{
color:blue;margin:0 0 10px 25px;
}
IE
MF
TituloContenido
TituloContenido
![Page 104: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/104.jpg)
<h1>Titulo</h1><p>Contenido</p><p>Contenido</p>
h1{
color:red;margin:10px 0 10px 25px;
}p{
color:blue;margin:0 0 10px 25px;
}
IE
MF
TituloContenido
TituloContenido
![Page 105: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/105.jpg)
<h1>Titulo</h1><p>Contenido</p><p>Contenido</p>
h1{
color:red;margin:10px 0 10px 25px;
}p{
color:blue;margin:0 0 10px 25px;
}
IE
MF
TituloContenido
TituloContenido
Contenido
Contenido
![Page 106: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/106.jpg)
Doce tabletas:El problema de la caja
![Page 107: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/107.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border:1px solid redwidth:25px;height:25px;
} 25px
![Page 108: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/108.jpg)
<div id=“caja1”>1
</div>
125px
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;
}
![Page 109: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/109.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;
}
5px
10px
4px
9px
25px
![Page 110: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/110.jpg)
<div id=“caja1”>1
</div>
1#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
5px
10px
4px
9px
25px
![Page 111: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/111.jpg)
<div id=“caja1”>1
</div>
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 112: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/112.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 113: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/113.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
![Page 114: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/114.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
¿?
![Page 115: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/115.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 116: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/116.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 117: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/117.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
![Page 118: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/118.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
61px1 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
![Page 119: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/119.jpg)
IE
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
61px=8+1+9+25+10+1+71 7px
3px
2px
8px
5px
10px
4px
9px
25px
30px
40px
![Page 120: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/120.jpg)
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
<div id=“caja1”>1
</div>
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 121: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/121.jpg)
IE
MF
<div id=“caja1”>1
</div>
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
¿?
¿?
![Page 122: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/122.jpg)
IE
MF
<div id=“caja1”>1
</div>
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
¿?
¿Javascript?
![Page 123: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/123.jpg)
IE
MF
<div id=“caja1”>1
</div>
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}
¿?
¿?
![Page 124: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/124.jpg)
IE
MF
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}1 7px
3px
2px
8px
5px
10px
4px
9px
25px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 125: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/125.jpg)
IE#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}/*Comienza el hack-box*/
/*Termina el hack-box*/
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 126: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/126.jpg)
IE#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}/*Comienza el hack-box*/#caja{
voice-family: "\"}\"";voice-family:inherit;
}html>body div#caja{}/*Termina el hack-box*/
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
MF
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 127: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/127.jpg)
IE
MF
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}/*Comienza el hack-box*/#caja{
voice-family: "\"}\"";voice-family:inherit;width:4px;height:14px;
}html>body div#caja{
width:4px;height:14px;
}/*Termina el hack-box*/
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 128: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/128.jpg)
IE
MF
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}/*Comienza el hack-box*/#caja{
voice-family: "\"}\"";voice-family:inherit;width:4px;height:14px;
}html>body div#caja{
width:4px;height:14px;
}/*Termina el hack-box*/
4+1+10+1+9
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 129: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/129.jpg)
IE
MF
#caja1{
border:1px solid redwidth:25px;height:25px;padding:5px 10px 4px 9px;margin:3px 7px 2px 8px;
}/*Comienza el hack-box*/#caja{
voice-family: "\"}\"";voice-family:inherit;width:4px;height:14px;
}html>body div#caja{
width:4px;height:14px;
}/*Termina el hack-box*/
4+1+10+1+9
14+1+5+1+4
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
1 7px
3px
2px
8px
5px
10px
4px
9px
25px
![Page 130: Estilo css](https://reader035.vdocuments.net/reader035/viewer/2022062822/587c2b191a28aba0118b54e3/html5/thumbnails/130.jpg)