CSS3 Exemple

CSS3 est l’évolution de CSS2, avec beaucoup de nouveautés, arrondir vos images dans CSS, faire des ombres sur les div, des ombres sur du texte, des polices de caractères plus fun, des colonnes, des bordures d’images, Media Query, etc…

Nous allons voir quelques exemples assez surprenant de réalisation faites avec CSS3.

• Effet d’ombre sur un texte:

• Une horloge:

•  Tab Menu:

• Slick Menu:

•  Mettre un objet en mouvement:

8.7.13 - 0

Nouveauté CSS3

Beaucoup des nouveautés sont ajoutées pour CSS3. Nous allons essayer de mettre en valeur certaine nouveauté CSS3 sur cette page:

Bordures

• border-image
• border-radius
• box-shadow

Backgrounds

• background-origin 
• background-clip
• background-size
• multiple backgrounds : L'affichage de plusieurs images en arrière-plan

Couleur

• HSL colors: Ainsi que l'utilisation hexadécimal et couleurs RGB, CSS3 pourrait également voir l'introduction du TSL (Teinte, Saturation, Luminosité) valeurs.
• HSLA colors
• opacity
• RGBA colors

Effet du texte

• text-shadow
• text-overflow
• word-wrap

Interface utilisateur

• box-sizing
• resize
• outline
• nav-top, nav-right, nav-bottom, nav-left

Sélecteurs

• attribut selectors

Modèle de la boîte de base

• overflow-x
• overflow-y

Autres

• CSS3 Transitions
• media queries
• multi-column layout
• Web fonts
• speech

6.7.13 - 1