Autor Tema: HTML y CSS Líneas separadores, etiqueta <hr> propiedad border-style CU00716B (Leído 7280 veces)

Eva l · « **en:** 14 de Junio 2017, 19:07 »

Hola!

Tengo un problema con el Ejercicio de la Clase CU00716B del Curso de HTML de aprenderaprogramar. Sucede que al ejecutar el código corrigiendo con CSS, el resultado no es el mismo que el que se mostraba con código original. Me aparecen dos líneas horizontales finitas en gris, es decir sin formato.

Este es el código:

Código: [Seleccionar]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Ejemplo del uso de separadores - aprenderaprogramar.com</title>
	</head>
	<body>
		<p>A continuación insertamos un separador.</p>
		<hr style="size:8px;color:black;" />
		<p>A continuación seguimos escribiendo debajo del separador.</p>
		<hr style= "size:2px;color:black;" />
	</body>
</html>

GRACIAS

pedro,, · « **Respuesta #1 en:** 15 de Junio 2017, 22:22 »

Hola Eva.

En primer lugar recomendarte leer el siguiente enlace con las normas básicas de publicación en el foro, entre otras temas, se explica como insertar adecuadamente el código en tus mensajes.
https://www.aprenderaprogramar.com/foros/index.php?topic=1460.msg7784#msg7784

Para aumentar el grosor de las líneas usando instrucciones CSS debes de usar "height" y no "size" y para el color de fondo "background-color" en vez de "color".

Saludos.

Eva l · « **Respuesta #2 en:** 16 de Junio 2017, 00:24 »

No sabía de como insertar código. Gracias por esa recomendación.

#1

Por otro lado. Me confundí de código. El que tenía problemas es este:

Código: [Seleccionar]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Ejercicio 3 - Ejemplo 1 - Uso de separadores Clase 16</title>
	</head>
	<body>
		<p>A continuación insertamos un separador.</p>
		<hr style = " heigth:5px; width:50%; text-align:center;margin-right:0px; background-color:red;color:red;"/>
		
	</body>
</html>

Al ejecutar ese código no me muestra la línea horizontal roja, y me muestra una línea gris finita.

#2

EL otro problema que ahora me surgió es que en el siguiente código, se muestra una linea verde y no roja como deberíá ser.

Código: [Seleccionar]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Ejercicio 3 - Ejemplo 1 - Uso de separadores Clase 16</title>
	</head>
	<body>
		<p>A continuación insertamos un separador.</p>
		<hr size=”5px” width= “50%” align=”center” color=”red”/>
		
	</body>
</html>

pedro,, · « **Respuesta #3 en:** 16 de Junio 2017, 10:11 »

Buenas.

En la primer problema, es debido a que escribiste mal "height".

El segundo problema es debido a que estás usando un formato de comillas que el intérprete html no reconoce.
Estas usando ”” cuando deberías usar ""

Saludos.

Eva l · « **Respuesta #4 en:** 16 de Junio 2017, 19:27 »

Gracias! Corregí esos errores y funcionó

Pero ahora tengo otro problema. Es de la misma clase (CU00716B del Curso de html). El siguiente código no funciona correctamente. Muestra una linea gris finita. No sé que está mal, tuve en cuenta las comillas "" y puse el equivalente en CSS de la tabla de la clase CU00716B. Tenia que escribir usando CSS lo siguiente:

<hr size=”2px” width=”80%” noshade=“noshade” align=“right” />

Este es el código:

Código: [Seleccionar]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Ejercicio 4 - Ejemplo 1 - Uso de separadores Clase 16</title>
	</head>
	<body>
		<p>A continuación insertamos un separador.</p>
		<hr style="height:2px;width:80%;border-style:1px solid #000;text-align:right;margin-right:0px;" />
		
	</body>
</html>

pedro,, · « **Respuesta #5 en:** 17 de Junio 2017, 17:18 »

Buenas.

Estás aplicando incorrectamente la propiedad border-style, en esta propiedad solo se puede establecer el diseño que tendrá el borde, no puedes indicar grosor ni color.

Prueba con esto:

Código: [Seleccionar]

<hr style="height:2px;width:80%;border-style:none; margin-right:0;" />
Saludos.

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias:

Autor Tema: HTML y CSS Líneas separadores, etiqueta <hr> propiedad border-style CU00716B (Leído 7280 veces)

Eva l

HTML y CSS Líneas separadores, etiqueta <hr> propiedad border-style CU00716B

pedro,,

Re:html - Clase16 - Ejercicio etiqueta <HR>

Eva l

Re:html - Liíneas separadores, etiqueta <hr> CU00716B

pedro,,

Re:html - Liíneas separadores, etiqueta <hr> CU00716B

Eva l

Re:html - Liíneas separadores, etiqueta <hr> CU00716B

pedro,,

Re:html - Liíneas separadores, etiqueta <hr> CU00716B

Preguntas y respuestas