-
Notifications
You must be signed in to change notification settings - Fork 61
/
index.html
56 lines (43 loc) · 1.77 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Box Model y CSS</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- h1.first + tab crea un h1 con clase first -->
<h1 class="first">Hola soy un h1</h1>
<h1 class="first" id="winning">Hola soy otro h1</h1>
<div class="contenedor">
<h1 class="title">Título 1</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Modi ullam quibusdam, commodi temporibus eaque eius, impedit illum, quidem, voluptates tempore unde cupiditate cumque recusandae accusamus. Omnis a cumque repellendus magnam.</p>
</div>
<div class="box-three">
<!-- p*4 + tab crea 4 etiquetas párrafo automaticamente-->
<p>Primer párrafo</p>
<p>Segundo párrafo</p>
<p>Tercer párrafo</p>
<p>Cuarto párrafo</p>
</div>
<div class="box-one"></div>
<div class="box-two"></div>
<!-- ul>li*6 etiqueta ul con 6 li adentro -->
<!-- CSS (cascada)
Orden de prevalencia de estilos:
1- Importancia
2- Especificidad
3- Orden del código
!important: obliga a que ese estilo se cumpla si o si, independiente de la cascada -->
<!-- AutoFile Name: Autocompleta el nombre de los archivos. -->
<!-- ColorPicker: Abre una paleta de colores entregando su código hexadecimal al instante.
Para usar solo basta con presionarctrl + alt + c -->
<!-- Color Highlighter: Permite ver los colores que hemos elegido en CSS. -->
<!-- Valores en css:
Pixeles : unidades absolutas, siempren tendrán el tamaño especificado
em : 1em = 16 pixeles, unidad relativa
rem: funcionan como los em pero no tienen soporte en todos los browsers
vw: porcentaje de ancho de una pantalla no tiene soporte en todos los browsers)
vh: porcentaje de alto de una pantalla (no tiene soporte en todos los browsers) -->
</body>
</html>