oujood.com

Contrôler la décoration d'un élément avec : Propriété css box-decoration-break

La propriété box-decoration-break est utilisée pour contrôler la décoration de la boîte après la subdivision du paragraphe. Elle définit l'arrière-plan, le padding, la bordure, la marge et le clip-path d'un élément qui est appliqué lorsque la zone de l'élément est divisée en plusieurs parties.

chercher |

Définition et utilisation da la propriété css box-decoration-break

La propriété box-decoration-break spécifie la façon dont l'arrière-plan, le padding, la bordure, l'image de la bordure, le box-shadow, la marge et le clip-path d'un élément sont appliqués lorsque la boîte de l'élément est fragmentée.

La Syntaxe CSS
box-decoration-break: slice|clone|initial|inherit|unset;
Valeurs par défaut slice
Inherited: non
Animable : non En savoir plus sur l'animable
Version: CSS3

Prise en charge de la propriété css dans les navigateurs

Les numéros figurant dans le tableau indiquent la première version du navigateur qui prend totalement en charge la propriété.

Les numéros suivis de -webkit-, -moz-, ou -o- indiquent la première version qui fonctionne avec un préfixe.

ExplorateurGoogle ChromeInternet ExplorerFirefoxSafariOpera
Verssion22 -webkit-79326.1 -webkit-11.5 -webkit-

Valeurs de la propriété css box-decoration-break

slice : Par défaut. Les décorations de boîtes sont appliquées à l'élément dans son ensemble et se brisent sur les bords des fragments de l'élément.
clone : Les décorations de boîtes s'appliquent à chaque fragment de l'élément comme si les fragments étaient des éléments individuels. Les bordures enveloppent les quatre bords de chaque fragment de l'élément et les arrière-plans sont redessinés dans leur intégralité pour chaque fragment.
initial : Définit cette propriété à sa valeur par défaut.
inherit : Hérite de cette propriété de son élément parent.

Exemple       Copier le code

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Css propriété box-decoration-break </title>
        <style>
            body {
               text-align:center;
               width:80%;
            }
            span {
                border: 2px solid #003668;
                padding: 5px;
                border-radius: 6px;
                font-size: 24px;
                line-height: 3;
            }
            span.oujood{
                -webkit-box-decoration-break: slice;
                -o-box-decoration-break: slice;
                box-decoration-break: slice;               
            }
            .ojd {
                font-size: 40px;
                color: #003668;
                font-weight: bold;
            }
        </style>
    </head>
    <body>
        <div class = "ojd">oujood.com pour apprendre </div>
        <div class = "oujood">
        Un portail informatique pour apprendre 
        </div>
        <h2>box-decoration-break: slice;</h2>
        <span class="oujood">
            Vel fringilla est ullamcorper eget. Mollis nunc sed id semper. Lobortis elementum nibh tellus molestie nunc non blandit massa enim. Egestas diam in arcu cursus euismod quis viverra nibh cras. Fames ac turpis egestas sed tempus urna et pharetra pharetra. Ultrices vitae auctor eu augue ut lectus arcu bibendum at. Enim neque volutpat ac tincidunt vitae semper quis lectus. Nullam non nisi est sit amet facilisis. Ullamcorper a lacus vestibulum sed arcu. Integer quis auctor elit sed vulputate mi sit amet. Suspendisse faucibus interdum posuere lorem ipsum dolor. Sit amet est placerat in egestas. Ut ornare lectus sit amet. Tortor aliquam nulla facilisi cras fermentum odio. Augue mauris augue neque gravida in fermentum et sollicitudin ac. Facilisis sed odio morbi quis commodo odio. Enim sit amet venenatis urna cursus eget nunc. Nisi vitae suscipit tellus mauris a diam maecenas sed enim. Pulvinar elementum integer enim neque. Quis ipsum suspendisse ultrices gravida dictum fusce ut placerat orci.
        </span>
    </body>
</html>

La méthode secrète likes sans fin sur Facebook

Livre numérique court pour comprendre la méthode secrète permettant d'obtenir des likes sans fin sur Facebook.

GAGNER DE L'ARGENT
GRÂCE À FACEBOOK 
N'A JAMAIS ÉTÉ SI FACILE


Consulter


1tpe
Votre soutien nous aide à faire fonctionner le site
Cette page vous a été utile? Partagez la pour nous encourager à continuer. Merci




Hébergeur Discount - Hébergement web