Quitar el borde a las imagenes.
Algunas plantillas de Blogger vienen con el borde de las imagenes que añadas incluido, si no te gusta puedes quitarlo de una forma muy simple:
Localizas en tu plantilla en modo Html, esta parte del código:
}
.post img {
padding:4px;
border:1px solid $bordercolor;
}
Cambias el valor de "border" por 0, y listo.
Si también quieres quitarle el borde a la imagen que se muestra en tu perfil, localizas esta parte del código en la plantilla y sustituyes el valor de "border" por 0 igual que antes:
.profile-img {
float: left;
margin: 0 5px 5px 0;
padding: 4px;
border: 1px solid $bordercolor;
}
68 comentarios:
¡Genial! Este finde me pongo a practicar (las lentas necesitamos parctica y paciencita, ja mía =o)
Ya puestas y como te has convertido en mi asesora de imagen, ¿cómo hago para que los links que coloco se abran en una ventana aparte?????
Otro besote y perdona a esta pesá que es tan fan de tu blog!!!
Pesada dice...ojalá todas las visitas tubieran tu generosidad a la hora de dejar un comentario.
Para abrir el link en ventana aparte busca en la pestaña "trucos blog" el post "abrir página en una ventana nueva" allí lo explico.
Besotess!!!
Lo vi luego de dejarte el comment anterior, pero ´se me enredó la cosa en la oficina y ya no pude decirte. Lo dicho ¡eres una genia!
Me funciono muy bien, gracias por este y otros comentarios de tu blog.
Vicente, gracias a ti!
Hola Rosa! Gracias por los consejos que dia a dia nos das a todos nosotros. Una consulta hay alguna forma de cambiar el tamaño (predeterminado) que nos da blogger para subir imagenes en los post? Lo que me pasa a mi es que me quedan muy chicos en "grandes" y no llegan a cubrir todo el ancho de la columna.
GRACIAS
www.hispanofc.net
SR. HISPANO , pues no, no hay ninguna forma que yo sepa.
Jejeje, más simple de lo que pensaba. Gracias Rosa, siempre salvando.
NO ME APARECEN ESOS CODIGOS, tengo blogspot y en mi Edicion HTML,no me aparecen los codigos que muestras, sera por la plantilla moderna, en fin necesito ayuda urgente.
es muy poco etico los margenes del perfil y de las imagenes con vinculos, si alguien sabe alguna ayuda
Salu2!
kco, no es porque la plantilla sea moderna, es porque no es un diseño original de Blogger.
Prueba colocando esto:
a img{ border-width:0}
En tu código por ejemplo después de:
.image {
float: left;
margin: 0;
}
Usa la vista previa porque no estoy segura que funcione en esa plantilla.
me resulto de maravilla!, altoque muchas gracias era lo que estaba buscando...
y gracias por contestar tan rapido
Hola! Es primera vez que veo este blog. Gracias! Me ayudaste, necesitaba esto, estube todo un dia buscando y ninguno me seriva, en verdad muchas gracias!, sigue asi, vendre a visitar esta pagina cada ves que tenga una duda. bueno adios, enserio muchas gracias.
Gracias lo aplique en mi blog www.ideapy.com/guri
Wow, gracias Rosa, me has savado la vida, y el diseño mi blog :) porque no combinaba el borde ese...grax
Me sirvió, a igual que "kco" no me aparecía ese código, pero agregando a img{ border-width:0} después del código que tenia pude hacerlo.
Gracias Rosa.
Germánico Genial que lo hayas intentado guiándote por comentarios anteriores y más genial aún que lo hayas conseguido ;) no todos leen los comentarios antes de preguntar y muchas veces en ellos está la mejor ayuda.
rosa gracias, gracias,gracias, los cambios son faciles de hacer por que lo explicas de maravillas :)
Rosa:yo quiero ponerle el borde a las imagenes como hago!?
mi plantilla de blogger es herbert
RoCk AnD pOp Pues añadir en el CSS el código que ves en la entrada:
.post img {
padding:4px;
border:1px solid $bordercolor;
}
Hazlo justo antes de ]]></b:skin>
Rosa te cuento, siempre cuando inserto un enlace a un texto o imagen aparece un subrayado que no he podido quitar hasta ahora. ¿Qué puedo hacer?
Mira, así aparecen (imagen)
Gracias!!! lo hice y resultó.
Angélica.
Rosaaaaaaaaaaaaaaaaaaa tengo un problema sabes que al añadir una imagen en el footer o mejor dicho añado un formuario de comentarios con una imagen la imagen del footer, sale con un marco morado, esto solo pasa en IE en google chrome me sale normal, hay manera de quitar ese borde?
sixto76Coloca esto en el CSS:
a img{ border-width:0;}
hola rosa e leido el post entero y aun asi no e pòdido quitar el borde de mis entradas y es k en mi plantilla no aparecen los codigos k nombras y intentando hacerlo entrada por entrada el borde ya viene a 0 y despues a mi me sale con borde este es mi blog http://antonegro.blogspot.com/
y la plantilla k uso es "Chaotic Soul"
muchas gracias de antemano y felicitacione por tu trabajo k tanta ayuda presta a novatillos como yo 1 saludo
hola rosa te escribo para pedirte si sabes como cambiar de color el borde de la imagen en miniatura de los comentarios he estado intentando pero no hay caso, de antemano gracias
xCanibalxDebería ser aquí:
#comments .blogger-comment-icon, .blogger-comment-icon {
-moz-background-inline-policy:continuous;
background:none repeat scroll 0 0 #191919;
border-color:#191919;
border-style:solid;
border-width:2px 1px 1px;
line-height:16px;
padding:5px;
}
antonegro ¿Qué borde?... yo no veo ninguno.
Perdon Rosa kizas me e equivocado al realizar la pregunta m referia al recuadro blanco k enmarca alguna de las fotos k aparecen en las entradas
GRACIAS
antonegro Las únicas imágenes que veo con fondo blanco, son parte de la imagen... eso no puede quitarse con ningún código... o usas imágenes .png que llevan fondo transparente o editas esas... pero no puedes hacer nada con códigos...:o
muxas gracias Rosa perdona no sabia lo del formato png soy un poko novato y m e liado
hola rosa primero que nada muchas gracias por tu rápida respuesta, te lo agradezco mucho,
pero me temo que no funciona ya que yo había intentado con esa parte del código pero nada
no se que sera no he modificado ninguna parte de la plantilla como para que no funcione,
ya me rendí, bueno rosa suerte y saludos gracias de nuevo xaup
xCanibalx¿Has cambiado y puesto el mismo color en las dos líneas?:
background:none repeat scroll 0 0 #191919;
border-color:#191919;
Hola Rosa. Disculpe que la moleste pero mi blog comenzó a presentar un marco en las imágenes que tienen hipervínculo cosa que no hacia, sale en Firefox e IE pero no en Chrome, hasta la imagen que nos lleva inicio de la pagina le salió el marco y no se como hacer para eliminarlo, cuando intento algo desaparece el hipervínculo, si me pudiera ayudar se lo agradecería, ya que afecta bastante la estética del blog, Me conformaría por lo menos quitarle el de la imagen de la cabecera, sin mas agradeciendo su ayuda, Dr Pagé.
Dr. VictorColoca en el CSS algo como esto:
a img{ border-width:0;}
Amiga nada, eso lo había intentado, no se le quita, lo curioso es que antes no salía así, fue de un tiempo para acá. Este es el código que tiene.
.post img {
border: 1px solid #E3E4E4;
padding: 2px;
background: #ffffff;
Dr VictorEsos cambios extraños en los enlaces, se producen por usar Word en Blogger, los dos son incompatibles...
Te dije que colocases: a img{ border-width:0;} en el CSS, es decir antes de ]]></b:skin> tengas o no tengas ese código que me muestras que yo ya se tienes...
Si lo que te digo y aplicado tal como te digo no funciona, tendrás que editar las entradas donde has copiado de Word y deshacerte de todo el código que word incluye, es decir, editarlas en el editor de Blogger.
Hola Amiga muchas gracias funciono, lo que me dices de Word solo los comentarios es lo que escribo copio y pego, los post tendría que revisar, trato de pasarlo primero por Bloc de Notas, muy agradecido, Gracias
Rosa, estoy haciendo un blog www.sentimientoquemero.com.ar y queria saber como sacarle el borde a la imagen de la cabecera, ya que aparece con un borde blanco :/ como se lo puedo sacar ya que queda feo? Gracias.
Facu.Marin Editando la imagen... el borde lo tiene la propia imagen, no es nada en la plantilla.
hola. te cuento que tengo este problema del borde en las imágenes y no he podido solucionarlo porque no encuentro esa parte del código HTML que explicás en el post
antes usaba una de las plantillas predeterminadas de blogger y no tenía este problema, pero hace unos días cambié por una plantilla llamada "grunge era" y automáticamente le apareció un molesto borde blanco a todas las imágenes de mis posts
si me podés ayudar con este inconveniente te estaría eternamente agradecido
mi blog es: http://rockespacial.blogspot.com
saludos!
...ah, te dejo la parte del código HTML que creo se refiere a las imágenes de la plantilla que uso actualmente:
/* Images */
img{background:#FAFAFA;border:1px solid #DFBFBF;padding:8px;}
img.float-right{margin:5px 0 10px 10px;}
img.float-left{margin:5px 10px 10px 0;}
code{margin:3px 0;padding:20px;text-align:left;display:block;overflow:auto;font:500 1em/1.5em 'Lucida Console', 'Courier New', Monospace;/* white-space: pre; */border:1px solid #DDC3A5;background:#F0E5D3;}
acronym{cursor:help;border-bottom:1px dotted #895F30;}
blockquote{margin:12px 25px;padding:12px 15px 12px 55px;font-weight:400;font-size:17px;line-height:1.6em;font-style:italic;font-family:Georgia, 'Times New Roman', Times, Serif;color:#2C2E3E;border:1px solid #DDC3A5;background:#F0E5D3 url(http://4.bp.blogspot.com/_73i0fjAB_Hw/SUflzW0ljTI/AAAAAAAAAq8/Ii-y71-gy48/s1600/quote.gif) no-repeat 15px 15px;}
strong{font-weight:700;}
...disculpame por las molestias y muchas gracias desde ya. saludos!
mushroom En esta línea, cambia donde dice 1px por 0px
img{background:#FAFAFA;border:1px solid #DFBFBF;padding:8px;}
Rosa me quedo perfecto solo que te queria preguntar como hacerle para que en el post de las entradas apareca una imagen de fondo y al entrar al post aparesca otra imagen?
Flinx Para eso habría que usar las condicionales de Blogger y no es algo que pueda responderse en un comentario.
Mira aquí el uso de las condicionales:
http://vagabundia.blogspot.com/2010/04/blogger-y-el-uso-de-codigos.html
hola!! mi problema es (si me pueden ayudar) que en las ventanas popup me sale un borde izquierdo y superior blanco, y yo nolo quiero!! ja! como se puede eliminar?¿?¿ grax!!!
lucianogonzalez84@hotmail.com
Buenas a todos. Hace muy poco que empecé con estos de los blogs (proyecto literario ;) ) pero ya le estoy cogiendo el truco a esto del código html (llevo,,, dos semanas??? :p). Pero me desesperaba ese recuadro blanco que le salió a mi imagen de la entrada. Seguí sus pasos y no se me resolvía así que repasé el código y encontré que en mi blog pasaba por esta instrucción:
.post img, table.tr-caption-container {
border:1px solid #444444;
padding:1px;
}
Si alguien más ve que con lo dicho en el resto de los comentarios no le sale nada, que busque esto y cambie por 0 el valor del border, claro está. Un saludo
Jorge Garrido Tal como dices es ahora, en las nuevas plantillas del diseñador, así es.
Hola Rosa. He hecho mi primer post en el Blog, he revisado el codigo HTML de la imagen, con border="0", y sigue sin quitarme el borde, al igual que con cualquier imagen que pongo, y no se como quitarlo. Te dejo la direccion del blog que acabo de crear es http://urarchitecture.blogspot.com.
Aparte no se como alinear la fecha de arriba con los post de entrada.
Muchas gracias Rosa por este blog y todos los comentarios utiles que nos das.
Localiza esto:
.post-body .tr-caption-container img {
padding: 0;
background: transparent;
border: none;
-moz-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
-goog-ms-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
box-shadow: 0 0 0 rgba(0, 0, 0, .1);
}
Y déjalo así:
.post-body .tr-caption-container img {
padding: 0;
background: transparent;
border: none;
}
Hice lo que me has dicho pero sigue haciendome las entradas con la imagen con borde negro, como con sombra. ¿Se te ocurre algo mas que pueda hacer?
Gracias por adelantado. Un saludo Rosa.
Ya lo hice Rosa, y funciono, es que tenia que hacer lo que me dijistes en dos partes de la estructura de HTML. Gracias. Un saludo.
gracias gracias gracias
muchas gracias, con esto ahora las ecuaciones de mi blog ya no ocupan tanto espacio :)
Hola, disculpa, y si quiero quitarle el borde a una sola imagen de un post cuando hay varias? Lo que pasa es que si pongo en la plantilla el codigo
border: 0px double;
me quita el borde de todas las imagenes... y si lo dejo asi
border: 3px double;
y en la imagen del post donde no quiero borde pongo la propiedad border="0" me sigue apareciendo el borde... y no se como hacerle, tengo aproximadamente 2 imagenes por post... y quiero que el borde solo aparezca en una, se puede?
Saludos y agradeceria tu respuesta... te cuidas. la direccion del blog donde quiero hacer eso es http://distilled-brutality.blogspot.com/
VC- Corpsegrinder Puedes verlo aquí:
http://elescaparatederosa.blogspot.com/2007/06/imgenes-con-o-sin-borde-en-las-entradas.html
Hola Rosa; Felicidades por tu Blog es muy bueno. Sabes te queria hacer una consulta, resulta que en mi blog hay mucho espacio entre mis post, eh tratado de dar con el problemas pero no logro dar, talvez me puedas ayudar. Gracias.
me olvidaba, este es mi blog: http://rinopc.blogspot.com
RinoPC Reduce el valor del margin en .post-footer { y si es necesario el valor del padding-bottom en .post {
@Rosa
Balla, muehcas gracias, ya puedo solucionarlo y gracias a ti.
Además de reducir el margin en post-footer tambien reduci el margin en .post {
Una ves más muchas gracias.
hola rosa mira mi blog es este: http://bloodangel-83.blogspot.com/
me gustaria muchisimo quitar el borde de la imagen principal. si sabes como hacerlo dime porfabor.
ivan Cual es para ti la imagen principal?
es la unica imagen que tengo la que esta a la izquierda que se sale un poco del margen hacia la izquierda y no entra. me gustaria quitarle todos los bordes para que encage mejor y no se note que sale por un lado.
Gracias T_T toi desesperado por ello
http://bloodangel-83.blogspot.com/
ivan Eso no es un borde, es el fndo del gadget... reduce la imagen unos pixeles y no tendrás ese problema.
Hola Rosa!!!
Gracias, si me funciono...
Saludos,
Nati
Gracias!
¡Hola!
¿Podrás entrar a http://desgrabacionesatexto.blogspot.com/ y decirme si hay alguna forma de quitar ese marco que bordea todo el cuerpo central? No encuentro la forma de hacerlo...
¡Gracias!
Muy útil tu página. Saludos.
A TEXTO Bien, veo que ya usas otra plantilla sin el marco en Outer...
Publicar un comentario
Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).
Los comentarios están siendo moderados.
Comentar con el formulario antiguo