Foros aprenderaprogramar.com

Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: Dimitar Stefanov en 12 de Enero 2016, 15:58

Título: CSS equivalencia entre tamaños de fuente en pixeles, puntos, %, em etc. CU01024D
Publicado por: Dimitar Stefanov en 12 de Enero 2016, 15:58
Aquí os dejo mis códigos también. No sé si he hecho bien el ejercicios. Agredecería que alguien lo revisara y me comente los errores.

Código HTML:

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="keywords" content="programar,cursos">
<meta name="description" content="Portal web">
<link rel="stylesheet" type="text/css" href="estilos27.css">
</head>
<body>
<div id="page">
<div id="header">
</div>
<div id="wrapper">
<div id="menu">
</div>
<div id="body">
<table>
<tr>
<th>Título</th>
<th>Tamaño px</th>
<th>Tamaño em</th>
<th>Tamaño pt</th>
<th>Tamaño %</th>
</tr>
<tr id="a">
<td><h1>H1</h1></td>
<td>32.5</td>
<td>2</td>
<td>25</td>
<td>200</td>
</tr>
<tr id="b">
<td><h2>H2</h2></td>
<td>25</td>
<td>1.5</td>
<td>18</td>
<td>150</td>
</tr>
<tr id="c">
<td><h3>H3</h3></td>
<td>20</td>
<td>1.25</td>
<td>15</td>
<td>125</td>
</tr>
<tr id="d">
<td><h4>H4</h4></td>
<td>15</td>
<td>1</td>
<td>12.5</td>
<td>100</td>
</tr>
<tr id="e">
<td><h5>H5</h5></td>
<td>13.5</td>
<td>0.9</td>
<td>10</td>
<td>90</td>
</tr>
<tr id="f">
<td><h6>H6</h6></td>
<td>10.5</td>
<td>0.725</td>
<td>8.5</td>
<td>75</td>
</tr>
</table>
</div>
</div>
<div id="footer">
</div>
</div>
</body>
</html>

Código CSS: "estilos27.css"

Código: [Seleccionar]
table, td, th {
border: 2px solid;
}
th {
background-color: gray;
}
#a td:nth-child(2) {
font-size: 32.5px;
font-weight: bold;
}
#a td:nth-child(3) {
font-size: 2em;
font-weight: bold;
}
#a td:nth-child(4) {
font-size: 25pt;
font-weight: bold;
}
#a td:last-child {
font-size: 200%;
font-weight: bold;
}
#b td:nth-child(2) {
font-size: 25px;
font-weight: bold;
}
#b td:nth-child(3) {
font-size: 1.5em;
font-weight: bold;
}
#b td:nth-child(4) {
font-size: 18pt;
font-weight: bold;
}
#b td:last-child {
font-size: 150%;
font-weight: bold;
}
#c td:nth-child(2) {
font-size: 20px;
font-weight: bold;
}
#c td:nth-child(3) {
font-size: 1.25em;
font-weight: bold;
}
#c td:nth-child(4) {
font-size: 15pt;
font-weight: bold;
}
#c td:last-child {
font-size: 125%;
font-weight: bold;
}
#d td:nth-child(2) {
font-size: 15px;
font-weight: bold;
}
#d td:nth-child(3) {
font-size: 1em;
font-weight: bold;
}
#d td:nth-child(4) {
font-size: 12.5pt;
font-weight: bold;
}
#d td:last-child {
font-size: 100%;
font-weight: bold;
}
#e td:nth-child(2) {
font-size: 13.5px;
font-weight: bold;
}
#e td:nth-child(3) {
font-size: 0.9em;
font-weight: bold;
}
#e td:nth-child(4) {
font-size: 10pt;
font-weight: bold;
}
#e td:last-child {
font-size: 90%;
font-weight: bold;
}
#f td:nth-child(2) {
font-size: 10.5px;
font-weight: bold;
}
#f td:nth-child(3) {
font-size: 0.725em;
font-weight: bold;
}
#f td:nth-child(4) {
font-size: 8.5pt;
font-weight: bold;
}
#f td:last-child {
font-size: 75%;
font-weight: bold;
}

He ido probando las medidas, pero no sé si coinciden exactamente.
Título: Re:CSS equivalencia entre tamaños de fuente en pixeles, puntos, %, em etc. CU01024D
Publicado por: Ogramar en 15 de Enero 2016, 18:37
Buenas dimiste lo veo bien y has trabajado con las distintas unidades de medida que era lo que se pretendía con el ejercicio. Yo veo las medidas coincidentes.

Nota: si añades el centrado al texto de la tabla se ve todavía mejor, basta escribirlo así:

<table style="text-align:center;">

Salu2
Título: Re:CSS equivalencia entre tamaños de fuente en pixeles, puntos, %, em etc. CU01024D
Publicado por: Dimitar Stefanov en 15 de Enero 2016, 18:47
Hola Ogramar,

Ahora mismo estoy en el tutorial de text-align. Supongo que allí nos lo explicarán. Me has adelantado info, jeje. No se si lo podré hacer hoy, porque estoy un poco saturado. He tenido muchos problemas en entender las propiedades position: absolute y position:relative, pero creo que ya los he entendido. jeje

Gracias. Saludos