Esquinas redondeadas
A todos nos encantan las esquinas redondeadas en los diseños Web. Generalmente se hace con CSS e imágenes para componer las esquinas.
Vean el título de este artículo: la esquina superior derecha es en realidad una imagen especificada en la CSS.
Hasta donde conocía, la única forma de hacerlo era así, pero el otro día encontré un sitio donde explican cómo hacer esquinas redondeadas sólo con CSS. El truco es anidar varias etiquetas <b> y darles diferentes márgenes y solapamientos.
Ésa es la versión básica. Para hacer más flexible el truco, se han programado una librería en JavaScript y una hoja CSS que simplifican en gran medida el uso de este “truco”.
La página donde vi todo esto es ésta: Nifty Corners, de Alessandro Fulciniti.
Ejemplos:
- http://www.html.it/articoli/niftycube/nifty1.html
- http://www.html.it/articoli/niftycube/nifty2.html
- http://www.html.it/articoli/niftycube/nifty3.html
- http://www.html.it/articoli/niftycube/nifty4.html
El HTML es válido, por cierto. Tremendo lo que se puede hacer con CSS …
1 Comentario »
RSS para este artículo. · TrackBack URI
inyaka ha escrito:
25/08/2007 @ 21:26
la tecnica para redondear esquinas sin imagenes,, anidando div, tiene el problema (ademas de ser mas complicado) de que se pixela miserablemente, y en verdad 4 png bien puestos en su sitio no pesan mucho
por cierto, buen blog
por cierto aca hay muy buenos desarrollos con css el tipo es un genio http://www.cssplay.co.uk/