<!--Colorisacion de letras + hover - >
<!-- Colorisacion de letras + hover ->
<! para el compa -->
<!-- Siempre abre o inicia un body para darle fondo al diseño -->
<h1>Ejemplo</h1> <!-- Abrimos un texto -->
<!-- Ahora le daremos forma y diseño al texto -->
@charset "UTF-8"; /* Codificacion */
@charset "UTF-8"; /* Codificacion */
@import url(http://fonts.googleapis.com/css?family=Titan+One); /* Fuentes de letras */
/* iniciamos un body */
body{
background: #1b1e24; /* Fondo de la pagina */
font-family: arial; /* esto quiere decir que toda la pagina en general llevara la fuente arial */
text-align: center; /* esto quiere decir que el texto de la pagina estara centrado, reemplazando el famoso <center> de html */
}
/* ahora le daremos estilo a nuestro h1 o tipo de texto */
h1{
font-family: 'Titan One'; /* estamos llamando un tipo de fuente para nuestro texto */
font-size: 5em; /* aqui estamos declarando un tamaño de la arquitectura del texto */
color: hsl(5, 68%, 57%); /* estamos declarando un color tipo hsl, te recomiendo estudiar este tipo de colores ya que son muy necesarios */
margin: 2% auto; /* estamos dando una margen, esta es muy utilizada para ubicar la altitud baja y alta de letras o formas */
/* Manejaremos un tipo de estilo shadow que es lo mas cool que hay para dar un hover o doble estilo a textosu otros tipos de diseño */
text-shadow: #eee 0 0 1px;
}
/* ahora vamos por el hover, el hover es para dar un doble estilo al pasar el mouse por el texto u otro tipo de diseño */
h1:hover {
/* igualmente puede ser un box-shadow = si es una superficie redonda como un logo o un text-shadow si es texto, en este caso sera text-shadow **/
text-shadow: 2px 2p 20px #2c90c6, #fff 0 -1px 2px;
}