Re: [Ovillo] Caja de esquinas redondeadas y transparentes
Hola Yo he usado recientemente "Chunky Borders and corners with no images" [1] de cssplay. He toquiteado un poco para quitar el fondo y así que se viera el fondo de la web, aunque he dejado los bordes de otro color, supongo que también se podrá hacer para dejar los bordes transparentes. En [1] usa bordes de 3 pixel, en [2] usa bordes de 1 pixel. [1] http://www.cssplay.co.uk/boxes/chunky.html [2] http://www.cssplay.co.uk/boxes/snazzy.html No me gusta que para crear los bordes use etiquetas . Yo las he sustituido por , que no tienen sentido semántico. Aunque no sé ni siquiera si es correcto usar span para este tipo de efectos ... Espero que te haya servido de algo ... >Buenos días, > >Intento implementar una técnicas de esquinas redondeadas basada en >CSS que >esté documentada y sea accesible [1], etc. ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Caja de esquinas redondeadas y transparentes
En CSSBlog existe una guía sobre los bordes redondeados: www.cssblog.es
Un saludo.
Enviado desde mi iPhone
El 11/02/2009, a las 11:43, Chr5 escribió:
> Buenos días,
>
> Intento implementar una técnicas de esquinas redondeadas basada en C
> SS que
> esté documentada y sea accesible [1], etc.
>
> ¿ Alguien tiene una idea clara de como implementarlo, de modo que las
> esquinas de esta caja sean transparentes y dejen ver el fondo (un
> degradado)
> de la web en cuestión ?
>
> Lo he intentando con el siguiente código pero usando esquinas png con
> transparencias, no consigo el efecto, ya que la transparencia
> muestra el
> elemento anterior, de color sólido. Agredezco cualquier orientación
> al
> respecto,
>
> tengo este html:
>
>
>
>Caja de pruebas
>
>
>
>Esto es una caja que usa la tecnicas de sliding
> doors de
> Bowman
>
>
>
> con este css:
>
> .boxpruebas {
> float: left;
> margin: 0 auto;
>width: 30em;
>background:#fff url(../img/tmp/backblue.png) no-repeat bottom
> right;
> }
>
> .box_externa {
>background: url(../img/tmp/red.png) no-repeat top right;
>margin: 0; padding: 0;
>border-bottom: 1px solid green;
> }
>
> .box_interna {
>background: url(../img/tmp/red.png) no-repeat 0 100%;
>margin: 0;
>padding: 1px 0;
> }
>
> .boxpruebas h2 {
>margin: 0; padding: 0;
>background: url(../img/tmp/verde.png) no-repeat 0 0;
> }
>
> .boxpruebas h2, .boxpruebas p {
>padding: 1em;
> }
>
> les agradezco de antemano la ayuda,
> chr5
>
> [1] http://www.vertexwerks.com/tests/sidebox/
> ___
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente dirección
> : http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Caja de esquinas redondeadas y transparentes
Hola, yo uso NiftyCorners: Usa css+JS. Cualquier usuario con JS deshabilitado lo verá todo cuadrado, sin redondeados, pero no deja de ser accesible por ello. ver docs y ejemplos en: http://www.html.it/articoli/niftycube/index.html saludos El 11 de febrero de 2009 11:43, Chr5 escribió: > Buenos días, > > Intento implementar una técnicas de esquinas redondeadas basada en CSS que > esté documentada y sea accesible [1], etc. > > -- ___ Sebas[tián] García-Valenciano Secaduras sebast...@garcia-valenciano.net ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
[Ovillo] Caja de esquinas redondeadas y transparentes
Buenos días,
Intento implementar una técnicas de esquinas redondeadas basada en CSS que
esté documentada y sea accesible [1], etc.
¿ Alguien tiene una idea clara de como implementarlo, de modo que las
esquinas de esta caja sean transparentes y dejen ver el fondo (un degradado)
de la web en cuestión ?
Lo he intentando con el siguiente código pero usando esquinas png con
transparencias, no consigo el efecto, ya que la transparencia muestra el
elemento anterior, de color sólido. Agredezco cualquier orientación al
respecto,
tengo este html:
Caja de pruebas
Esto es una caja que usa la tecnicas de sliding doors de
Bowman
con este css:
.boxpruebas {
float: left;
margin: 0 auto;
width: 30em;
background:#fff url(../img/tmp/backblue.png) no-repeat bottom right;
}
.box_externa {
background: url(../img/tmp/red.png) no-repeat top right;
margin: 0; padding: 0;
border-bottom: 1px solid green;
}
.box_interna {
background: url(../img/tmp/red.png) no-repeat 0 100%;
margin: 0;
padding: 1px 0;
}
.boxpruebas h2 {
margin: 0; padding: 0;
background: url(../img/tmp/verde.png) no-repeat 0 0;
}
.boxpruebas h2, .boxpruebas p {
padding: 1em;
}
les agradezco de antemano la ayuda,
chr5
[1] http://www.vertexwerks.com/tests/sidebox/
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
