Cuadro con las esquinas redondeadas
A pedido de muchos de nuestros
usuarios realizamos este artículo en donde explicaremos cómo realizar un cuadro con las
esquinas redondeadas.
Ejemplo de cuadro
redondeado:
Código HTML:
El código html que debemos utilizar es
muy sencillo, se trata de simplemente de una tabla de de 3x3 (divida en 9 partes).
El tag <table..> abre la nueva tabla, veremos que allí dentro utilizamos el tag
<tr> que abre una nueva fila, y dentro de esta última, veremos 3 tags <td..>
con cada una de las celdas (para mayor información visite los
tutoriales de html).
<table border="0"
cellspacing="0" cellpadding="0" width="200">
<tr>
<td bgcolor="#FFCC00" width="19"><img
src="circ1.gif" width="19" height="18"></td>
<td bgcolor="#FFCC00"></td>
<td bgcolor="#FFCC00" width="19"><img
src="circ2.gif" width="19" height="18"></td>
</tr>
<tr>
<td bgcolor="#FFCC00" width="19"></td>
<td bgcolor="#FFCC00"><u><strong><font
face="Verdana"
size="2">Ejemplo</font></strong></u><p><font
face="Verdana" size="2">En este espacio es donde tienes que poner
el contenido del cuadro.</font></td>
<td bgcolor="#FFCC00" width="19"></td>
</tr>
<tr>
<td bgcolor="#FFCC00" width="19"><img
src="circ3.gif" width="19" height="18"></td>
<td bgcolor="#FFCC00"></td>
<td bgcolor="#FFCC00" width="19"><img
src="circ4.gif" width="19" height="18"></td>
</tr>
</table>
Ustedes pueden diseñar sus propios
cuadros redondeados, solamente deben realizar las 4 curvas con algún editor gráfico
(como Fireworks, Paint Shop Pro, etc.), y buscar un color que se adecue al diseño de un
sitio.
|
