230
Maîtrise des CSS
Fonctionnalités CSS 2 et CSS 3 avancées
Ce.n’est.qu’à.la.sortie.d’Internet.Explorer 7.en.octobre.2006.que.les.instructions.présentées.
à. cette. section. sont. devenues. à. la. fois. rationnelles. et. techniquement. réalisables.. Internet.
Explorer 7.offrait.enfin.accès.aux.nombreuses.fonctionnalités.excitantes.des.spécifications.
CSS 2.et.CSS 3.que.prenaient.déjà.en.charge.Firefox,.Safari.et.quelques.autres.navigateurs..
Parmi.les.plus.importantes,.on.peut.citer.min-width.et.max-width,.le.sélecteur.d’attribut,.
le.sélecteur.de.frère.adjacent,.le.sélecteur.d’enfants.et.la.transparence.alpha.dans.les.images.
PNG.
Ces.fonctionnalités.bien.prises.en.charge.combinées.avec.d’autres.fonctionnalités.un.peu.
moins.bien.prises.en.charge.permettaient.de.réaliser.des.choses.véritablement.fascinantes..
La.barre.de.navigation.Apple.recréée.par.John.Allsopp.en.CSS.uniquement.et.sans.image.
en. était. un. exemple. (voir. http://westciv.com/style_master/blog/apples-navigation-barusing-only-css)..Cette.section.propose.quelques.autres.exemples,.tout.aussi.intéressants.
Les. fonctionnalités. CSS 2. et. CSS 3. avancées. suivantes. sont. utilisées. dans. le. site. Roma.
Italia :
•. sélecteur.adjacent ;
•. sélecteur.d’attribut ;
•. box-shadow ;
•. opacity ;
•. RGBa ;
•. content ;
•. multicolonnage ;
•. text-overflow ;
•. arrière-plans.multiples ;
•. @font-face ;
•. min-/max-width,.min-/max-height ;
•. transparence.alpha.dans.les.images.PNG..
Dans.cette.étude.de.cas,.je.traiterai.des.fonctionnalités.suivantes :.les.sélecteurs.d’attributs,.
box-shadow,.RGBa,.text-overflow,.les.colonnes.multiples,.les.arrière-plans.multiples.et.@
font-face..Pour.les.fonctionnalités.qui.ne.sont.pas.abordées,.je.me.suis.efforcé.d’insérer.
des.commentaires.dans.le.code.afin.de.vous.aider.à.les.découvrir.par.vous-même..Vous.pourrez.aussi.disposer.de.l’antisèche.CSS.suivante,.pour.la.consulter.à.l’écran.ou.l’imprimer :.
http://cameronmoll.com/articles/widget/cheatsheet.pdf.
Les sites doivent-ils être identiques dans tous les navigateurs ?
C’est.la.question.que.pose,.en.entier.et.dans.son.nom.de.domaine,.le.site.http://dowebsitesneedtolookexactlythesameineverybrowser.com….Tapez.son.nom.dans.la.barre.d’adresse.
et.voyez.la.réponse..Ce.site.très.simple,.développé.par.Dan.Cederholm,.a.circulé.sur.le.Web.
Maîtrise des CSS
Fonctionnalités CSS 2 et CSS 3 avancées
Ce.n’est.qu’à.la.sortie.d’Internet.Explorer 7.en.octobre.2006.que.les.instructions.présentées.
à. cette. section. sont. devenues. à. la. fois. rationnelles. et. techniquement. réalisables.. Internet.
Explorer 7.offrait.enfin.accès.aux.nombreuses.fonctionnalités.excitantes.des.spécifications.
CSS 2.et.CSS 3.que.prenaient.déjà.en.charge.Firefox,.Safari.et.quelques.autres.navigateurs..
Parmi.les.plus.importantes,.on.peut.citer.min-width.et.max-width,.le.sélecteur.d’attribut,.
le.sélecteur.de.frère.adjacent,.le.sélecteur.d’enfants.et.la.transparence.alpha.dans.les.images.
PNG.
Ces.fonctionnalités.bien.prises.en.charge.combinées.avec.d’autres.fonctionnalités.un.peu.
moins.bien.prises.en.charge.permettaient.de.réaliser.des.choses.véritablement.fascinantes..
La.barre.de.navigation.Apple.recréée.par.John.Allsopp.en.CSS.uniquement.et.sans.image.
en. était. un. exemple. (voir. http://westciv.com/style_master/blog/apples-navigation-barusing-only-css)..Cette.section.propose.quelques.autres.exemples,.tout.aussi.intéressants.
Les. fonctionnalités. CSS 2. et. CSS 3. avancées. suivantes. sont. utilisées. dans. le. site. Roma.
Italia :
•. sélecteur.adjacent ;
•. sélecteur.d’attribut ;
•. box-shadow ;
•. opacity ;
•. RGBa ;
•. content ;
•. multicolonnage ;
•. text-overflow ;
•. arrière-plans.multiples ;
•. @font-face ;
•. min-/max-width,.min-/max-height ;
•. transparence.alpha.dans.les.images.PNG..
Dans.cette.étude.de.cas,.je.traiterai.des.fonctionnalités.suivantes :.les.sélecteurs.d’attributs,.
box-shadow,.RGBa,.text-overflow,.les.colonnes.multiples,.les.arrière-plans.multiples.et.@
font-face..Pour.les.fonctionnalités.qui.ne.sont.pas.abordées,.je.me.suis.efforcé.d’insérer.
des.commentaires.dans.le.code.afin.de.vous.aider.à.les.découvrir.par.vous-même..Vous.pourrez.aussi.disposer.de.l’antisèche.CSS.suivante,.pour.la.consulter.à.l’écran.ou.l’imprimer :.
http://cameronmoll.com/articles/widget/cheatsheet.pdf.
Les sites doivent-ils être identiques dans tous les navigateurs ?
C’est.la.question.que.pose,.en.entier.et.dans.son.nom.de.domaine,.le.site.http://dowebsitesneedtolookexactlythesameineverybrowser.com….Tapez.son.nom.dans.la.barre.d’adresse.
et.voyez.la.réponse..Ce.site.très.simple,.développé.par.Dan.Cederholm,.a.circulé.sur.le.Web.