25 Técnicas CSS para realizar esquinas redondeadas
julio 28, 2007 at 12:30 pm Victor San Martin 7 comentarios
Cada día se hace mas habitual de uso de esquinas redondeadas o de box sin esquinas cuadradas, para los que usamos mozilla tenemos una simple propiedad CSS con la que podemos lograr ese efecto, pero por desgracia no se puede apreciar en otros navegadores. Actualmente técnicas para lograr esto son muchas, algunas con sólo CSS puro hasta incluso algunas opciones ocupando javascript para más seguridad (en algunos casos).En mis lecturas diarias, me encuentro vía digg con CSS Juice, un sitio en el cual han publicado un artículo dando a conocer 25 técnicas de como lograr este efecto, que como mencione anteriormente, cada vez se ocupa mas, si hasta en los anuncios de Google Adsence se puede hacer.
Sin más que agregar, les describo la lista a los manuales para lograr este efecto.
Técnicas
- ThrashBox – crea cajas con esquinas redondeadas con un efectos de sombra.
- Even More Rounded Corners With CSS– técnica de diálogos con esquinas redondeadas fluidas y soporte para border con transparencia Alpha y degrades.
- DomCorners – una técnica muy simple para conseguir esquinas redondeadas.
- virtuelvis.com Rounded corners in CSS
- Transparent custom corners and borders version 2 – una técnica para crear esquinas redondeadas personalizadas y borde con una transparencia Alpha opcional.
- CSS Teaser Box with rounded corners – por Roger Johansson, el mismo autor de Transparent custom corners and borders version 2.
- News List – fue diseñado para mostrar enlaces de noticias recientes.
- CSS Liquid Round Corners
- Anti-aliased Nifty Corners – basado en Nifty Corners y modificado por Steven Wittens.
- Simple Box by tedd – otra simple técnica para crear esquinas redondeadas.
- CSS and round corners making accessible menu tabs – técnica para crear menú con tab con un estilo de esquinas redondeadas.
- CSS and round corners borders with curves
- Airtight Corners – genera cajas con esquinas redondeadas usando solo una imagen.
- Mountaintop Corners – una manera más fácil para crear esquinas redondeadas decentes.
- Editsite Rounded Corners – creando esquinas redondeadas con javascript.
- Create a rounded block or design with CSS and XHTML – crear bloques redondeados fácilmente.
- Resizable box with freely stylable corners and surface – cajas redimensionables con esquinas redondeadas.
- Smart Round Corners
- Lean and Clean CSS boxes
- Broader Border Corners
- Snazzy Borders
- Rounded corners in CSS by Adam Kalsey
- curvyCorners – un script Javascript para crear esquinas redondeadas on-the-fly solo en elementos DIV.
- Nifty Corners – una solución basada en CSS y Javascript para obtener esquinas redondeadas con imágenes.
- quinncrowley.com – basado sobre una combinación de pixy y Kalsey
Generadores de equinas redondeadas
- http://www.roundedcornr.com/
- http://www.spiffycorners.com/ – manera simple de generar el CSS y HTML que necesitas para usar esquinas redondeadas usando imágenes o javascript.
- http://tools.sitepoint.com/spanky/ – una técnica experimental usando solo CSS para producir ’cajas con esquinas redondeadas y contenido’ semántico.
- http://spiffybox.com/
Tutoriales
- Rounded Corners with CSS and JavaScript por Simon Willison
- Rounded Corners without Images: A Nifty Corners Inspiration
- CSS Design: Creating Custom Corners & Borders por Søren Madsen
- Rounded Corner Boxes the CSS3 Way por Andy Budd
Enlace: 25 Rounded Corners Techniques with CSS
.
Ver Videos – Te Verde – Videos 3GP – 3GP – somos tu y yo
Entry filed under: CSS, Diseño, JavaScript - AJAX, Recursos, Web 2.0.
7 comentarios Add your own
Deja un comentario
Trackback this post | Subscribe to the comments via RSS Feed
1. viajesguia | May 16, 2008 a las 6:19 pm
cool!!!!!!!!!! gracias gracias es lo que estaba necesitando!!!!!!!!
2. SYSRJ | abril 14, 2010 a las 6:25 pm
ES UNA MUY BUENA HERRAMIENTA PARA LA CREACION DE ROBOTS CON MASHUPS Y EXTRACCION MASIVA DE INFORMACION NOSOTROS CONTAMOS CON LA ACCESORIA Y DESARROLLO A LA MEDIDA.
http://www.sysrj.com
sysrj@hotmail.com
3. Jose Tapia | julio 16, 2010 a las 11:33 am
Gracias genial la info
4. Tweets that mention 25 Técnicas CSS para realizar esquinas redondeadas « Quest’s Blog -- Topsy.com | enero 6, 2011 a las 12:57 pm
[…] This post was mentioned on Twitter by DJ Hennion. DJ Hennion said: 25 Técnicas CSS para realizar esquinas redondeadas http://bit.ly/gLYJdy #css RT @danilosandoval: 25 Técnicas CSS para realizar esquin… […]
5. Rosie | marzo 3, 2013 a las 4:41 am
When you quit, you can immediately feel its decision within 24 hours, health benefits, which
can cause you to not smoke forever. The Lenmar 1530 m – Ah for
the Amazon Kindle 1 e-reader is the first choice for consumers.
If a LED is used instead of a bulb, the connections will require
a bit more attention.
6. Dwayne | marzo 21, 2013 a las 1:28 am
Hurrah, that’s what I was exploring for, what a information! present here at this webpage, thanks admin of this site.
7. ipadrepairklang.wordpress.com | junio 13, 2013 a las 1:41 am
Hi! I realize this is sort of off-topic however I
had to ask. Does running a well-established website such as yours take a large amount of work?
I am brand new to blogging however I do write in my journal daily.
I’d like to start a blog so I will be able to share my personal experience and thoughts online. Please let me know if you have any kind of ideas or tips for brand new aspiring bloggers. Appreciate it!