Placer des espaces et des images dans Strict HTML

  • lzr
  • Novice
  • Novice
  • No Avatar
  • Inscription: Mai 09, 2008
  • Messages: 28
  • Status: Offline

Message Septembre 10th, 2009, 9:43 am

Salut,
Quand je lance le validateur du W3C [sur ma page d'origine conçu pour HTML transtional] pour stricte HTML, il s'est plaint sur les balises BR et images placées dans le corps html.
Les deux, BR et images ont été acceptées lors qu'ils se trouvaient dans une sorte de boîte (comme un tableau).

Mes questions sont, à respecter le balisage HTML strict:
1. Comment pouvons-nous mettre des espaces entre les objets (par exemple, entre les tables) si BR dans le corps n'est pas OK?
2. Comment peut-on insérer des images à droite dans la page en dehors d'une boîte?
Merci,
LZR
  • Anonymous
  • Bot
  • No Avatar
  • Inscription: 25 Feb 2008
  • Messages: ?
  • Loc: Ozzuland
  • Status: Online

Message Septembre 10th, 2009, 9:43 am

  • digitalMedia
  • a.k.a. dM
  • Genius
  • Avatar de l’utilisateur
  • Inscription: Déc 29, 2003
  • Messages: 5169
  • Loc: SC-USA
  • Status: Offline

Message Septembre 10th, 2009, 10:03 am

La manière d'objets spatiaux, de toutes sortes, est d'utiliser la marge et / ou les propriétés padding dans le CSS.

Pour l'insertion d'images, vous pouvez toujours faire la méthode directe, <img>, ou vous pouvez mettre en place des conteneurs et appliquer les images sur un fond, de nouveau en CSS.

Êtes-vous familier avec CSS?
- dM
  • ATNO/TW
  • Super Moderator
  • Super Moderator
  • Avatar de l’utilisateur
  • Inscription: Mai 28, 2003
  • Messages: 23404
  • Loc: Woodbridge VA
  • Status: Offline

Message Septembre 10th, 2009, 10:07 am

Outre les suggestions dms <br> et <img> stricte ne peut pas être un enfant de blockquote, corps, forme, NoScript. Ils doivent être dans des éléments de bloc. <p> et <div> serait approprié conteneurs.

Une référence rapide
http://www.zvon.org/xxl/xhtmlReference/ ... rison.html
"There's no place like 127.0.0.1 except for ::1."
Alexandria Networks. Leader in IT consulting for associations/non-profits, and small to medium sized businesses around the northern Virginia and Washington D.C. metro area.
  • lzr
  • Novice
  • Novice
  • No Avatar
  • Inscription: Mai 09, 2008
  • Messages: 28
  • Status: Offline

Message Septembre 10th, 2009, 10:30 am

digitalMedia a écrit:
La manière d'objets spatiaux, de toutes sortes, est d'utiliser la marge et / ou les propriétés padding dans le CSS.


Merci tout des réponses rapides. J'ai une très bonne connaissance de base avec css.
Avec une recherche google rapide, je trouve "margin-bottom". Est-ce que tu as voulu dire peut être utilisée en CSS pour l'espacement vertical entre les objets? Et si c'est juste un texte dans le corps du HTML? Ai-je besoin de le mettre dans un conteneur à mettre en œuvre un BR?
Merci,
LZR
  • digitalMedia
  • a.k.a. dM
  • Genius
  • Avatar de l’utilisateur
  • Inscription: Déc 29, 2003
  • Messages: 5169
  • Loc: SC-USA
  • Status: Offline

Message Septembre 10th, 2009, 10:43 am

lzr a écrit:
Merci tout des réponses rapides. J'ai une très bonne connaissance de base avec css.
Avec une recherche google rapide, je trouve "margin-bottom". Est-ce que tu as voulu dire peut être utilisée en CSS pour l'espacement vertical entre les objets? Et si c'est juste un texte dans le corps du HTML? Ai-je besoin de le mettre dans un conteneur à mettre en œuvre un BR?


Si je vous comprends bien, la réponse est oui.

Pour bien écrire du code HTML, votre texte doit être analysé dans des conteneurs individuels en fonction de leur type. Voici un exemple...
Code: [ Select ]
<h1>This is Heading 1</h1>
<h2>This is Heading 2</h2>
<p>This is a paragraph. Each paragraph should be seperated in its own P container.</p>
  1. <h1>This is Heading 1</h1>
  2. <h2>This is Heading 2</h2>
  3. <p>This is a paragraph. Each paragraph should be seperated in its own P container.</p>


La façon dont vous souhaitez contrôler l'espacement entre les paragraphes, titres, listes, etc consiste à appliquer des marges sur tous les conteneurs P, comme tant...
Code: [ Select ]
p{margin:10px;}


Cela donnerait à chaque instance d'un <p> (paragraphe) un espacement uniforme dans tout le document.

Vous pouvez utiliser un <br /> intérieur de la balise <p>, comme un contenant approprié - se référant à ce qui ATNO justement dit. Toutefois, il ne devrait pas être utilisé pour créer des espaces entre les paragraphes.

Heres un autre exemple. Disons que j'ai un paragraphe...
Code: [ Select ]
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada sem quam, vitae lacinia enim. Donec porttitor placerat purus, ac sodales purus vulputate eget. Cras mollis pharetra rutrum. Vestibulum cursus molestie metus eu pharetra. Duis pharetra rhoncus rhoncus. Fusce pulvinar lobortis est dictum blandit. Curabitur euismod pretium ullamcorper. Integer vel purus urna. Vivamus pulvinar euismod elit eu consectetur. Maecenas ut adipiscing metus. Maecenas eu arcu at ipsum sollicitudin venenatis. Pellentesque tempor laoreet orci in posuere. Maecenas ut massa sit amet velit commodo vestibulum. Duis felis nunc, malesuada vel facilisis ut, pretium sit amet ipsum. Nullam molestie pretium leo, in luctus nibh lacinia quis. Integer sit amet nulla nisl, vitae feugiat turpis. Sed sit amet magna justo. Phasellus mollis adipiscing mi quis pellentesque. Quisque at orci vel neque egestas suscipit sit amet at tellus. </p>


...et je voulais ajouter une image en médaillon. Je ne pouvais accomplir ce avec un balisage et CSS, comme tant...

Code: [ Select ]
<p> <img src="some.jpg" style="float:left;margin:5px;" alt="Alternative Text" /> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada sem quam, vitae lacinia enim. Donec porttitor placerat purus, ac sodales purus vulputate eget. Cras mollis pharetra rutrum. Vestibulum cursus molestie metus eu pharetra. Duis pharetra rhoncus rhoncus. Fusce pulvinar lobortis est dictum blandit. Curabitur euismod pretium ullamcorper. Integer vel purus urna. Vivamus pulvinar euismod elit eu consectetur. Maecenas ut adipiscing metus. Maecenas eu arcu at ipsum sollicitudin venenatis. Pellentesque tempor laoreet orci in posuere. Maecenas ut massa sit amet velit commodo vestibulum. Duis felis nunc, malesuada vel facilisis ut, pretium sit amet ipsum. Nullam molestie pretium leo, in luctus nibh lacinia quis. Integer sit amet nulla nisl, vitae feugiat turpis. Sed sit amet magna justo. Phasellus mollis adipiscing mi quis pellentesque. Quisque at orci vel neque egestas suscipit sit amet at tellus. </p>


Cela risque de provoquer le texte à entourer l'image, mais aussi laisser de l'espace négatif aussi.
- dM

Afficher de l'information

  • Total des messages de ce sujet: 5 messages
  • Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 108 invités
  • Vous ne pouvez pas poster de nouveaux sujets
  • Vous ne pouvez pas répondre aux sujets
  • Vous ne pouvez pas éditer vos messages
  • Vous ne pouvez pas supprimer vos messages
  • Vous ne pouvez pas joindre des fichiers
 
 

© 2011 Unmelted, LLC. Ozzu® est une marque déposée de Unmelted, LLC