Publicado el Deja un comentario

15 Html, Css. Fuentes

Cambia la fuente para los textos en tu #web usando #googleFonts.
Los cambios en los archivos de nuestra web son:

CSS
*{

margin:0 auto;

padding:0px;

/*font-family: ‘Playfair Display’, serif;*/

font-family: ‘Quicksand’, sans-serif;}


HTML
<head>

<title>Web principal</title>

<meta charset=”utf-8″>

<link rel=”stylesheet” href=”estilos.css”/>

<link href=”https://fonts.googleapis.com/css?family=Playfair+Display|Quicksand” rel=”stylesheet”>

</head>



Please follow and like us:
Publicado el Deja un comentario

03. CSS Propiedades Textos

En este video se exponen ejemplos de como dar formato a textos mediante CSS, cambiando color, tamaño y otras propiedades.

El codigo del archivo HTML es:

<!doctype html>
<html lang=”ES”>
<head>
<link rel=”stylesheet” type=”text/css” href=”css/formatoFuentes.css”>
<title>
Formato Fuentes
</title>
</head>
<body>
<header>
<nav>
</nav>
</header>
<section>
<article>
<hgroup>
<h1>Titulo Principal</h1>
<h2>Titulo Secundario</h2>
</hgroup>
</article>
<p class=”nowrap”>Parrafo nowrap                      primero jdlkf<br>jalkdjslakjflkajdkljflkasdjflkjadlkjflkasj<br>dflkjasdlkjflkajdlkfjldsakjfljlfjladsjlkfjladjlfjl</p>
<p class=”inherit”>Parrafo segundo  inherit                      jhdlkajdkjfsaaa<br>aaaaaaalkdfjdlajflajdlsjfldjslkfjlasdkjflkjsdljflsdjlfjlsdajfljsdlkfjlksdajflkjsdlj</p>
</section>
<aside>
</aside>
<footer>
<h4>Pie de pagina</h4>
</footer>
</body>
</html>

El codigo del archivo CSS es:

/*Comentario de CSS*/
/*selector universal*/
*{
    background-color:gray;
}
p{
    font-family:Helvetica,sans-serif;
    font-size:medium;
    font-style:italic;
    text-transform:lowercase;
    letter-spacing:3px;
    word-spacing:10px;
   
}
p .nowrap{
    white-space:nowrap;
}
p .inherit{
    white-space:inherit;
}
h1{
    font-size:1.25em;
    font-weight:bold;
    color:blue;
    text-shadow:4px 3px 5px red;
}
h2{
    font-size:1em;
    color:white;
    text-decoration:underline;
}

Espero sea util. No olvideis practicar.

Please follow and like us: