Overblog Suivre ce blog
Editer l'article Administration Créer mon blog
27 novembre 2010 6 27 /11 /novembre /2010 05:40

Le régal du bricoleur de CSS. Très formateur ! Je vous recommande le module "Calendrier", héhé…

[1] Infos générales - Haut et bas de page

[2] La cellule des articles

[3] Articles et quasi-articles

[4] Annexes des articles

[5] Modules

[5.1] Modules : Infos générales - Modules simples

  1. Structure d'une colonne de modules
  2. Structure commune à tous les modules
  3. Modules simples

[5.2] Modules en liste - début

  1. Module Articles Récents
  2. Module Derniers Commentaires
  3. Module Catégories
  4. Module Archives
  5. Module Pages
  6. Module Liens

[5.3] Modules en liste - fin

  1. Module Présentation
  2. Module Profil
  3. Module Communautés
  4. Module Syndication
  5. Module Images Aléatoires
  6. Module Albums

[5.4] Modules complexes

  1. Module Recherche
  2. Module Newsletter
  3. Module Calendrier

[6] Diablogs

Module Recherche box recherche

divbox-content
Contenu du module
form
Formulaire
div
Emballage
input
Champ de saisie (caché)
input
Champ de texte [type=text] : texte à chercher
inputbutton
Bouton d'envoi [type=submit] Texte réglable dans l'admin

Module Newsletter box newsletter

divbox-content
Contenu du module
pas de balise
texte "Inscription à la newsletter"
formnewsletter_form_XXXXcleansize
Formulaire. XXXX=n° d'ordre de je ne sais quoi
fieldset
Groupe de champs
legend
invisible à l'écran
perror
Message en cas d'erreur pendant l'inscription (normalement masqué)
inputnewsletter_email_XXXXcheckMail notNull
Zone de saisie de l'adresse
fieldsetextends
Groupe de champs (apparaît lors de la saisie d'une adresse)
legend
invisible à l'écran
ul
Liste d'emballage des options
li
Emballage d'une option
label
Emballage d'une case à cocher
inputalert
Case à cocher
pas de balise
texte "Notifications de publication d'articles"
li
Emballage d'une option
label
Emballage d'une case à cocher
inputnewsletter
Case à cocher
pas de balise
texte "Newsletters du blog"
li
Emballage du bouton d'envoi
spanbutton
Emballage
spanfirst-child
Emballage
input
Bouton d'envoi [type=submit] Texte "OK" (non réglable)
Schéma mis à jour en avril 2012.

Pour finir, le plus monstrueux de la bande :

Module Calendrier box calendrier

divbox-content
Contenu du module
tablecalendarTable1
Une bonne vieille table
tbody
Le corps de la table
tr
Le mois affiché (détails)
tr
Les jours de la semaine (détails)
tr
Sept jours, du lundi au dimanche (détails)
tr
Ainsi de suite, jusqu'à la fin du mois
tr
Navigation (détails)

Module Calendrier - le mois

tr
1ère ligne de la table
tdcalendarTop1
Une seule cellule
a
Le mois affiché, lien vers la page d'archive correspondante.

Module Calendrier - les jours de la semaine

tr
2e ligne de la table
tdcalendarHeader1
Une cellule
b
L (lundi)
tdcalendarHeader1
Ainsi de suite : M, M, J, V, S, D

Module Calendrier - les jours du mois

tr
3e ligne de la table et suivantes, sauf la dernière
tdcalendarDays1
tdcalendarToday1
Une cellule. calendarDays1/calendarToday1 : date quelconque/du jour
a
pas de balise
lien vers l'archive d'un jour OU
jour sans article OU espace
tdcalendarDays1
tdcalendarToday1
Ainsi de suite pour six cellules
  • Le td de classe calendarToday1 contient évidemment la date du jour ou, pour les pages d'archive, celle de l'archive. On ne la trouve donc qu'une fois au plus dans le calendrier. Ce td ne porte pas la classe calendarDays1 .
  • Quand le 1er du mois n'est pas un lundi la première tranche de sept jours commence par des td vides, mais toujours de classe calendarDays1 .
  • Quand le dernier jour du mois n'est pas un dimanche la dernière tranche de sept jours finit par des td vides, mais toujours de classe calendarDays1 .
  • Il arrive que la dernière ligne de jours se compose uniquement de td vides. Pas approfondi la question, je pense qu'il s'agit d'afficher un minimum de cinq semaines (exemple : mois de février).

Module Calendrier - bandeau de navigation

tr
Dernière ligne de la table
tdcalendarDays1
Une seule cellule
table
Sous-table
tbody
Corps de la sous-table
tr
Une seule ligne
tdcalendarDays1
Bouton <<
a
pas de balise
lien vers une page OU
texte "<<"
tdcalendarDays1
Bouton <
tdcalendarDays1
Bouton >
tdcalendarDays1
Bouton >>
  • Il s'agit bien d'une table à l'intérieur d'une table !
  • Sa ligne unique contient toujours quatre cellules exactement.
  • Chaque cellule contient toujours du texte, qu'il soit simple ou inclus dans un lien.

Oublis, erreurs : merci de me les signaler en commentaire :-)

par Aïe mes doigts ! - dans Briques
commenter cet article

commentaires

Archives