Temas > Programacion > Css > Borde de una marca HTML con CSS
Julio

Propiedades relacionadas al borde de una marca HTML
Debemos ahora hacernos la idea que todo elemento que se crea dentro de una
página HTML genera una caja. Imaginemos los controles que hemos creado
h1,h2,h3,p,em, etc.; si fijamos la propiedad background-color veremos que
el contenido se encuentra dentro de un rectángulo.
Podemos acceder a las propiedades del borde de ese rectángulo mediante las
CSS; las propiedades más importantes a las que tenemos acceso son:
       border-width
       border-style
       border-color
Veamos un ejemplo que inicialice estas propiedades:
<?php //esto no va
<html>
<head>
<title>Problema</title>
<link rel="StyleSheet" href="estilos.css" type="text/css">
</head>
<body>
<p class="pregunta">Quién descubrió América
y en que año fue?</p>
<p class="respuesta">Colón en 1492</p>
</body>
</html>
estilos.css
.pregunta {
  background-color:#ffff00;
  border-width:1px;
  border-style:solid;
  border-color:#000000;
}
.respuesta {
  border-width:1px;
  border-style:dashed;
  border-color:#000000;
}
?>//esto no va
Como podemos ver, hemos definido dos clases .pregunta que inicializa el
color de fondo en amarillo y luego define el ancho del borde en un pixel,
el estilo es sólido y el color de la línea de borde es negro.
Luego recordar que para indicar que una marca tenga este estilo debemos
inicializar la propiedad class de la marca HTML:
<?php //esto no va
<p class="pregunta">Quién descubrió América y en que año fue?</p>
?>//esto no va
Al segundo estilo definido lo hemos hecho con la clase .respuesta
<?php //esto no va
.respuesta {
  border-width:1px;
  border-style:dashed;
  border-color:#000000;
}
?>//esto no va
En ésta hemos cambiado el estilo de borde.
Disponemos de los siguientes estilos de borde:
       none
       hidden
       dotted
       dashed
       solid
       double
       groove
       ridge
       inset
       outset













¿Has olviado tu contraseña?

Pulsa aquí para registrate




Google




LunMarMieJueVieSabDom
      1
2345678
9 101112131415
16171819202122
23242526272829
3031     

Martes 10 de Diciembre 2024
Semana 50

..............................................................................................................................................................................................................................................
(Contacto)..
Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios. Política de privacidad y Aviso legal
Rechazar    Aceptar