Unidad 10. CSS. Unidades. Color. Margen. Fondo. Borde (XIV)



10.13. background-clip

La propiedad background-clip determina el área sobre la que se coloca la imagen de fondo. Como habíamos dicho, por defecto, el fondo llega hasta el border, sin sobrepasarlo, pero podemos cambiar este comportamiento con nuevas opciones. Esta propiedad puede tomas estos tres valores:

1- border-box. El fondo llega hasta el borde exterior del border, pero no lo sobrepasa. El border será visible si tiene anchura mayor de cero, el border se sitúa siempre por encima del fondo. Hemos dibujado un borde punteado para que se vea que el fondo llega hasta el límite exterior del border. Es la opción por defecto.

Párrafo uno. Lorem ipsum dolor sit amet, consectetur adipisicing elit. eligendi porro ius soluta in voluptates voluptatem, nesciunt dolorem obcaecati nemo eligendi porro iusto, earum debitis. Lorem ipsum dolor sit amet, consectetur adipisicing elit. eligendi porro ius soluta in voluptates voluptatem, nesciunt dolorem obcaecati nemo eligendi porro iusto, earum debitis.

2- padding-box. El fondo llega hasta el interior del border, no cubre el border, pero sí cubre el padding

Párrafo uno. Lorem ipsum dolor sit amet, consectetur adipisicing elit. eligendi porro ius soluta in voluptates voluptatem, nesciunt dolorem obcaecati nemo eligendi porro iusto, earum debitis. Lorem ipsum dolor sit amet, consectetur adipisicing elit. eligendi porro ius soluta in voluptates voluptatem, nesciunt dolorem obcaecati nemo eligendi porro iusto, earum debitis.

3- content-box. El fondo cubre sólo el área de contenido. Es decir llega el inicio del padding, sin cubrirlo.

Párrafo uno. Lorem ipsum dolor sit amet, consectetur adipisicing elit. eligendi porro ius soluta in voluptates voluptatem, nesciunt dolorem obcaecati nemo eligendi porro iusto, earum debitis. Lorem ipsum dolor sit amet, consectetur adipisicing elit. eligendi porro ius soluta in voluptates voluptatem, nesciunt dolorem obcaecati nemo eligendi porro iusto, earum debitis.

 


Enero-2019 (V 2.0)
Pág. 10.14
Atrás Inicio Adelante






Página inicial  Cursos Informática Gratuitos

Síguenos en:   Facebook ,    G+            Sobre aulaClic            Política de Cookies


© aulaClic S.L. Todos los derechos reservados. Prohibida la reproducción por cualquier medio.