Foros del web, para los que viven de bits

Drako_18 · 11-oct-2005, 10:53

Hola amigos, me gustaria saber como puedo poner una imagen en el borde de una tabla, osea totalmente pegado, como si fuera el propio borde de la tabla, haciendolo de tal forma, que no se note la diferencia.

Gracias de antemano.

Erik© · 11-oct-2005, 18:31

Puedes crear dos Div's... no crees?
Luego crear algo asi

Código:

Style:
div#border{
padding:1px;
background:url('archivo.gif');
}
dirv#content{
background:#fff;
}

y poner en el HTML

<div id="border">
   <div id?"content>Contenido...</div>
</div>

Espero que te sirva... cualquier duda preguntala... :D

Salu2

Drako_18 · 12-oct-2005, 05:06

Veras, yo lo que quiero esque los boder de una tabla como esta...
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>...
</table>

Erik© · 12-oct-2005, 19:16

mmm el tag Table no tiene soportado poner imagenes como bordes...(solo colores hexadecimales), aunque puedes seguir la idea que te comenté pero esta vez aplicarias el id a la etiqueta table...

Salu2

Drako_18 · 13-oct-2005, 01:39

Gracias, talvez pueda solucionar lo que quiero hacer

CORE · 14-oct-2005, 00:26

td{
background:url('archivo.gif'); bottom center no-repet;
}

no lo probe pero igual y asi sirve

saludos

furoya · 14-oct-2005, 19:03

Hola todos :

