🌍
Français
Cette page vous donne les différences entre la révision choisie et la version actuelle de la page.
|
utiliser:utilisation:fonctionnalites:css [2013/07/04 09:30] 127.0.0.1 modification externe |
utiliser:utilisation:fonctionnalites:css [2013/12/30 00:42] (Version actuelle) tosca [Commentez vos modifications !] |
||
|---|---|---|---|
| Ligne 4: | Ligne 4: | ||
| ===== Introduction ===== | ===== Introduction ===== | ||
| - | Le langage CSS (//Cascading Style Sheets// ou feuille de style) est très utilise pour personnaliser sa galerie. Il permet de changer les couleurs mais aussi l'affichage de certains éléments. Très pratique aussi pour masquer des éléments. | + | Le langage CSS (//Cascading Style Sheets// ou feuille de style) est très utilisé pour personnaliser sa galerie. Il permet de changer les couleurs mais aussi l'affichage de certains éléments. Très pratique aussi pour masquer des éléments. |
| <WRAP info 45% center round>__//**Quelques sites pour apprendre le CSS**//__ | <WRAP info 45% center round>__//**Quelques sites pour apprendre le CSS**//__ | ||
| Ligne 39: | Ligne 39: | ||
| Sur la **Fig.01** je suis volontairement sur l'onglet HTML qui nous permet de visualiser le contenu de la page tel que le lit notre navigateur.\\ | Sur la **Fig.01** je suis volontairement sur l'onglet HTML qui nous permet de visualiser le contenu de la page tel que le lit notre navigateur.\\ | ||
| La fenêtre est donc séparée en 2 zones. | La fenêtre est donc séparée en 2 zones. | ||
| - | - La première zone (à gauche) permet de visualiser le code HTML de la page et de se balader en son sein.\\ <wrap info>__Info__ :</wrap> Vous remarquez qu'en sélectionnant tel ou tel ligne, vous mettez en surbrillance la zone de la page correspondante. Pratique non ?! | + | - La première zone (à gauche) permet de visualiser le code HTML de la page et de se balader en son sein.\\ <wrap info>__Info__ :</wrap> Vous remarquez qu'en sélectionnant telle ou telle ligne, vous mettez en surbrillance la zone de la page correspondante. Pratique non ?! |
| - | - La seconde zone (à droite) nous donne toutes les propriétés CSS qui s'applique à la ligne que l'on a sélectionné à gauche. Et c'est dans cette zone que l'on peut facilement effectuer des modifications de code CSS en direct et observer les effets instantanément. | + | - La seconde zone (à droite) nous donne toutes les propriétés CSS qui s'appliquent à la ligne que l'on a sélectionnée à gauche. Et c'est dans cette zone que l'on peut facilement effectuer des modifications de code CSS en direct et observer les effets instantanément. |
| Ligne 64: | Ligne 64: | ||
| Là vous avez une liste qui vous donne le choix entre un fichier ''local-rules.css'' et puis tout une liste correspondant aux thèmes de votre galerie. | Là vous avez une liste qui vous donne le choix entre un fichier ''local-rules.css'' et puis tout une liste correspondant aux thèmes de votre galerie. | ||
| - | Le fichier ''local-rules.css'' est un fichier qui sera lu à chaque fois par Piwigo, peut importe le thème affiché.\\ | + | Le fichier ''local-rules.css'' est un fichier qui sera lu à chaque fois par Piwigo, peu importe le thème affiché.\\ |
| - | En conséquent, ajouter votre code dans ce fichier va impacter tous les thèmes. C'est pratique pour certaines adaptations mais pas pour toutes... | + | En conséquent, ajouter votre code dans ce fichier va impacter tous les thèmes. C'est pratique pour certaines adaptations mais pas pour toutes ... |
| - | Les fichiers correspondant à vos thèmes quand à eux ne vont agir que si le thème en question est actif. Donc c'est très bien pour adapter un thème en particulier. | + | Les fichiers correspondant à vos thèmes quant à eux ne vont agir que si le thème en question est actif. Donc c'est très bien pour adapter un thème en particulier. |
| - | Ajouter simplement le contenu du code que vous avez et enregistrez. Les effets sont normalement immédiat.\\ | + | Ajoutez simplement le contenu du code que vous avez et enregistrez. Les effets sont normalement immédiats.\\ |
| Sinon, pensez à vider le cache de votre navigateur. | Sinon, pensez à vider le cache de votre navigateur. | ||
| === Dois-je réécrire tout le contenu d'un fichier ? === | === Dois-je réécrire tout le contenu d'un fichier ? === | ||
| Ligne 85: | Ligne 85: | ||
| === Commentez vos modifications ! === | === Commentez vos modifications ! === | ||
| - | Si vous ne modifiez que 3-4 éléments il est assez facile de savoir reconnaître le code et savoir ce qu'il impact.\\ | + | Si vous ne modifiez que 3-4 éléments il est assez facile de savoir reconnaître le code et savoir ce qu'il impacte.\\ |
| Mais si vous avez plusieurs lignes, il sera nécessaire de bien identifier vos modifications. | Mais si vous avez plusieurs lignes, il sera nécessaire de bien identifier vos modifications. | ||