|
|
|
Bienvenue sur le Wiki d'Univers-PC !
Afin de vous familiariser avec le wiki je vous invite à lire les Tutoriaux du wiki. Rapporter une mise à jour de logiciel CSSDe Wiki-PC.Le language CSS est un langage qui sert de présentation à un site web. C'est le parfait complément de l'XHTML. CSS signifie Cascading Style Sheets (feuilles de style en cascade). Pour l'introduire dans une page web, vous pouvez soit l'ajouter avec un fichier .css séparé qu'on indique avec la balise link, soit à l'aide de la balise style La première solution est largement conseillé, au moins on peut changer le design du site d'un coup et les fichiers .css sont stockés dans le cache du navigateur donc la rapidité d'affichage du site est amélioré.
<link rel="stylesheet" media="screen" type="text/css" title="style_general" href="style.css" /> <link rel="stylesheet" href="style.css" /> Attributs class et id : Pour attribuer un style à n'importe quelle balise. Attribut span : Pour ajouter un style a un endroit précis qui ne comporte aucune balise. Attribut div : Pour ajouter un style à un gros bloc englobant toutes sortes de balises blocks ou Inlines.
/* Ceci est un commentaire */
Couleurscolor : la couleur du texte
Fond | Imagebackground-color : la couleur de fond. background-image : afficher une image en arrière plan. background-attachment : Figer une image de fond. background-repeat : gérer la répétition d'une image background-position : positionner une image en arrière plan. background : Regrouper les propriétés "background".
Policesfont-family : le choix des polices de caractères. font-size : la taille du texte. font-weight : mettre le texte en gras. font-style : mettre le texte en italique. font-variant : mettre le texte en petite majuscules. font : Regrouper les propriétés des polices "font"
Textetext-decoration : Décorer le texte. text-transform : mettre le texte en capitales. text-align : aligner horizontalement un bloc de texte. vertical-align : aligner verticalement du texte dans une cellule de tableau. text-indent : créer un alinéa. letter-spacing : Changer la taille des espacements des lettres. line-height : changer la hauteur d'une ligne. text-shadow : ajouter un ombrage de texte. word-spacing : Changer la taille des espacements des mots. white-space : Gérer les retours à la ligne.
pseudo-formatslink : Permet d'indiquer l'apparence d'un lien qui n'a pas été visité. visited : Permet d'indiquer l'apparence d'un lien qui a été visité. hover : Permet d'indiquer l'apparence d'un lien lors du survol de la souris. active : Permet d'indiquer l'apparence d'un lien lors du clic de la souris. focus : Permet d'indiquer l'apparence d'un lien lors du clic de la souris. (comme :active en plus longtemps) first-letter : Permet d'indiquer l'apparence de la première lettre. first-line : Permet d'indiquer l'apparence de la première ligne. after : Permet d'ajouter du texte après n'importe quelle balise. before : Permet d'ajouter du texte avant n'importe quelle balise. lang :
BorduresLa propriété border-width : Pour créer une bordure et donner une épaisseur à la bordure. La propriété border-color : Pour créer une bordure et donner une couleur à la bordure. La propriété border-style : Pour créer une bordure et donner un style à la bordure. La propriété border : Regrouper les propriétés "border".
MargesLa propriété margin : Ajouter une bordure extérieure. La propriété padding : Ajouter une bordure intérieure.
TaillesLa propriété width : Donner une largeur à un élément. La propriété height : Donner une hauteur à un élément.
positionnementLa propriété display : Permet de "transformer l'affichage" d'une balise. Permet aussi de masquer du texte. La propriété float : La propriété float permet de faire "flotter" un bloc ou une image. La propriété clear : Pour effacer l'effet d'un flottant. La propriété position : Positionner un élement. La propriété z-index : Superposer des éléments. listesLa propriété list-style-type : Permet de donner un style à la puce. La propriété list-style-image : Permet de mettre une image comme puce. La propriété list-style-position : Permet d'avancer la tabulation de la puce. La propriété list-style : Regrouper les propriétés "list-style". tableauLa propriété border-collapse : Permet de coller les cellules du tableau. La propriété border-spacing : La propriété border-spacing permet de changer l'espacement des cellules. La propriété caption-side : La propriété caption-side permet de changer la position de caption. La propriété empty-cells : La propriété empty-cells permet de masquer les cellules vides. La propriété table-layout : Permet de définir la largeur des cellules du tableau à 50% de la taille totale. effetsLa propriété direction : Permet de déplacer un bloc sur la droite. La propriété overflow : Pour avoir la barre de défilement avec la propriété height. La propriété visibility : Permet de masquer du texte. La propriété opacity : Permet de donner une transparence à un bloc. interface utilisateurLa propriété cursor : Permet de changer l'apparence du curseur. |
