Cómo aplicar un efecto de bisel en una capa?.
Para los que recién se inician en CSS o para los que necesitan refrescar la memoria; las capas se utilizan para aplicar estilos a partes amplias de un documento HTML y poseen atributos especiales que hacen más fácil su manejo. Para lograr que el efecto funcione hay que definir algunas propiedades: * Position * Background * Width * Top * Left Position contendrá el valor "relativo" que nos permitirá cambiar el valor de Top y Left. Background será definido en dos oportunidades y contendrá el color de base y el color de sombra. Width contendrá el ancho de la capa.
Top y Left serán definidos en dos oportunidades y contendrán los valores de posición de la capa base y capa sombra
Para lograr el bisel exterior puedes copiar el siguiente ejemplo: <html> <head> <style type="text/css"> body {background:#626262} #sombra {position:relative; background:black; width:100%; top:-1px; left:1px} #base {position:relative; background:#D7D7D7; top:-1px; left:-1px;} </style> </head> <body> <div id="sombra"> <div id="base"> </div> </div> </body> </html> |
jueves, 20 de octubre de 2011
Bisel exterior con CSS
Suscribirse a:
Enviar comentarios (Atom)
No hay comentarios:
Publicar un comentario