Documento Css

<!
DOCTYPE html>
<html>
<head>
<title>Prueba de hojas de estilo</title>
</head>
<body>
<p style="color:#000000;background-color:yellow;font-family:verdana;fontsize:25px;text-align:center">Esto es un ejemplo</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1 style="color:#ff0000;background-color:#ffff00">
Este mensaje es de color rojo sobre fondo amarillo.
</h1>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Problema</title>
<style>
h1 {color:#ff0000;background-color:#ffff00}
</style>
</head>
<body>
<h1>Primer ttulo</h1>
<h1>Segundo ttulo</h1>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
font-family:times new roman;
font-size:30px;
font-style:italic;
font-weight:bold;
}
h2 {
font-family:verdana;
font-size:20px;
}
</style>
</head>
<body>
<h1>Titulo de nivel 1</h1>
<h2>Titulo de nivel 2</h2>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
h1,h2,h3 {
color:#0000ff;
}
</style>
</head>
<body>
<h1>Ttulo de nivel 1</h1>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
h1,h2,h3,h4,h5,h6 {
font-family:Verdana;
}
h1 {
font-size:40px;
}
h2 {
font-size:30px;
}
h3 {
font-size:25px;
}
h4 {
font-size:20px;
}
h5 {
font-size:15px;
}
h6 {
font-size:10px;
}
</style>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color:#ff0000;
text-align:left;
text-decoration:underline;
}
h2 {
color:#dd0000;
text-align:center;
}
h3 {
color:#aa0000;
text-align:right;
}
</style>
</head>
<body>
<h1>Ttulo de nivel 1.<h1>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
letter-spacing:10px;
word-spacing:30px;
text-transform:capitalize;
}
p{
text-indent:20px;
}
</style>
</head>
<body>
<h1>Este es un ttulo de nivel 1</h1>
<p>Todo el texto siguiente se encuentra encerrado en el elemento de prrafo
y con el objetivo de
ver el efecto de la propiedad text-indent. La propiedad text-indent podemos
inicializarla con un valor positivo, como es el caso actual o podemos
inicializarla con un valor negativo lo que provocar que el texto de la primera
lnea del prrafo comienze en una columna inferior al de todo el bloque. </p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
body {
color:#0000ff;
}
em {
color:#008800;
}
p{
color:#999999;
}
</style>
</head>
<body>
<h1>Este es un ttulo de nivel 1 y con el elemento 'em' la palabra:
<em>Hola</em></h1>
<p>El ttulo sale todo de color azul, menos la palabra Hola ya que redefine el
color. Todo este prrafo debe ser de color gris.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
p strong{
color:#0000ff;
}
h1 strong{
color:#ff0000;
}
</style>
</head>
<body>
<h1>Ac tenemos un ttulo de nivel uno, luego un bloque con el elemento
strong debe aparecer <strong>as</strong></h1>
<p>
Luego si escribimos un prrafo y encerramos un bloque con la marca bold
debe aparecer <strong>as</strong>
</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
p strong{
color:#0000ff;
}
h1 strong{
color:#ff0000;
}
</style>
</head>
<body>
<h1>Ac tenemos un ttulo de nivel uno, luego un bloque con el elemento
strong debe aparecer <strong>as</strong></h1>
<p>
Luego si escribimos un prrafo y encerramos un bloque con la marca bold

