Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1560 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Mise en forme du code et format affiché

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Mise en forme du code et format affiché

n°1096202
Pierre Mau​rette
Posté le 25-05-2005 à 11:16:49  profilanswer
 

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:

Code :
  1. <PRE class="code">
  2. <DIV class="codecode"> <!--#include file="Sources/essai.asm" -->
  3. </DIV>
  4. <DIV class="codetitre"> essai.asm
  5. </DIV></PRE>


 
le second le code re-corrigé pour le résultat souhaité:

Code :
  1. <PRE class="code"><DIV class="codecode"><!--#include file="Sources/essai.asm" --></DIV><DIV class="codetitre">essai.asm</DIV></PRE>


 
le troisième c'est sans les tabulations (ce sont des tabulations qu'utilise le codesweeper):

Code :
  1. <PRE class="code">
  2. <DIV class="codecode"><!--#include file="Sources/essai.asm" -->
  3. </DIV>
  4. <DIV class="codetitre">essai.asm
  5. </DIV></PRE>


 
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

mood
Publicité
Posté le 25-05-2005 à 11:16:49  profilanswer
 

n°1096246
gatsusat
Posté le 25-05-2005 à 11:26:43  profilanswer
 

<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

n°1096268
FlorentG
Unité de Masse
Posté le 25-05-2005 à 11:30:31  profilanswer
 

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">
  <code>
global asm_fmods
asm_fmods:
  fld qword [esp + 12]
  fld qword [esp + 4]
  fprem
  ffree ST1
  ret  
ends
  </code>
  <h2>essai.asm</h2>
</div>


A méditer toutefois pour le <h2>...

n°1096413
Pierre Mau​rette
Posté le 25-05-2005 à 12:18:54  profilanswer
 

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;
            border-top: 1px solid Black;
            color: White;
            font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
            font-size: 1.2em; font-style: italic;
            font-weight: bold;
            font-weight: normal;
            padding: 1px 1px 3px 5px; }
 
.codecode {font-size: 1.0em;
           padding: 5px; }
 
.listing  {background-color: #EAEAEA;  
           border: Black;  
           border-style: solid;
           border-width: 1px;
           margin-left: 5px;  
           margin-right: 5px;  
           min-width: 800px; }


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 ?

n°1096437
masklinn
í dag viðrar vel til loftárása
Posté le 25-05-2005 à 12:37:09  profilanswer
 

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,


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1096512
Pierre Mau​rette
Posté le 25-05-2005 à 13:40:18  profilanswer
 

Youpi !!!  :bounce:  :bounce:  :bounce:  :bounce:  
(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">
  <DIV class="codecode"><!--#include file="Sources/essai.asm" --></DIV>
  <DIV class="codetitre"> essai.asm
  </DIV>
 </DIV>


 
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">
  <DIV class="codecode"> <!--#include file="Sources/essai.asm" -->
  </DIV>
  <DIV class="codetitre"> essai.asm
  </DIV>
 </DIV>


 
 

n°1097138
FlorentG
Unité de Masse
Posté le 25-05-2005 à 19:15:21  profilanswer
 

Trop de div :o Fait comme ça :

<div class="listing">
  <code> <!--#include file="Sources/essai.asm" -->
  </code>
  <h2> essai.asm </h2>
 </div>


-> 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".


Message édité par FlorentG le 25-05-2005 à 19:15:38
n°1097209
gatsusat
Posté le 25-05-2005 à 20:06:49  profilanswer
 

FlorentG a écrit :

Trop de div :o Fait comme ça :

<div class="listing">
  <code> <!--#include file="Sources/essai.asm" -->
  </code>
  <h2> essai.asm </h2>
 </div>


-> 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".


 
 
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
 
}

n°1097234
Pierre Mau​rette
Posté le 25-05-2005 à 20:28:45  profilanswer
 

Salut again,
J'ai trouvé un codesweeper qui respecte mon truc, j'en arrive à:

<DIV class="listing">
<DIV class="codecode"><!--#include file="../gestion_projets/sources/essai.asm" --></DIV>
<DIV class="codetitre">TITRE</DIV></DIV>


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 ...

