InternetDev (avatar)

InternetDev

Analyste Programmeur

Abonné·e de Mediapart

524 Billets

0 Édition

Billet de blog 26 mai 2013

InternetDev (avatar)

InternetDev

Analyste Programmeur

Abonné·e de Mediapart

CSS3 - Developpent Internet - Graphisme léger

InternetDev (avatar)

InternetDev

Analyste Programmeur

Abonné·e de Mediapart

Ce blog est personnel, la rédaction n’est pas à l’origine de ses contenus.

Faites des arrières plans cannons avec des pages lègères, sans images à charger, grâce aux CSS version 3.

 Léa semples : css3 patterns Galerie exemple Capitonnage
exemple de CSS à mettre entre les balises <head></head>:
       <style type="text/css">
               body {   background:
                                 radial-gradient(hsl(0, 100%, 27%) 4%, hsl(0, 100%, 18%) 9%, hsla(0, 100%, 20%, 0) 9%) 0 0,
                                 radial-gradient(hsl(0, 100%, 27%) 4%, hsl(0, 100%, 18%) 8%, hsla(0, 100%, 20%, 0) 10%) 50px 50px,
                                 radial-gradient(hsla(0, 100%, 30%, 0.8) 20%, hsla(0, 100%, 20%, 0)) 50px 0,
                                 radial-gradient(hsla(0, 100%, 30%, 0.8) 20%, hsla(0, 100%, 20%, 0)) 0 50px,
                                 radial-gradient(hsla(0, 100%, 20%, 1) 35%, hsla(0, 100%, 20%, 0) 60%) 50px 0,
                                 radial-gradient(hsla(0, 100%, 20%, 1) 35%, hsla(0, 100%, 20%, 0) 60%) 100px 50px,
                                 radial-gradient(hsla(0, 100%, 15%, 0.7), hsla(0, 100%, 20%, 0)) 0 0,
                                 radial-gradient(hsla(0, 100%, 15%, 0.7), hsla(0, 100%, 20%, 0)) 50px 50px,
                                 linear-gradient(45deg, hsla(0, 100%, 20%, 0) 49%, hsla(0, 100%, 0%, 1) 50%, hsla(0, 100%, 20%, 0) 70%) 0 0,
                                 linear-gradient(-45deg, hsla(0, 100%, 20%, 0) 49%, hsla(0, 100%, 0%, 1) 50%, hsla(0, 100%, 20%, 0) 70%) 0 0;
                                 background-color: #300;
                                 background-size: 100px 100px;
               }
       
</style>

Ce blog est personnel, la rédaction n’est pas à l’origine de ses contenus.