URL: https://linuxfr.org/users/hubix/journaux/feuilles-de-style-linufr Title: Feuilles de style linufr Authors: André Rodier Date: 2009年07月03日T01:58:31+02:00 Tags: firefox Score: 23 Bonjour à tous, J'ai voulu créer une feuille de style pour le site linuxfr, basée sur kaïska, que j'utilise normalement. Cela me prends plus longtemps que prévu, mais même si c'est encore expérimental, les premiers résultats sont assez encourageants. Le but initial était d'obtenir quelque chose de maintenable et de modifiable facilement pour permettre à d'autres de créer d'autres thèmes. Pour cela, j'ai tout d'abord "éclaté" la grosse feuille de style en plusieurs, plus cohérentes, en utilisant @import. Ça facilite la lecture, et on voit facilement les erreurs HTML. Globalement, je n'ai pas obtenu de grosses difficultés, même si J'ai parfois du utiliser quelques techniques CSS pour pallier certaines incohérences du code HTML généré. Mais ces techniques ne fonctionne généralement qu'avec un navigateur moderne. (exit IE6) ( je n'ai testé au'avec Firefox 3.0 ) J'ai toutefois rencontré quelques limitations qui ne pourront être résolues que par des petits changement s côté serveur. Voici donc quelques remarques, par ordre d'importance, pour les mainteneurs du site linuxfr. La balise "p" est souvent utilisée pour créer des barres d'outils (e.g page d'accueil). J'ai essayé d'utiliser quelques techniques CSS qui fonctionnent par exemple sur la page d'accueil, mais qui forcément ne sont pas infaillibles, et ont des effets de bord sur d'autres pages (le pire étant les formulaires). Dans ces cas là, un simple 'class="toolbar" serait appréciable. Les balises br,hr, etc ne sont pas vraiment utiles. Pas plus que les crochets, chevrons, etc pour produire des effets de style. Les styles en lignes ne sont pas vraiment utiles, mais heureusement contournables. Pour résumer, merci de supprimer les "-" des listes, les ">" avant les liens, les "·" dans les formulaires, etc. Il y a CSS pour ça. Parfois, une balise div contient directement du texte, et là, pour arriver à séparer les éléments, c'est cauchemardesque. Dans ces cas là, c'est très difficile d'obtenir quelque chose de cohérent. Donc, si une balise "div" contient du texte, merci de le mettre dans une balise "p" ou "span" Un identifiant de classe dans la balise div.main serait utile pour appliquer des feuilles de style en fonction de la page: 'div class="main" id="polls", ou id="stats" ou id="forums", etc... Il y a par exemple des fois où j'ai voulu créer des feuilles de style pour certains tableaux, et je n'y suis pas arrivé. Cela me permettrait d'appliquer des styles différents aux tables ou listes, comme les listes sur la page "plan du site". J'ai fait quelques essais de coloriage des "threads" dans les commentaires. C'est vraiment expérimental, mais assez utile pour aller de thread en thread... Ici, une boucle dans les thread serait appréciable 'class="thread1", 'class="thread2", 'class="thread3", puis de nouveau 'class="thread1", 'class="thread2", etc... Je ne suis pas arrivé à supprimer le cadre rouge autour des nouveaux threads. ( Je suis fatigué ) J'ai essayé d'accorder moins d'importance aux scores des journaux, nouvelles, etc. Mais encore une fois, tout est facilement accessible, et l'on devrait pouvoir créer une feuille de style alternative sans grosses difficultés. Je n'ai pas eu le temps de personnaliser les formulaires. Pour info, la feuille de style est actuellement hébergée sur mon petit serveur perso, mais j'aimerais qu'elle soit hébergée sur Linuxfr ou un autre site plus professionnel, au moins le temps du développement. URL: [http://sagso.homeip.net/css/linuxfr.css](http://sagso.homeip.net/css/linuxfr.css) Une fois ces quelques petites améliorations corrigées, je pourrais simplifier certains sélecteurs CSS, et rendre les feuilles de styles plus simples, et universellement reconnues avec les autres navigateurs internet. Encore une fois, vu la complexité des feuilles de style, je ne pense pas que ce soit portable à d'autres navigateurs, mais cela permet au moins d'avoir un aperçu des possibilités offertes par CSS. Par habitude, les commentaires dans les feuilles de styles sont en anglais, mais c'est assez simple. Par manque de temps, je ne pense pas pouvoir maintenir ces feuilles de style très longtemps. PS: Désolé pour ce journal sans doute (trop) long...

AltStyle によって変換されたページ (->オリジナル) /