debe aparecer <strong>as</strong>
</p>
</body>
</html>
body {
background-color:#eafadd;
}
h1 {
color:#0000cc;
font-family:times new roman;
font-size:25px;
text-align:center;
}
p{
color:#555555;
text-align:justify;
}
<!DOCTYPE html>
<html>
<head>
<link rel="StyleSheet" href="estilos.css" type="text/css">
</head>
<body>
<h1 class="resaltado">Titulo de nivel 1</h1>
<p>
Este parrafo muestra el resultado de aplicar la clase .resaltado en la ltima
<span class="resaltado">palabra.</span>
</p>
</body>
</html>
body {
background-color:#eeeeee;
}
.resaltado{
color:#000000;
background-color:#ffff00;
font-style:italic;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="cabecera">
<h1>Ttulo de la cabecera</h1>
</div>
</body>
</html>
#cabecera {
font-family:Times New Roman;
font-size:30px;
text-align:center;
color:#0000ff;
background-color:#bbbbbb;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p class="pregunta">Quin descubri Amrica y en que ao fue?</p>
<p class="respuesta">Coln en 1492</p>
</body>
</html>
.pregunta {
border-width:1px;
border-style:solid;
border-color:#000000;
}
.respuesta {
border-width:1px;
border-style:dashed;
border-color:#000000;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1 class="titulopagina">El blog del pensador</h1>
</body>
</html>
.titulopagina {
background-color:#ffffcc;
text-align:center;
font-size:40px;
border-top-width:1px;
border-right-width:3px;
border-bottom-width:3px;
border-left-width:1px;
border-top-style:dotted;
border-right-style:solid;
border-bottom-style:solid;
border-left-style:dotted;
border-top-color:#ffaa00;
border-right-color:#ff0000;
border-bottom-color:#ff0000;
border-left-color:#ffaa00;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<pre class="codigofuente">
public class Rectangulo{
//atributos
int alto;
int ancho;
boolean relleno;
//mtodos
public int devolverArea(){
return alto*ancho;
}
public void rellenar(boolean r){
relleno=r;
}
public void cambiarTamano(int an, int al){
ancho=an;
alto=al;
}
public Rectangulo() {// constructor
alto=20;
ancho=10;
relleno=false;
}
}//fin clase Rectangulo
</pre>
</body>
</html>
.codigofuente {
font-size:12px;
background-color:#ffffcc;
border-width:1px;
border-style:dotted;
border-color:#ffaa00;
padding:20px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Primer prrafo</p>
<p>Segundo prrafo</p>
</body>
</html>
p{
background-color:#ffffaa;
margin:0px;
border-width:1px;
border-style:solid;
border-color:#ff0000;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul class="vacio">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="circulorelleno">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="circulovacio">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="cuadrado">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="decimal">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="romanominuscula">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="romanomayuscula">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="letrasminusculas">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
<ul class="letrasmayusculas">
<li>Brasil</li>
<li>Uruguay</li>
<li>Argentina</li>
</ul>
</body>
</html>
.vacio{
list-style-type:none;
}
.circulorelleno{
list-style-type:disc;
}
.decimal{
list-style-type:decimal;
}
.romanominuscula{
list-style-type:lower-roman;
}
.romanomayuscula{
list-style-type:upper-roman;
}
.circulovacio{
list-style-type:circle;
}
.cuadrado{
list-style-type:square;
}
.letrasminusculas{
list-style-type:lower-alpha;
}
.letrasmayusculas{
list-style-type:upper-alpha;
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
body {
background-image:url(fondo.jpg);
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Hola Mundo</p>
</body>
</html>
p{
font:bold italic 25px verdana;

}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1 class="tituloprincipal">Propiedad border</h1>
<p class="comentarios">Debemos indicar el border-width border-style
border-color</p>
</body>
</html>
.tituloprincipal{
border:5px solid #ff0000;
}
.comentarios{
border-top:1px solid #0000ff;
border-bottom:1px solid #0000ff;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p class="comentarios">Esto es una prueba para ver el funcionamiento de
la propiedad padding.
Esto es una prueba para ver el funcionamiento de la propiedad padding.
</p>
</body>
</html>
.comentarios {
background-color:#dddddd;
padding:5px 30px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Titulo Principal</h1>
</body>
</html>
h1 {
margin:70px 20px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
body {
background: #ffffee url(fondo.jpg) repeat-x;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>

<p>Esto esta dentro de un prrafo</p>
</body>
</html>
*{
color:#0000aa;
margin:0;
padding:0;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Esto esta dentro de un prrafo</p>
</body>
</html>
*{
color:#0000aa;
margin:0;
padding:0;
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<a href="http://www.google.com">Google</a>
<a href="http://www.yahoo.com">Yahoo</a>
<a href="http://www.bing.com">Bing</a>
</body>
</html>
a:link{
background-color:#00ff00;
color:#ff0000;
}
a:visited{
background-color:#000000;
color:#ffffff;
}
a:hover{
background-color:#ff00ff;
color:#fffff;
}
a:active{
background-color:#ff0000;
color:#ffff00;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<a href="http://www.google.com">Google</a>
<a href="http://www.yahoo.com">Yahoo</a>
<a href="http://www.bing.com">Bing</a>
</body>
</html>
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="menu">
<p><a href="http://www.google.com">Google</a></p>
<p><a href="http://www.yahoo.com">Yahoo</a></p>
<p><a href="http://www.bing.com">Bing</a></p>
<p><a href="http://www.altavista.com">Altavista</a></p>
</div>
</body>
</html>
#menu {
font-family: Arial;
}
#menu p {
margin:0px;
padding:0px;
}
#menu a {
display: block;
padding: 3px;
width: 160px;
background-color: #f7f8e8;
border-bottom: 1px solid #eeeeee;
text-align:center;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul id="menuhorizontal">
<li><a href="http://www.google.com">Google</a></li>
<li><a href="http://www.yahoo.com">Yahoo</a></li>
<li><a href="http://www.bing.com">Bing</a></li>
<li><a href="http://www.altavista.com">Altavista</a></li>
</ul>
</body>
</html>
#menuhorizontal {
margin:0;
padding:0;
list-style-type:none;
}
#menuhorizontal a {
width:100px;
text-decoration:none;
text-align:center;
color:#ff0000;
background-color:#f7f8e8;
padding:3px 5px;
border-right:1px solid blue;
display:block;
}
#menuhorizontal li {
float:left;
}
#menuhorizontal a:hover {
background-color:#336699;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="cabecera">
Blog del Programador
</div>
</body>
</html>
#cabecera {
width:100%;
height:100px;
background-color:#ffee00;
color:#0000aa;
text-align:center;
font-family:Times New Roman;
font-size:50px;
font-weight:bold;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p class="pixel1">Este texto tiene 12 px<p>
<p class="pixel2">Este texto tiene 15 px</p>
<p class="em1">Este texto tiene 1 em</p>
<p class="em2">Este texto tiene 1.5 em</p>
<p class="ex1">Este texto tiene 1 ex</p>
<p class="ex2">Este texto tiene 1.5 ex</p>

<p class="in1">Este texto tiene 1 in</p>
<p class="in2">Este texto tiene 1.5 in</p>
<p class="cm1">Este texto tiene 1 cm</p>
<p class="cm2">Este texto tiene 1.5 cm</p>
<p class="mm1">Este texto tiene 10 mm</p>
<p class="mm2">Este texto tiene 15 mm</p>
<p class="pt1">Este texto tiene 10 pt</p>
<p class="pt2">Este texto tiene 15 pt</p>
<p class="pc1">Este texto tiene 1 pc</p>
<p class="pc2">Este texto tiene 1.5 pc</p>
<p class="porcentaje1">Este texto tiene 150%</p>
<p class="porcentaje2">Este texto tiene 200%</p>
</body>
</html>
.pixel1 {
font-size:12px;
}
.pixel2 {
font-size:15px;
}
.em1{
font-size:1em;
}
.em2{
font-size:1.5em;
}
.ex1{
font-size:1ex;
}
.ex2{
font-size:1.5ex;
}
.in1{
font-size:1in;
}
.in2{
font-size:1.5in;
}
.cm1{
font-size:1cm;
}
.cm2{
font-size:1.5cm;
}
.mm1{
font-size:10mm;
}
.mm2{
font-size:15mm;
}
.pt1{
font-size:10pt;
}
.pt2{
font-size:15pt;
}
.pc1{
font-size:1pc;
}
.pc2{
font-size:1.5pc;
}
.porcentaje1{
font-size:150%;
}
.porcentaje2{
font-size:200%;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p class="fondo1">Primer prrafo</p>
<p class="fondo2">Segundo prrafo</p>

<p class="fondo3">Tercer prrafo</p>
</body>
</html>
fondo1 {
background-color:rgb(255,0,0);
}
.fondo2 {
background-color:rgb(100%,50%,50%);
}
.fondo3 {
background-color:#fab;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Este texto tiene por mostrar las anclas con un cursor distinto al que est
definido por defecto:</p>
<a href="http://www.google.com">google.com</a><br>
<a href="http://www.yahoo.com">yahoo.com</a><br>
<a href="http://www.bing.com">bing.com</a>
</body>
</html>
a{
cursor:help;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="contenedorform">
<form method="post" action="#">
<label>Ingrese nombre:</label>
<input type="text" name="nombre" size="30">
<br>
<label>Ingrese mail:</label>
<input type="text" name="mail" size="45">
<br>
<label>Comentarios:</label>
<textarea name="comentarios" cols="30" rows="5"></textarea>
<br>
<input class="botonsubmit" type="submit" value="confirmar">
</form>
</div>
</body>
</html>
#contenedorform {
width:500px;
margin-left:20px;
margin-top:10px;
background-color:#ffe;
border:1px solid #CCC;
padding:10px 0 10px 0;
}
#contenedorform form label {

width:120px;
float:left;
font-size:14px;
}
.botonsubmit {
color:#f00;
background-color:#bbb;
border: 1px solid #fff;
}
<!DOCTYPE html>
<html>
<head>

</head>
<body>
<table>
<caption>
cantidad de lluvia caida en mm.
</caption>
<thead>
<tr>
<th>Provincia</th><th>Enero</th><th>Febrero</th><th>Marzo</th>
</tr>
</thead>
<tbody>
<tr>
<th>Crdoba</th>
<td>210</td><td>170</td><td>120</td>
</tr>
<tr>
<th>Buenos Aires</th>
<td>250</td><td>190</td><td>140</td>
</tr>
<tr>
<th>Santa Fe</th>
<td>175</td><td>140</td><td>120</td>
</tr>
</tbody>
</table>
</body>
</html>
caption
{
font-family:arial;
font-size:15px;
text-align: center;
margin: 0px;
font-weight: bold;
padding:10px;
}
table
{
border-collapse: collapse;
}
th
{
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
padding: 0.5em;
background-color:#6495ed;;
}
thead th
{
background-color: #6495ed;
color: #fff;
}
tbody th
{
font-family:arial;
font-weight: normal;
background-color: #6495ed;
color:#ff0;
}
td {
border: 1px solid #000;
padding: .5em;
background-color:#ed8f63;
width:100px;
text-align:center;
}
<!DOCTYPE html>
<html>
<head>

</head>
<body>
<div id="caja1">
<p>Esta es la primer caja.</p>
<p>No se desplaza.</p>
</div>
<div id="caja2">
<p>Esta es la segunda caja.</p>
<p>Se desplaza 15 pxeles a la derecha y 5 hacia abajo de su posicin por
defecto.</p>
</div>
<div id="caja3">
<p>Esta es la tercer caja.</p>
</div>
</body>
</html>
#caja1,#caja2,#caja3 {
background-color:#f99;
font-size:1.3em;
}
#caja2 {
position:relative;
left:15px;
top:5px;
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="caja1">
</div>
<div id="caja2">
<p>Se desplaza a la coordenada de pantalla 40 en columna y 30 en fila (en
pxeles).</p>
</div>
<div id="caja3">
</div>
</body>
</html>
#caja1,#caja3 {
background-color:#f99;
font-size:1.3em;
}
#caja2 {
font-size:1.3em;
position:absolute;
left:40px;
top:30px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="caja1">
</div>
<div id="caja2">
</div>
<div id="caja3">
</div>
</body>
</html>
#caja1{
position:absolute;
background-color:red;
left:10px;
top:10px;
width:200px;
height:200px;
z-index:1;
}
#caja2{
position:absolute;
background-color:green;
left:50px;
top:50px;
width:200px;
height:200px;
z-index:3;
}
#caja3{
position:absolute;
background-color:blue;
left:30px;
top:30px;
width:200px;
height:200px;
z-index:2;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="barrasuperior">
Div superior
</div>
<div id="barralateral">
Div lateral
</div>
<div id="contenido">
Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido -
Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido -
Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido Aqu el contenido - Aqu el contenido -
</div>
</body>
</html>
*{
margin:0;
padding:0;
}
#barrasuperior{
position:fixed;
left:0px;
width:100%;
height:50px;
background-color:black;
color:white;
}
#barralateral{
position:fixed;
left:0px;
top:50px;
width:200px;
height:100%;
background-color:#eee;
}
#contenido{
padding-top:70px;
padding-left:220px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="columna1">
Aca va el contenido de la columna 1.Aca va el contenido de la columna 1.Aca
va el contenido de la columna 1.Aca va el contenido de la columna 1.Aca va
el contenido de la columna 1.Aca va el contenido de la columna 1.Aca va el
contenido de la columna 1.Aca va el contenido de la columna 1.Aca va el

contenido de la columna 1.
</div>
<div id="columna2">
Aca va el contenido de la columna 2. Aca va el contenido de la columna 2.Aca
va el contenido de la columna 2.Aca va el contenido de la columna 2.Aca va
el contenido de la columna 2.Aca va el contenido de la columna 2.Aca va el
contenido de la columna 2.Aca va el contenido de la columna 2.
</div>
</body>
</html>
*{
margin:0px;
padding:0px;
}
#columna1 {
position:absolute;
top:0px;
left:0px;
width:200px;
margin-top:10px;
}
#columna2 {
margin-left:220px;
margin-right:20px;
margin-top:10px;
background-color:#ffffbb;
}
<!DOCTYPE html>
<html>
<head>

<link
</head>
<body>
<img src="imagen1.png">
<p>
El texto envuelve a la imagen.El texto envuelve a la imagen.

El texto envuelve a la imagen.</p>
</body>
</html>
img {
float:right;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p><span class="letra">A</span>qu me pongo a cantar <br>

Al comps de la vigela; <br>
Que el hombre que lo desvela <br>

Una pena extraordinaria, <br>
Como la ave solitaria <br>
Con el cantar se consuela.</p>
<p><span class="letra">P</span>ido a los Santos del Cielo<br>

Que ayuden mi pensamiento; <br>
Les pido en este momento <br>
Que voy a cantar mi historia,<br>
Me refresquen la memoria <br>
Y aclaren mi entendimiento. </p>
<p><span class="letra">V</span>engan, santos milagrosos,<br>

Vengan todos en mi ayuda,<br>
Que la lengua se me auda <br>
Y se me turba la vista. <br>
Pido a mi Dios que me asista<br>
En una ocasin tan ruda. </p>
</body>
</html>
.letra {
float:left;
font-size:3em;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="caja1">
<p>caja1 caja1 caja1 caja1 caja1 caja1 caja1 caja1 caja1 caja1
caja1 caja1 caja1 caja1 caja1 caja1 caja1 caja1 caja1 caja1
</p>
</div>
<div id="caja2">
<p>
caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2
caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2

caja2
caja2 caja2 caja2 caja2 caja2 caja2 </p>
</div>
<div id="caja3">
<p>
</p>
</div>
<div id="caja4">
<p>
</p>
</div>
</body>
</html>
#caja1 {
float:left;
width:250px;
background-color:#ffc;
margin:10px;
}
#caja2 {
float:left;
width:250px;
margin:10px;
}
#caja3 {
float:left;
width:250px;
margin:10px;
}
#caja4 {
float:left;
clear:left;
width:250px;
margin:10px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="columna1">
Aqu el contenido de la columna 1.Aqu el contenido de la columna 1.Aqu el
contenido de la columna 1.Aqu el contenido de la columna 1.Aqu el
contenido
contenido
contenido
contenido
de
de
de
de
la
la
la
la
columna
columna
columna
columna
1.Aqu el contenido de la columna 1.Aqu el

1.
</div>
<div id="columna2">
Aqu el contenido de la columna 2.Aqu el contenido de la columna 2.Aqu el
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
contenido
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
de
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
la
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
columna
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.Aqu
2.
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
el
</div>
</body>
</html>
*{
margin:0;
padding:0;
}
#columna1 {
float:left;
width:200px;
border:1px solid #555;
}
#columna2 {
margin-left:210px;
background-color:#ffb;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="contenedor">
<div id="cabecera">
<h1>Aca el ttulo de la pgina</h1>
</div>
<div id="columna1">
<p>columna1. columna1. columna1. columna1. columna1. columna1.
columna1. columna1. columna1. columna1. columna1. columna1. columna1.
columna1. columna1.</p>
</div>
<div id="columna2">
<h2>Ttulo de la columna</h2>
<p>Contenido de la columna2. Contenido de la columna2. Contenido de
la columna2. Contenido de la columna2. Contenido de la columna2.
Contenido de la columna2. Contenido de la columna2. Contenido de la
columna2. Contenido de la columna2. Contenido de la columna2. Contenido
de la columna2. Contenido de la columna2. Contenido de la columna2.
de la columna2. Contenido de la columna2.</p>
</div>
<div id="pie">
Pi de pgina.
</div>
</div>
</body>
</html>
*{
margin:0px;
padding:0px;
}
#contenedor
{
width:100%;
line-height:130%;
background-color:#f2f2f2;
}
#cabecera
{
padding:10px;
color:#fff;
background-color:#becdfe;
clear:left;
}
#columna1
{
float:left;
width:200px;
margin:0;
padding:1em;
}
#columna2
{
margin-left:210px;
border-left:1px solid #aaa;
padding:1em;
}
#pie {
padding:10px;
color:#fff;
clear:left;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="contenedor">
<div id="cabecera">
<h1>Aca el ttulo de la pgina</h1>
</div>
<div id="columna1">