A mi también me parece que el borde no acepta background (mucho menos una imagen dentro) así que habrá que inventar algo.

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<style>
.alfa{
background-image: url(http://www.forosdelweb.com/images/rating/rating_5.gif);
background-position: top center;
border-width:0px;
}
.alfa td{
background-color: #ffffff;
font-size: 16px;
font-family: "times new roman", arial;
}


.zulu{
background-color: #ffffff;
}
.yankee{
font-size: 1px;
background-image: url(http://www.forosdelweb.com/images/editor/justifycenter.gif);
background-repeat: repeat-x;
background-position: center;
height: 15px;
}
.xray{
background-image: url(http://www.forosdelweb.com/images/editor/justifycenter.gif);
background-repeat:repeat-y;
background-position:center;
}
.whisky{
background-color:#ffffff;
padding:10px;
border:1px solid;
}
</style>
</head>
<body>
<table class="alfa" border=1 cellspacing=12>
<tbody>
<tr>
<td>QWERTYUIOP</td>
<td>QWERTYUIOP</td>
</tr>
</tbody>
</table>

<br /><br />

<table class="zulu" border=0 cellspacing=0>
<tbody>
<tr>
<td><img src="http://www.forosdelweb.com/images/editor/justifycenter.gif" /></td>
<td class="yankee">&nbsp;</td>
<td class="yankee">&nbsp;</td>
<td><img src="http://www.forosdelweb.com/images/editor/justifycenter.gif" /></td>
</tr>
<tr>
<td class="xray">&nbsp;</td>
<td class="whisky">QWERYUIOP</td>
<td class="whisky">QWERYUIOP</td>
<td class="xray">&nbsp;</td>
</tr>
<tr>
<td class="xray">&nbsp;</td>
<td class="whisky">QWERYUIOP</td>
<td class="whisky">QWERYUIOP</td>
<td class="xray">&nbsp;</td>
</tr>
<tr>
<td><img src="http://www.forosdelweb.com/images/editor/justifycenter.gif" /></td>
<td class="yankee">&nbsp;</td>
<td class="yankee">&nbsp;</td>
<td><img src="http://www.forosdelweb.com/images/editor/justifycenter.gif" /></td>
</tr>
</tbody>
</table>
</body>
</html>

Por supuesto que las imágenes deben ser tipo "mosaico". El segundo es el mismo que se usa para el efecto de bordes con esquinas redondas.

saludos

furoya

axiertxo · 18-oct-2005, 13:40

aber hay dos soluciones:
-con tablas recortando una imagen y poniendolas como background de las celdas de las esquinas.

-y con CSS pon iendo una imagen en posicion relativa.

saludo si no te basta con esto mira un ejemplillo que hice hace mucho

www.blogsecreto.com

Mira lo de pasos a seguir. son imagenes. bajate la web y observa el codigo. Esto lo hice hace mucho. ahora lo ahria con CSS. saludos

webosiris · 18-oct-2005, 13:46

Cita:

hay dos soluciones:

Ha una tercera... esperar a que salga CSS 3

en donde SI (aparentemente) existirá la posibilidad de colocar una imagen como borde de tabla...

axiertxo · 19-oct-2005, 01:40

Cita:

Iniciado por webosiris

Ha una tercera... esperar a que salga CSS 3

en donde SI (aparentemente) existirá la posibilidad de colocar una imagen como borde de tabla...

Y una cuarta con CSS3 hacer un border-radius pa poner bordes curvos sin imagenes!

haber quien saca la quinta jeje

Drako_18 · 19-oct-2005, 02:41

Hola, y donde puedo encontrar informacion sobre CSS3 en español???
(en referencia a las imagenes en los bordes...)

Gracias a todos ^^

axiertxo · 19-oct-2005, 03:44

Traduccion de google de la pagina de CSS3 de W3C consortium

http://translate.google.com/translat...lr%3D%26sa%3DG

La original
http://www.w3.org/TR/2005/WD-css3-background-20050216/

Rafael · 19-oct-2005, 07:39

Aunque la misma Css3 está estancada.

the_web_saint · 10-may-2008, 10:47

Hola, soy nuevo por aqui pero quisiera dejar mi humilde aporte:

Se Puede tambn colocar la tabla dentro de un DIV y a este colocarle estilos en css como por ejemplo:

background-image:url(lo_que_sea.gif);
background-position:right;
background-repeat:repeat-y;

y a la tabla le colocas border=0, esto se ve como si le estuvieras dando una imagen al borde derecho de la tabla, pero en realidad es al div que se le coloco un fondo alineado a la derecha.
:)

11-oct-2005, 10:53	#1 (permalink)
Drako_18 Fecha de Ingreso: mayo-2005 Ubicación: España Mensajes: 157	una imagen ponerla de borde en una tabla Hola amigos, me gustaria saber como puedo poner una imagen en el borde de una tabla, osea totalmente pegado, como si fuera el propio borde de la tabla, haciendolo de tal forma, que no se note la diferencia. Gracias de antemano. __________________ Desarrollo web personal y Professional, Hosting (Alojamiento Web) y venta de Dominios. Mi Web---> http://www.info-espada.es Mi email--->comercial@info-espada.es

11-oct-2005, 18:31	#2 (permalink)
Erik© Fecha de Ingreso: agosto-2005 Mensajes: 35	Puedes crear dos Div's... no crees? Luego crear algo asi Código: Style: div#border{ padding:1px; background:url('archivo.gif'); } dirv#content{ background:#fff; } y poner en el HTML <div id="border"> <div id?"content>Contenido...</div> </div> Espero que te sirva... cualquier duda preguntala... :D Salu2 __________________ Saludos Erik© (Antes loco_erik ... por reflexion de lo feo que suena me cambie de nick ;) ) :si:

12-oct-2005, 05:06	#3 (permalink)
Drako_18 Fecha de Ingreso: mayo-2005 Ubicación: España Mensajes: 157	Veras, yo lo que quiero esque los boder de una tabla como esta... <table> <tr> <td></td> <td></td> <td></td> </tr>... </table> __________________ Desarrollo web personal y Professional, Hosting (Alojamiento Web) y venta de Dominios. Mi Web---> http://www.info-espada.es Mi email--->comercial@info-espada.es

12-oct-2005, 19:16	#4 (permalink)
Erik© Fecha de Ingreso: agosto-2005 Mensajes: 35	mmm el tag Table no tiene soportado poner imagenes como bordes...(solo colores hexadecimales), aunque puedes seguir la idea que te comenté pero esta vez aplicarias el id a la etiqueta table... Salu2 __________________ Saludos Erik© (Antes loco_erik ... por reflexion de lo feo que suena me cambie de nick ;) ) :si:

13-oct-2005, 01:39	#5 (permalink)
Drako_18 Fecha de Ingreso: mayo-2005 Ubicación: España Mensajes: 157	Gracias, talvez pueda solucionar lo que quiero hacer __________________ Desarrollo web personal y Professional, Hosting (Alojamiento Web) y venta de Dominios. Mi Web---> http://www.info-espada.es Mi email--->comercial@info-espada.es

14-oct-2005, 00:26	#6 (permalink)
CORE Fecha de Ingreso: noviembre-2002 Ubicación: Merida Mensajes: 2.179	td{ background:url('archivo.gif'); bottom center no-repet; } no lo probe pero igual y asi sirve saludos

18-oct-2005, 13:40	#8 (permalink)
axiertxo Fecha de Ingreso: octubre-2005 Ubicación: España Mensajes: 389	aber hay dos soluciones: -con tablas recortando una imagen y poniendolas como background de las celdas de las esquinas. -y con CSS pon iendo una imagen en posicion relativa. saludo si no te basta con esto mira un ejemplillo que hice hace mucho www.blogsecreto.com Mira lo de pasos a seguir. son imagenes. bajate la web y observa el codigo. Esto lo hice hace mucho. ahora lo ahria con CSS. saludos __________________ El mundo exige resultados. No le cuentes a otros tus dolores del parto. Muéstrales al niño.

18-oct-2005, 13:46	#9 (permalink)
webosiris Moderador HTML y CSS Fecha de Ingreso: noviembre-2002 Ubicación: /home/montevideo Mensajes: 6.249	Cita: hay dos soluciones: Ha una tercera... esperar a que salga CSS 3 en donde SI (aparentemente) existirá la posibilidad de colocar una imagen como borde de tabla... __________________ Oraculus.com. Sitios web artesanales para el siglo XXI PSD a HTML. Tu diseño. Nuestro código.

19-oct-2005, 01:40	#10 (permalink)
axiertxo Fecha de Ingreso: octubre-2005 Ubicación: España Mensajes: 389	Cita: Iniciado por webosiris Ha una tercera... esperar a que salga CSS 3 en donde SI (aparentemente) existirá la posibilidad de colocar una imagen como borde de tabla... Y una cuarta con CSS3 hacer un border-radius pa poner bordes curvos sin imagenes! haber quien saca la quinta jeje __________________ El mundo exige resultados. No le cuentes a otros tus dolores del parto. Muéstrales al niño.

19-oct-2005, 02:41	#11 (permalink)
Drako_18 Fecha de Ingreso: mayo-2005 Ubicación: España Mensajes: 157	Hola, y donde puedo encontrar informacion sobre CSS3 en español??? (en referencia a las imagenes en los bordes...) Gracias a todos ^^ __________________ Desarrollo web personal y Professional, Hosting (Alojamiento Web) y venta de Dominios. Mi Web---> http://www.info-espada.es Mi email--->comercial@info-espada.es

19-oct-2005, 03:44	#12 (permalink)
axiertxo Fecha de Ingreso: octubre-2005 Ubicación: España Mensajes: 389	Traduccion de google de la pagina de CSS3 de W3C consortium http://translate.google.com/translat...lr%3D%26sa%3DG La original http://www.w3.org/TR/2005/WD-css3-background-20050216/ __________________ El mundo exige resultados. No le cuentes a otros tus dolores del parto. Muéstrales al niño.

19-oct-2005, 07:39	#13 (permalink)
Rafael Fecha de Ingreso: marzo-2003 Mensajes: 1.052	Aunque la misma Css3 está estancada.

10-may-2008, 10:47	#14 (permalink)
the_web_saint Fecha de Ingreso: mayo-2008 Ubicación: localhost/tierra/america/panama Mensajes: 509	Re: una imagen ponerla de borde en una tabla Hola, soy nuevo por aqui pero quisiera dejar mi humilde aporte: Se Puede tambn colocar la tabla dentro de un DIV y a este colocarle estilos en css como por ejemplo: background-image:url(lo_que_sea.gif); background-position:right; background-repeat:repeat-y; y a la tabla le colocas border=0, esto se ve como si le estuvieras dando una imagen al borde derecho de la tabla, pero en realidad es al div que se le coloco un fondo alineado a la derecha. :)

Herramientas
Mostrar Versión Imprimible Enviar por Correo
Desplegado
Mode Lineal Cambiar a Modo Hibrido Cambiar a Modo Hilado