5. Div

`` <Div class = ""> </div>`

L’etiqueta DIV permet assignar un estil a una secció, és a dir, un gran conjunt ** de blocs, dins del document HTML.

Per exemple, assigneu un color diferent a tot el text que es troba al cap d'una pàgina web.

Exercir

Fitxer ** css-div.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
<!doctype html>
<html>
<head>
   <title> Etiqueta div </title>
   <link rel="stylesheet" type="text/css" 
         href="css-div.css" >
</head>

<body>

   <h1> Etiqueta div </h1>
   
   <p>
   La etiqueta "div" permite agrupar varias
   etiquetas en un sólo bloque y aplicarles un 
   estilo común a todas ellas.
   </p>
   
   <div class="estilo1">
      <p>Periféricos de entrada</p>
      <ul>
      <li>Ratón</li>
      <li>Teclado</li>
      </ul>
   </div>
   
   <div class="estilo2">   
      <p>Periféricos de salida</p>
      <ul>
      <li>Impresora</li>
      <li>Monitor</li>
      </ul>
   </div>
 
</body>
</html>

Fitxer ** CSS-DIV.CSS **

Código del fichero css-div.css

Resultat

Resultado de visualizar los ficheros css-div.html y css-div.css en un navegador