columna1. columna1.</p>
</div>
<div id="columna3">
columna3. columna3. </p>
</div>
<div id="columna2">
<h2>Ttulo de la columna</h2>
<p>Contenido de la columna2. Contenido de la columna2. Contenido de
la columna2. Contenido de la columna2. Contenido de la columna2.
Contenido de la columna2.</p>
</div>
<div id="pie">
Pi de pgina.
</div>
</div>
</body>
</html>
*{
margin:0;
padding:0;
}
#contenedor
{
width:100%;
line-height:130%;
background-color:#f2f2f2;
}
#cabecera
{
padding:10px;
color:#fff;
clear:left;
}
#columna1
{
float:left;
width:200px;
margin:0;
padding:1em;
}
#columna2
{
margin-left:210px;
margin-right:230px;
border-left:1px solid #aaa;
border-right:1px solid #aaa;
padding:1em;
}
#columna3
{
float:right;
width:200px;
margin:0;
padding:1em;
}
#pie {
padding:10px;
color:#fff;
clear:left;
}
<!DOCTYPE html>
<html>
<head>

</head>
<body>
<div id="cabecera">
<ul>
<li><a href="">Opcion 1</a></li>
</ul>
</div>
<div class="columna1">
<p>
columna1 columna1 columna1 columna1 columna1 columna1

