Hoy fue la primer clase del segundo periodo, en la cual comenzamos a ver programación CSS, este consiste en el diseño de la página web. CSS tiene las tres siguientes reglas:
- La del punto (.)
- La del #
- Reutilización del HTML
La estructura básica es la siguiente:
Imágenes tomadas de: http://www.mclibre.org/consultar/amaya/css/css_quees.html
Hay que recordar digitar el punto y coma al final de cada "elemento", esto es importante, ya que si no se pone, el siguiente "elemento" no funcionará.
A continuación, un ejemplo de CSS:
Este es el código HTML:
(Con la etiqueta <link rel="stylesheet"> llama al código css)
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<link rel="stylesheet" type="text/css" href="estiloej1.css">
<body bgcolor="#F00" text="#FF0">
<h1>HOLAAAAAAAAAAAAAAAAAA</h1>
<h1 class="jaja">ADIOOOS</h1>
<br><hr>
<h2><p><span>A B C<span><p></h2>
</body>
</html>
Este es el código CSS:
body{color:#fff;
background-color: #d0dc81 ;
}
h1{font-family: "Helvetica";
font-size:"8px";
color: #225e2a ;
text-transform: lowercase;
background-color: #6a94b7;
text-shadow: 3px 3px #000; }
h1.jaja{color:#F00;
background-color:#66c292;}
h2 p span{font-family: "arial";
font-size:"8px";
color: #225e2a ;
text-transform: lowercase;
background-color: #6a94b7;
text-shadow: 60px 30px #999;}
hr{border-color: #F00;}
En el "h1.jaja" la función del punto ( .jaja ) es para que ese estilo CSS que está a continuación sea aplicado solamente a los h1 con clase .jaja, como por ejemplo, este h1
<h1 class="jaja">ADIOOOS</h1>
Ese h1 tiene la class="jaja"
About the author
admin had written 8 articles for Inspiration BlogDonec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec malesuada.
Suscribirse a:
Enviar comentarios (Atom)
Publicar un comentario