Atributos en CSS
8
ATRIBUTOS EN CSS
-
Upload
monica-garcia -
Category
Documents
-
view
9 -
download
2
Transcript of Atributos en CSS
ATRIBUTOS EN CSS
Colores
Con CSS se puede especificar colores para cada elemento HTML de la página, incluso hay elementos que podrían admitir varios colores, como el color de fondo o el color del borde. Pero bueno, vamos a ver ahora es las distintas maneras de escribir un color en una declaración CSS.
background-color: #ff8800;
background-color: #f80;
También podemos definir un color por su nombre. Los nombres de colores son en inglés, los mismos que sirven para especificar colores con HTML.
color: red;
border-color: Lime;
Notación de color con porcentajes de RGB
Se puede definir un color por los distintos porcentajes de valores RGB. Si todos los valores están al 100% el color es blanco. Si todos están al 0% obtendríamos el negro y con combinaciones de distintos porcentajes de RGB obtendríamos cualquier matiz de
color.color: rgb(33%, 0%, 0%);
background-color: transparent;
Pseudo-element en CSS
sirven para aplicar estilos a partes más específicas dentro de una etiqueta.
Es decir, para el ejemplo concreto de la etiqueta párrafo, con los pseudo elementos podemos definir el estilo para la primera letra del párrafo y para la primera línea.
Es decir, con CSS podemos definir el estilo de una etiqueta, pero con los pseudoelementos no nos limitamos a definir el estilo para todo el contendido de esa etiqueta, sino que indicamos el estilo para una parte restringida de esa etiqueta.
Un efecto habitual de algunas publicaciones, por ejemplo las de cuentos para niños, es hacer más grande la primera letra de una página y decorarla de alguna manera. Con CSS podemos aplicar estilos específicos y hacer, por ejemplo, que esa primera letra sea más grande y tenga un color distinto del resto del párrafo.
Se utiliza de esta manera:
P:first-letter { font-size: 200%; color: #993333; font-weight: bold; }
Clases y Id<html>
<head> <title> CSS </head> </title>
<link type=“text/css” rel=stylesheet” href=“clasesid.css”/>
</head>
<body>
<div class=“ menu”>
</div> <br> <br>
<div id=“main”>
</div>
</body>
</html>
Archivo clasesid.css
div {
width: 300px;
height: 400 px;
Background-color:lime;
}
.menu
{
background-color:aqua;
}
#main
{
width:500 px;
}
