Aprendiendo a usar CSS por Fabián Gonzalez 01

Aprendiendo a usar CSS por Fabián Gonzalez 01


Bueno paso a dejar las instrucciones para poder utilizar los estilos
encadenados en html, haciendo nuestras páginas webs más dinámicas y
profesionales

Las reglas de css serían las siguientes

Selector{
propiedad: valor;
}

Selector
En general dentro del selector podremos identificarlo con cualquier etiqueta
html los utilizaremos de la siguiente manera ejemplo,
<b>,<p>,<form> los pasamos a a b,p, form, sin la simbología
<>. Con esto haremos que cualquiera de esas etiquetas lleven los valores
a poner a continuación.

Propiedad

La propiedad es el atributo que queremos poner para luego cambiar sus valores,
por ejemplo aquí se puede utilizar tales como: background, Font, size etc

Valor
Aquí pondremos a continuación de la propiedad las características buscadas de
la misma. Como por ejemplo, funte tipo Comic Sans, color de letra rojo, tamaño
14 etc.

Como muchos quienes programan y para quienes recién empiezan
pueden saber que los css heredan de otros lenguajes muchas características de
los mismos, como por ejemplo el uso de las llaves {} después del selector para
comenzar con la declaraciones de valores y propiedades. Terminamos cada valores
con punto y coma “;” y también podemos hacer notas entre “/*” para empezar y “*/”
para terminar, al igual que el lenguaje c todo lo que haya dentro de lasanotaciones no podrá ser visto luego de ser ejecutado.



Ejemplo
Tomaremos como ejemplo todo el documento (body/cuerpo de la pagina), como
propiedad tenemos el fondo de la web (background) le pondremos de color negro
(hexadecimal #000000). Los caracteres tendrán la opción de la negrita activada.


Body {
Background
Font-weight: bold; /*fuentes en negrita*/
}

Si el valor fuese una
palabra compuesta (con espacios), tenemos que ponerla entre comillas dobles (“”) o simples (‘’)

q3 {
Font-family: “Comic Sans MS”;
}

Para que haya una

mejor lectura del código, es aconsejable separar por líneas para escribir cada
una de las declaraciones.

P {text-aling:right; /*Línea
1*/
color:
#FF0000 /*Línea 2*/
}


b { text-aling:right;
color: #FF0000 }

Las reglas “p” y “b”
tienen el mismo efecto final, la sintaxis es perfecta en ambas, pero la lectura
de “p” es mucho mas cómoda y ordenada.

0 comentarios: