Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: Chompy129 en 20 de Septiembre 2016, 01:35
-
CSS font-size (uso de larger, smaller) font-weight o negrita (bolder, lighter). font-style o cursiva italic (CU01044D)
Para ver la tabla es necesario crear un documento HTML con el siguiente código:
Código HTML(CSS Interno):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Tipografía</title>
<style type="text/css">
/*DATOS GENERALES*/
*{font-family: arial;}
/*Clases*/
.tablas{border-spacing: 0; border: 1px solid #000;
width: 300px; height: auto; background-color: #DDD;
margin: 10px; float: left;}
.tablas caption{font-weight: bold; color: white; text-transform: uppercase;
background-color: black;
padding: 4px;}
.tablas tr:first-child{background-color: #F44; font-weight: 700;}
.tablas td{border: 1px solid #000; padding: 10px; font-size: 1em;}
.tablas tr td span{color: #973DFF; font-weight: 700}
</style>
</head>
<body>
<table class="tablas">
<caption>tipografia google ghrome</caption>
<tr>
<td>Tipo de titulo</td>
<td>Píxeles</td>
<td>em</td>
</tr>
<tr>
<td>H1</td>
<td>32<span>px</span></td>
<td>2<span>em</span></td>
</tr>
<tr>
<td>H2</td>
<td>24<span>px</span></td>
<td>1.5<span>em</span></td>
</tr>
<tr>
<td>H3</td>
<td>18.72<span>px</span></td>
<td>1.17<span>em</span></td>
</tr>
<tr>
<td>H4</td>
<td>16<span>px</span></td>
<td>1<span>em</span></td>
</tr>
<tr>
<td>H5</td>
<td>13.28<span>px</span></td>
<td>0.83<span>em</span></td>
</tr>
<tr>
<td>H6</td>
<td>10.72<span>px</span></td>
<td>0.67<span>em</span></td>
</tr>
</table>
<table class="tablas">
<caption>tipografia internet explorer</caption>
<tr>
<td>Tipo de titulo</td>
<td>Píxeles</td>
<td>em</td>
</tr>
<tr>
<td>H1</td>
<td>32<span>px</span></td>
<td>2<span>em</span></td>
</tr>
<tr>
<td>H2</td>
<td>24<span>px</span></td>
<td>1.5<span>em</span></td>
</tr>
<tr>
<td>H3</td>
<td>18.73px</td>
<td>1.17<span>em</span></td>
</tr>
<tr>
<td>H4</td>
<td>16<span>px</span></td>
<td>1<span>em</span></td>
</tr>
<tr>
<td>H5</td>
<td>13.26<span>px</span></td>
<td>0.82<span>em</span></td>
</tr>
<tr>
<td>H6</td>
<td>10.73<span>px</span></td>
<td>0.67<span>em</span></td>
</tr>
</table>
</body>
</html>
-
Hola Chompy129.
Todo bien.
Saludos. ;D