</p>
</div>
<p>

</p>
</div>
<p>


</p>
</div>
<div id="pie">
<p>Copyright</p>
</div>
</body>
*{
margin:0;
padding:0;
}
body {
width: 960px;
margin: 0 auto;
}
#cabecera{
background-color: #eee;
padding: 10px;
margin: 10px;
}
#pie {
padding: 10px;
margin: 10px;
clear:both;
}
.columna1, .columna2, .columna3 {

width: 280px;
float: left;
margin: 10px;
padding: 10px;
}
li {
display: inline;
padding: 5px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="cabecera">
<ul>
</ul>
</div>
<p>

</p>
</div>
<p>

</p>
</div>
<p>

</p>
</div>
<div id="pie">
<p>Copyright</p>
</div>
</body>
*{
margin:0;
padding:0;
}
body {
width: 90%;
margin: 0 auto;
}
#cabecera{
padding: 10px;
margin: 10px;
}
#pie {
padding: 10px;
margin: 10px;
clear:both;
}
.columna1, .columna2, .columna3 {

width: 31%;
float: left;
margin: 1%;
}
li {
display: inline;
padding: 5px;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div>
<p>Primer prrafo</p>
<p>Segundo prrafo</p>
<ul>
<li><p>opcion 1</p></li>
</ul>
</div>
</body>
</html>
div>p{
color:#00f;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Titulo 1</h1>
<p>Esto es el primer prrafo.</p>
<p>Esto es el segundo prrafo.</p>
<p>Esto es el tercer prrafo.</p>
<h2>Titulo 2</h2>
<p>Esto es el primer prrafo.</p>
<p>Esto es el segundo prrafo.</p>
<p>Esto es el tercer prrafo.</p>

</body>
</body>
</html>
h1+p{
color:#f00;
}
h2~p{
color:#f00;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Enlaces a buscadores.</h1>
<ol>
<li>
<a href="http://www.google.com">Ir a google</a>
</li>
<li>
<a href="#">Ir a bing</a>
</li>
<li>
<a href="#" target="_blank">Ir a yahoo</a>
</li>
</ol>
</body>
</html>
a[href="#"]{
text-decoration:line-through;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ol>
<li>Primer opcin.</li>
<li>Segunda opcin.</li>
<li>Tercer opcin.</li>
<li>Cuarta opcin.</li>
</ol>
</body>
</html>
ol li:first-child {
color:green;
}
ol li:last-child {
color:red;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<table>
<tr>
<td>fila 1</td><td>fila 1</td>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
</table>
</body>
</html>
tr:nth-child(3n+2) {
background-color:red;
}
table {
border-collapse: collapse;
width:80%;
margin:0 auto;
}
td {
border: 1px solid #000;
text-align:center;
padding:0.5em;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="contenido">
<h1>Ttulo 1</h1>
<p>Primer prrafo.</p>
<p>Segundo prrafo.</p>
<p>Tercer prrafo.</p>
<h1>Ttulo 2</h1>
<h1>Ttulo 3</h1>
<h1>Ttulo 4</h1>
<h1>Ttulo 5</h1>
<h1>Ttulo 6</h1>
<h1>Ttulo 7</h1>
</div>
</body>
</html>
#contenido h1:nth-of-type(odd) {
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Fecha de inicio.</h1>
<ul id="fechainicio">
<li>10/10/2015</li>
</ul>
<h1>Fechas finales.</h1>
<ul id="fechafin">
<li>10/12/2015</li>
<li>24/12/2015</li>
</ul>
<div id="equipo1">
<h1>Participantes</h1>
<p>Pablo Martinez.</p>
</div>
<div id="equipo2">
<h1>Participantes</h1>
<p>Ana Luz.</p>
<p>Pedro Rodriguez.</p>
</div>
</body>
</html>
#fechainicio li:only-child {
color:blue;
}
#fechafin li:only-child {
color:blue;
}
#equipo1 p:only-of-type {
color:red;
}
#equipo2 p:only-of-type {
color:red;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div></div>
<p>Esto es una prueba de la pseudo-clase empty.</p>
</body>
</html>
div:empty {
width:80%;
margin:0 auto;
height:50px;
background-color:yellow;
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>El pseudo-elemento first-line permite aplicar
un estilo a la primer linea del contenido de un
elemento HTML. Tengamos en cuenta que la cantidad
de datos a mostrar en la primer lnea depende del
ancho de la ventana del navegador.</p>
</body>
</html>
p::first-letter {
font-size:1.5em;
color:red;
}
p::first-line {
}
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>SQL, Structure Query Language (Lenguaje de Consulta Estructurado) es
un lenguaje de programacion para trabajar con base de datos relacionales
como <strong>MySQL</strong>, Oracle, etc.</p>
<p><strong>MySQL</strong> es un interpretador de SQL, es un servidor de

base de datos.</p>
<p><strong>MySQL</strong> permite crear base de datos y tablas, insertar

datos, modificarlos, eliminarlos, ordenarlos, hacer consultas y realizar
muchas operaciones, etc., resumiendo: administrar bases de datos.</p>
<p>Ingresando instrucciones en la linea de comandos o embebidas en un

lenguaje como PHP nos comunicamos con el servidor. Cada sentencia debe
acabar con punto y coma (;).</p>
</body>
</html>
strong::before {
content:"";
}
strong::after {
content:"!";
}

Documento Css

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Documento Css

Transféré par

Droits d'auteur :

Formats disponibles

<!

Luego si escribimos un prrafo y encerramos un bloque con la marca bold

font:bold italic 25px verdana;

<h2>Ttulo de nivel 2</h2>

<p class="ex2">Este texto tiene 1.5 ex</p>

<p class="fondo2">Segundo prrafo</p>

#contenedorform form label {

<link rel="StyleSheet" href="estilos.css" type="text/css">

<link rel="StyleSheet" href="estilos.css" type="text/css">

contenido de la columna 1.Aca va el contenido de la columna 1.Aca va el

<link rel="StyleSheet" href="estilos.css" type="text/css">

El texto envuelve a la imagen.El texto envuelve a la imagen.

<p><span class="letra">A</span>qu me pongo a cantar <br>

Que el hombre que lo desvela <br>

<p><span class="letra">P</span>ido a los Santos del Cielo<br>

<p><span class="letra">V</span>engan, santos milagrosos,<br>

caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2 caja2

1.Aqu el contenido de la columna 1.Aqu el

<p>columna1. columna1. columna1. columna1. columna1. columna1.

<link rel="StyleSheet" href="estilos.css" type="text/css">

columna1 columna1 columna1 columna1 columna1 columna1

columna2 columna2 columna2 columna2 columna2 columna2

columna3 columna3 columna3 columna3 columna3 columna3

columna3 columna3 columna3 columna3 columna3 columna3

.columna1, .columna2, .columna3 {

columna1 columna1 columna1 columna1 columna1 columna1

columna2 columna2 columna2 columna2 columna2 columna2

columna3 columna3 columna3 columna3 columna3 columna3

.columna1, .columna2, .columna3 {

<p>Esto es el tercer prrafo.</p>

como <strong>MySQL</strong>, Oracle, etc.</p>

<p><strong>MySQL</strong> es un interpretador de SQL, es un servidor de

<p><strong>MySQL</strong> permite crear base de datos y tablas, insertar

<p>Ingresando instrucciones en la linea de comandos o embebidas en un

Vous aimerez peut-être aussi