n°1097242
FlorentG
Unité de Masse
Posté le 25-05-2005 à 20:31:20  profilanswer
 

Pierre Maurette a écrit :


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>.


C'est l'HTML qui te l'impose :o 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 [:spamafote] Donc fait les modifs, sinon tu sera taxé de développeur extrêmement mauvais n'y connaissant rien au but de l'HTML :D

mood
Publicité
Posté le 25-05-2005 à 20:31:20  profilanswer
 

n°1097267
gm_superst​ar
Appelez-moi Super
Posté le 25-05-2005 à 20:47:53  profilanswer
 

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"> ?


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°1097297
Pierre Mau​rette
Posté le 25-05-2005 à 21:41:58  profilanswer
 

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">
<CODE><!--#include virtual="../gestion_projets/sources/essai.asm" --></CODE>
<DIV class="codetitre">TITRE</DIV></DIV>
<P>&nbsp;</P>
<DIV class="listing">
<CODE><!--#include virtual="../gestion_projets/sources/essai.asm" --></CODE>
<h2>TITRE</h2></DIV>

n°1097312
masklinn
í dag viðrar vel til loftárása
Posté le 25-05-2005 à 21:53:31  profilanswer
 

Pierre Maurette a écrit :

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">
<CODE><!--#include virtual="../gestion_projets/sources/essai.asm" --></CODE>
<DIV class="codetitre">TITRE</DIV></DIV>
<P>&nbsp;</P>
<DIV class="listing">
<CODE><!--#include virtual="../gestion_projets/sources/essai.asm" --></CODE>
<h2>TITRE</h2></DIV>



Ils sont super crades tes CSS [:mlc]  
 
Et accessoirement, c'est quoi ton problème avec les h2?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1097403
Pierre Mau​rette
Posté le 25-05-2005 à 22:55:48  profilanswer
 

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 [:mlc]", é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
 

n°1097409
masklinn
í dag viðrar vel til loftárása
Posté le 25-05-2005 à 22:59:24  profilanswer
 

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.
On vous répond des trucs aussi constructifs que "Ils sont super crades tes CSS [:mlc]", é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


En attendant, t'as pas répondu à la question :heink:


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1097416
Pierre Mau​rette
Posté le 25-05-2005 à 23:03:14  profilanswer
 

"En attendant, t'as pas répondu à la question :heink:"
Vous non plus...

n°1097422
masklinn
í dag viðrar vel til loftárása
Posté le 25-05-2005 à 23:07:07  profilanswer
 

Pierre Maurette a écrit :

"En attendant, t'as pas répondu à la question :heink:"
Vous non plus...


masklinn a écrit :

Ils sont super crades tes CSS [:mlc]  
 
Et accessoirement, c'est quoi ton problème avec les h2?


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.
On vous répond des trucs aussi constructifs que "Ils sont super crades tes CSS [:mlc]", é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


Pas de point d'interrogation
 
[:dawa]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1097425
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 25-05-2005 à 23:08:47  profilanswer
 

C'est quoi la question après toutes ses réponses ?

n°1097427
gm_superst​ar
Appelez-moi Super
Posté le 25-05-2005 à 23:12:03  profilanswer
 

Pierre Maurette a écrit :

[quote]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


h2 a des marges non nulles par défaut, il faut donc les annuler...


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°1097429
masklinn
í dag viðrar vel til loftárása
Posté le 25-05-2005 à 23:13:33  profilanswer
 

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 [:spamafote]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1097432
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 25-05-2005 à 23:16:33  profilanswer
 

:heink:

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Mise en forme du code et format affiché

 

Sujets relatifs
Question : pro*C / htmlprocédure pour importer un ascx depuis le code behind
[RESOLU][Javascript] Mise en page compliquée :)mise en page dans liste déroulante
Affiche l'architecture d'un XHTMLCode html pour créer un scroll
Javascript: pb dans mon codeMise a jour de la vue dans un JTextArea
que pensez vous de ce code svpenregistrer au format PDF avec FPDF
Plus de sujets relatifs à : Mise en forme du code et format affiché


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR