Mise en forme du code et format affiché - HTML/CSS - Programmation
Marsh Posté le 25-05-2005 à 11:26:43
<DIV class="codecode"><!--#include file="Sources/essai.asm" -->
</DIV>
<DIV class="codetitre">essai.asm
</DIV>
ca suffit largement à condition que ta classe codecode ressemble à ca :
.codecode
{
font-family: "Courier New", Courier, monospace;
white-space: pre;
}
tu forces la police, et l'affichage du code de type PRE, et comme ça, ca passe sous IE et firefox
Marsh Posté le 25-05-2005 à 11:30:31
Je pense qu'il faut qu'il laisse le <pre>, mais qu'il le remplace par <code> (pour une meilleure sémantique).
Sinon, moi je ferais comme ça :
<div class="listing"> |
A méditer toutefois pour le <h2>...
Marsh Posté le 25-05-2005 à 12:18:54
Merci pour vos réponses.
Je ne pense pas que celle de gatsusat puisse fonctionner, puisque la classe code (que je viens de renommer "listing" ) intègre un cadre.
Je ne comprends pas tout de celle proposée par FlorentG. Il faut savoir que quand le texte du listing est un include, ça peut changer le comportement (affichage du texte au kilomètre dans certains cas.
J'utilise déjà H2 (CSS .h2) à de nombreux endroits.
A priori, les 3 CSS (.listing, .codecode et .codetitre) m'intéressent, pour pouvoir ensuite régler tout en un seul point. Voici les 3 CSS:
.codetitre {background-color: #9C9C9C; |
Le min-width n'est pas reconnu par IE, mais celui-ci ne diminue plus la largeur du bloc quand quand elle atteint celle du texte. J'aimerais bien avoir ce comportement sous FF, une suggestion ?
Marsh Posté le 25-05-2005 à 12:37:09
Pierre Maurette a écrit : Je ne comprends pas tout de celle proposée par FlorentG. Il faut savoir que quand le texte du listing est un include, ça peut changer le comportement (affichage du texte au kilomètre dans certains cas. |
Qu'appelles tu de l'affichage "au kilomètre"?
Citation : J'utilise déjà H2 (CSS .h2) à de nombreux endroits. |
1- on accède pas à la CSS d'un <h2> par .h2
2- Et alors? h2 est un exemple, il existe 6 niveaux de titres, de h1 à h6,
Marsh Posté le 25-05-2005 à 13:40:18
Youpi !!!
(enfin, presque)
Merci encore à gatsusat et FlorentG, dont la seule erreur fut de me prendre pour moins ignorant que je ne suis. Là, j'ai compris en faisant quelques essais (pas faciles avec les includes, qui ne sont pas pris en compte en préview local, seulement en mode création de DW).
Le problème commençait avec le <PRE class"listing"> qui faisait que tous mes espaces et tabs de mise en page étaient pris en compte. Evident, sauf pour moi il y a une heure ... A noter que le PRE joue également sur l'include... Je dois être en PRE pour que l'include se passe bien.
L'autre problème, c'est que j'ignorais le white-space=pre;
J'en suis là:
<DIV class="listing"> |
avec white-space=pre; dans .codecode, mais je suis encore obligé de modifier à la main après un codesweeper qui me donne ça:
<DIV class="listing"> |
Marsh Posté le 25-05-2005 à 19:15:21
Trop de div Fait comme ça :
<div class="listing"> |
-> Déjà les balises s'écrivent en minuscule. Ensuite il faut toujours utiliser les éléments pour leur sémantique : Pour du code, y'a la balise code, pas besoin d'inventer une div class="code". Et pour les titre, y'a les h1....h6, pas besoin non plus d'inventer un div class="titre".
Marsh Posté le 25-05-2005 à 20:06:49
FlorentG a écrit : Trop de div Fait comme ça :
|
et puis ensuite tu peux attaquer les styles comme ceci :
.listing CODE { //tu attaques que la balise code à l'intérieure de listing
}
.listing H2 { //idem, ici H2 ne sera touché que lorsqu'il sera dans listing
}
Marsh Posté le 25-05-2005 à 20:28:45
Salut again,
J'ai trouvé un codesweeper qui respecte mon truc, j'en arrive à:
<DIV class="listing"> |
Je veux garder la possibilité de définir plusieurs .codecode (qui devrait se nommer .listingcode). A mon niveau actuel je ne voir pas de nécessité impérative d'utiliser <code> et <h2>.
La possibilité de redéfinir un style uniquement à l'intérieur d'un autre est élégante, pour l'instant inutile. Je verrai si je m'attaque à de la coloration syntaxique (des exports de PSPad peut-être ?) Mais il faut que ce soit copie/collable ...
Marsh Posté le 25-05-2005 à 20:31:20
Pierre Maurette a écrit : |
C'est l'HTML qui te l'impose Il faut toujours utiliser la balise prévue à cette effet. Ainsi, avec une simple div, les utilisateurs dépourvus de CSS verront un beau bordel. C'est pour ça qu'il faut utiliser <code>. Sinon autant utiliser div pour tout et n'importe quoi.
L'HTML est un langage permettant de définir la sémantique de ton contenu. Ainsi, grâce à la balise <code>, tu précise bien que ce petit bloc de texte est du <code>. C'est comme ça et on discute pas Donc fait les modifs, sinon tu sera taxé de développeur extrêmement mauvais n'y connaissant rien au but de l'HTML
Marsh Posté le 25-05-2005 à 20:47:53
Pierre Maurette a écrit : A mon niveau actuel je ne voir pas de nécessité impérative d'utiliser <code> et <h2>. |
Qui parle de niveau ? Ca ne te paraît pas plus explicite que des <DIV class="codetruc"> et <DIV class="h2"> ?
Marsh Posté le 25-05-2005 à 21:41:58
Citation : Qui parle de niveau ? Ca ne te paraît pas plus explicite que des <DIV class="codetruc"> et <DIV class="h2"> ? |
J'ai remplacé .codecode par une redéfinition de <code> dans .listing. Mais pour h2, c'est la merde. Peut-être à cause du cadre de .listing qui entoure le tout :
http://assembleur.maurette.free.fr [...] mplate.htm
<DIV class="listing"> |
Marsh Posté le 25-05-2005 à 21:53:31
Pierre Maurette a écrit :
|
Ils sont super crades tes CSS
Et accessoirement, c'est quoi ton problème avec les h2?
Marsh Posté le 25-05-2005 à 22:55:48
Bon, en fait, le HTML, c'est comme tous les langages informatique. Quand on ne sais pas, on ne pose pas de questions, ce qui me semble quand même paradoxal.
On vous répond des trucs aussi constructifs que "Ils sont super crades tes CSS ", écrit par quelqu'un qui lui sait, bien qu'ignorant ce qu'est la frappe de texte "au kilomètre".
Je ne dois pourtant pas être le seul pour HTML et autres Javascripts, CSS, etc. est un moyen plus qu'un but, et qui cherchent à l'utiliser le moins salement (cradement) possible. Je vous signale que ma question initiale sollicitait modestement un avis sur le style d'un code qui faisait ce qui était souhaité.
Je vous remercie pour votre aide, sincèrement pour certains (j'ai bien appris en quelques heures), ironiquement pour d'autre.
Pierre Maurette
Marsh Posté le 25-05-2005 à 22:59:24
Pierre Maurette a écrit : Bon, en fait, le HTML, c'est comme tous les langages informatique. Quand on ne sais pas, on ne pose pas de questions, ce qui me semble quand même paradoxal. |
En attendant, t'as pas répondu à la question
Marsh Posté le 25-05-2005 à 23:03:14
"En attendant, t'as pas répondu à la question "
Vous non plus...
Marsh Posté le 25-05-2005 à 23:07:07
Pierre Maurette a écrit : "En attendant, t'as pas répondu à la question " |
masklinn a écrit : Ils sont super crades tes CSS |
Un point d'interrogation
Pierre Maurette a écrit : Bon, en fait, le HTML, c'est comme tous les langages informatique. Quand on ne sais pas, on ne pose pas de questions, ce qui me semble quand même paradoxal. |
Pas de point d'interrogation
Marsh Posté le 25-05-2005 à 23:12:03
Pierre Maurette a écrit : [quote]Mais pour h2, c'est la merde. Peut-être à cause du cadre de .listing qui entoure le tout : |
h2 a des marges non nulles par défaut, il faut donc les annuler...
Marsh Posté le 25-05-2005 à 23:13:33
The-Shadow a écrit : C'est quoi la question après toutes ses réponses ? |
La question était "qu'est-ce qui merde avec les h2", puisqu'il semble avoir un problème de ce côté là, histoire d'être sûr que son problème avec les H2 est ce à quoi je pense
Marsh Posté le 25-05-2005 à 11:16:49
Bonjour,
J'ai trouvé en tatonnant un format d'affichage des listings qui me convient à peu près. Le seul défaut est que je n'ai pas réussi à l'intégrer complètement dans Dreamweaver, je veux dire que je dois intervenir sur le code (copier/collr/mofifier), mais je crois que c'est inévitable.
Le problème est que le rendu affiché est modifié quand je reformate mon code avec un codesweeper. Le résultat est là:
http://assembleur.maurette.free.fr [...] /copie.htm
Le premier est le code mis en forme par le codesweeper:
le second le code re-corrigé pour le résultat souhaité:
le troisième c'est sans les tabulations (ce sont des tabulations qu'utilise le codesweeper):
La question: y a-t-il quelque chose à faire pour ne pas avoir à corriger à la main après chaque remise en forme ? Question subsidiaire: est-ce que ça veut dire que mon code est mal conçu ?
(j'utilise à l'essai Dreamweaver MX avec Homesite, mais je ne vais pas le garder)
Merci d'avance
Pierre Maurette