Jeanluc Posté 1 Septembre 2005 Partager Posté 1 Septembre 2005 Bonjour, J'ai presque honte de poser une question qui me semble si basique. J'essaie de définir une taille de police (font-size) pour une page entière en l'associant à la balise "body", mais ça ne marche pas. Le "font-family" que je place à côté marche sans problème. Où est l'astuce ? Exemple : <html><head></head><body style="font-size: 36px;font-family: Arial;"> <table><tr><td> Pourquoi si petit ? </td></tr></table></body></html> Le texte apparaît bien en "Arial", mais pas dans la taille demandée. Dois-je conclure que "font-size" n'est pas héritable ? Y a-t-il une astuce ? Jean-Luc Lien vers le commentaire Partager sur d’autres sites More sharing options...
Commmint Posté 1 Septembre 2005 Partager Posté 1 Septembre 2005 (modifié) Salut, Tu devrais séparer ton HTML des styles, la lisibilité sera plus facile et l'application garantie à ta balise body : <html><head><style type="text/css">body{font-size: 36px;font-family: Arial;}</style></head><body><table><tr><td>Pourquoi si petit ?</td></tr></table></body></html> MACHINE ARRIERE TOUTE tu as raison le contenu de TD n'hérite pas de BODY par contre : <style type="text/css"><!--table { font-size: 40px;}--></style> fonctionne Modifié 1 Septembre 2005 par Commmint Lien vers le commentaire Partager sur d’autres sites More sharing options...
Jeanluc Posté 1 Septembre 2005 Auteur Partager Posté 1 Septembre 2005 Comme tu le dis, le contenu de TD n'hérite pas de BODY et c'est pareil avec mes 3 browsers. J'ai constaté aussi que, si j'associe "font-size" à TABLE, les TD juste en-dessous en héritent, mais ceux qui sont à l'intérieur d'une TABLE imbriquée n'en héritent pas. Quelqu'un pourrait-il expliquer les particularités de "font-size" et, si possible, un moyen de contourner le problème, sans répéter des "font-size" un peu partout ? Jean-Luc Lien vers le commentaire Partager sur d’autres sites More sharing options...
Xavier Posté 1 Septembre 2005 Partager Posté 1 Septembre 2005 Comme tu le dis, le contenu de TD n'hérite pas de BODY <{POST_SNAPBACK}> sauf si... Ça vous dit un peu d'histoire ? Eh oui, pour comprendre ça, il faut se projetter en arrière dans le temps, à l'époque de Netscape 4 et des tout début des CSS. Netscape 4 gérait très mal (voire même pas du tout) l'héritage des propriétés CSS. Ainsi, les auteurs ont fait ce que tu as fait, mettre en grand le body, et pas de soucis, ce n'était pas hérité, le contenu tableau restait petit. Sauf que le jour où un autre navigateur arrive et supporte correctement l'héritage... il affiche plein de tableaux en grand, donc personne n'en veut. Donc aucun navigateur ne l'a fait ! Aucun ? Attendez, l'histoire n'est pas finie, d'ailleurs elle commence seulement à être intéressante Les browsers modernes supportent très bien l'héritage. Même pour les tableaux. Mais alors... pourquoi c'est petit ici ? La réponse est tout simplement : parce qu'il n'y a pas de doctype. Si votre page n'a pas de doctype, les browsers font du doctype switching. Ils considèrent que si la page n'a pas de doctype, c'est une grosse ****** datant de l'époque de Netscape 4, époque à laquelle les auteurs faisaient n'importe quoi n'importe comment, du moment que ça marchait. Ils adoptent alors une kyrielle (le mot est faible !) de comportements censés émuler les navigateurs de cette époque et leur mauvais respect des standards. Ces comportements "étranges" appelés "Quirks" : Modèle de boites microsoft Mauvaise gestion de l'héritage Support de javascripts bourrés d'erreurs Globalement beaucoup plus d'erreurs sont permises au niveau des CSS, des imbrications, etc. Et des milliers et des milliers pour ne pas dire des millions d'autres comportements totalement imprévisibles et non ou mal documentés, présents uniquement pour des raisons de rétrocompatibilité avec les anciennes pages (voir par exemple une liste non exhaustive pour Mozilla, je pense que d'autres navigateurs ont des listes de ce genre, qui doivent d'ailleurs être assez proches.) Conclusion : ne développez qu'en mode de respect des standards, vous vous épargnerez des comportements totalement incompréhensibles de ce style. D'ailleurs il suffit de mettre un doctype a la page pour que l'héritage soit parfaitement géré (sauf bien sur par les navigateurs datant de cette époque, Netscape 4 et IE-pré-6 (= 5.5 et mois) ) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Dorénavant, vous ne développerez plus que des pages avec doctype. C'est beaucoup plus sûr ! PS : attention, évidemment il y a une complication supplémentaire : tous les doctypes ne font pas passer les navigateurs en mode standards Voir http://hsivonen.iki.fi/doctype/ pour plus de détails Lien vers le commentaire Partager sur d’autres sites More sharing options...
Jeanluc Posté 1 Septembre 2005 Auteur Partager Posté 1 Septembre 2005 Mille mercis pour ta réponse, Xavier. Sur ma page originale, j'avais <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> mais ce n'était pas suffisant pour Firefox (ça marchait avec Opera et Internet Explorer). Avec la solution que tu as donnée, c'est impec partout. Heureusement que tu étais là. Jean-Luc Lien vers le commentaire Partager sur d’autres sites More sharing options...
Xavier Posté 1 Septembre 2005 Partager Posté 1 Septembre 2005 Le doctype à utiliser pour faire du HTML 4.01 transitionnal est <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Avec l'URL donc, sinon il est considéré comme faisant partie de cette époque révolue. D'ailleurs c'est étonnant que ça fonctionnait avec IE et Opera... c'est contradictoire avec la ligne HTML 4.01 Transitional doctype without a URL de la page http://hsivonen.iki.fi/doctype/ ... Lien vers le commentaire Partager sur d’autres sites More sharing options...
kozaki Posté 5 Décembre 2008 Partager Posté 5 Décembre 2008 Pffff !! Quelle explication remarquable ! J'en avais jamais lu d'aussi claire et limpide sur le "doctype switching" que celle de Xavier... ps : vous pouvez maintenant me lyncher si vous pensez qu'on ne doit jamais répondre à un post vieux de 3 ans Lien vers le commentaire Partager sur d’autres sites More sharing options...
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant