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
    123
45678910
11121314151617
181920 21222324
252627282930 

Jueves 21 de Noviembre 2024
Semana 47

..............................................................................................................................................................................................................................................
(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