IES Palomeras Vallecas

Esta página es de solo lectura. Puedes ver la fuente pero no puedes cambiarla. Pregunta a tu administrador si crees que esto es incorrecto.
====== Ejemplo de div y span ======

<html>
  <style> 
.caja-roja{border:2px solid #f00;width:200px;height:200px;}
.espacio{width:200px;height:10px;}
.espacio2{width:200px;height:25px;}
.caja1{border:2px solid #000;width:250px;height:150px;}
.caja2-verde{border:2px solid #0f0;width:150px;height:150px;}
.caja3-azul{border:2px solid #00f;width:100px;height:100px;}
.redondea { border-radius: 100px;} 
.redondea1 { border-radius: 15px;} 
  </style> 


    <div class="caja-roja redondea">

<div class="espacio2 ">
</div>

  <div class="caja2-verde redondea">

<div class="espacio2 ">
</div>

<div class="caja3-azul redondea">

</div>
  </div>
    </div>

<div class="espacio ">
</div>

<div style="color: blue;">
 <h2> Ejemplo de div y span </h2>
  <p>
    Esto es un párrafo dentro de un div,
    <span style="color: red;"> y esto un span dentro de un párrafo.</span>
  </p>
</div>

<head>
 <style type="text/css">
   H1.miclase {border-width: 1px; border: solid; text-align: center}
 </style>
</head>
<body>
 <H1 class="miclase"> Este H1 está afectado por nuestro estilo </H1>
 <H1> Este no está afectado por nuestro estilo </H1>
</body>
</html>



  <html>
    <style> 
  .caja-roja{border:2px solid #f00;width:200px;height:200px;}
  .espacio{width:200px;height:10px;}
  .espacio2{width:200px;height:25px;}
  .caja1{border:2px solid #000;width:250px;height:150px;}
  .caja2-verde{border:2px solid #0f0;width:150px;height:150px;}
  .caja3-azul{border:2px solid #00f;width:100px;height:100px;}
  .redondea { border-radius: 100px;} 
  .redondea1 { border-radius: 15px;} 
    </style> 
  
  
      <div class="caja-roja redondea">
  
  <div class="espacio2 ">
  </div>
  
     <div class="caja2-verde redondea">
  
  <div class="espacio2 ">
  </div>
  
  <div class="caja3-azul redondea">
  
  </div>
    </div>
      </div>
  
  <div class="espacio ">
  </div>
  
  <div style="color: blue;">
   <h2> Ejemplo de div y span </h2>
    <p>
      Esto es un párrafo dentro de un div,
      <span style="color: red;"> y esto un span dentro de un párrafo.</span>
    </p>
  </div>
  </html>


====== Hojas de estilo ======
<html>
<head>
 <style type="text/css">
   H1.miclase {border-width: 1px; border: solid; text-align: center}
 </style>
</head>
<body>
 <H1 class="miclase"> Este H1 está afectado por nuestro estilo </H1>
 <H1> Este no está afectado por nuestro estilo </H1>
</body>

<head>
 <style type="text/css">
   #miid {border-width: 1px; border: solid; text-align: center}
 </style>
</head>
<body>
 <H1 class="miclase"> Este H1 no está afectado </H1>
 <H1 id="miid"> Este H1 está afectado por el estilo </H1>
 <H1> Este H1 no está afectado </H1>
</body>

<HEAD>
 <STYLE type="text/css">
  SPAN.ver-ex { font-variant: small-caps }
 </STYLE>
</HEAD>
<BODY>
  <P><SPAN class="ver-ex">Las primeras</SPAN> palabras
  de este párrafo van en versalitas.
</BODY>

<HEAD>
 <STYLE type="text/css">
   DIV.Abstracto { text-align: justify }
 </STYLE>
</HEAD>
<BODY>
 <DIV class="Abstracto">
   <P>La gama de productos Gran Jefe es nuestra apuesta
     para el año que viene. Este informe sienta las bases
     para confrontar a Gran Jefe con los productos de la
     competencia.

   <P>Gran Jefe reemplaza a nuestra gama "Commander",
     si bien ésta seguirá de momento en catálogo.
 </DIV>
</BODY>

<HEAD>
 <TITLE>Cómo Tallar la Madera</TITLE>
 <STYLE type="text/css">
  H1 { text-align: center}
 </STYLE>
<BODY>
 <H1> Cómo Tallar la Madera </H1>

<HEAD>
 <TITLE>Cómo Tallar la Madera</TITLE>
 <STYLE type="text/css">
  H1.madera {text-align: center}
 </STYLE>
<BODY>
 <H1 class="madera"> Cómo Tallar la Madera </H1>

<HEAD>
 <TITLE>Cómo Tallar la Madera</TITLE>
 <STYLE type="text/css">
  DIV.parrafos {text-align: right}
 </STYLE>
<BODY>
 <DIV class="parrafos">
  <P>...texto del primer párrafo...
  <P>...texto del segundo párrafo...
  <P>...texto del tercer párrafo...
 </DIV>

<HEAD>
 <TITLE>Como Tallar la Madera</TITLE>
 <STYLE type="text/css">
  BODY {text-align: center}
 </STYLE>
<BODY>
 ...el cuerpo está centrado...
</BODY>

<html>
<head>
 <style type="text/css">
   H1.miclase {border-width: 1px; border: solid; text-align: center}
 </style>
</head>
<body>
 <H1 class="miclase"> Este H1 está afectado por nuestro estilo </H1>
 <H1> Este no está afectado por nuestro estilo </H1>
</body>


</html>