SELFHTML

Propriétés des objets

Page d'information: vue d'ensemble

vers le bas Aligner un objet par rapport au texte qui l'entoure
vers le bas Faire passer le texte à côté de l'objet
vers le bas Afficher un texte d'avertissement pendant le chargement
vers le bas N'afficher l'instance d'un objet qu'à la demande de l'utilisateur
vers le bas Formater des objets avec les feuilles de style en cascade CSS

 vers le bas 

HTML 4.0XHTML 1.0MSIE 5.0Netscape 6.0 Aligner un objet par rapport au texte qui l'entoure

Étant donné que l'élément object est un Autre page d'information élément incorporé, les objets peuvent être placés au beau milieu d'un texte. Si l'objet est plus haut que la hauteur de la ligne, alors le texte de cette ligne doit être aligné verticalement par rapport à l'objet. En l'absence de toute mention, le texte est aligné en bas de l'objet. Vous pouvez pourtant fixer vous même à l'aide d'un attribut comment le texte doit être aligné par rapport à l'objet. Cer attribut est toutefois classé en cours d'abandon et doit à l'avenir disparaître du standard HTML. Le même effet peut à vrai dire être obtenu également grâce aux vers le bas feuilles de style CSS.

Les mentions ne sont pourtant significatives que si l'affichage se fait à l'aide d'un plugiciel et qu'il est possible directement dans la fenêtre d'affichage du navigateur Web.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<h1>C'EST ICI&nbsp;&nbsp;<object data="haste.mid" type="audio/x-midi" width="200" height="100" align="middle">
Votre navigateur ne peut malheureusement pas afficher l'objet !
</object>&nbsp;&nbsp;QUE L'ON JOUE</h1>

</body>
</html>

Explication:

Avec l'attribut align= vous pouvez aligner le texte environnant verticalement par rapport à l'objet (align = aligner).

Avec align="top" le texte est aligné en haut de l'objet incorporé (top = haut).
Avec align="middle" le texte est aligné au milieu de l'objet incorporé (middle = milieu).
Avec align="bottom" le texte est aligné an bas de l'objet incorporé (bottom = bas).

Attention:

Pour aligner proprement les objets et les textes les uns par rapport aux autres, vous pouvez également travailler avec des Chapitre: vue d'ensemble tableaux sans quadrillage.

Netscape interprète encore d'autres affectations de valeurs qui ne font toutefois pas partie du standard HTML et génèrent du code HTML non valide:

Avec align="texttop" vous alignez l'inscription en haut du graphique, à savoir au bord supérieur du plus petit texte qui suit (texttop = en haut avec le texte).
Avec align="absmiddle" vous alignez l'inscription dans le milieu absolu du graphique, même avec des tailles de texte différentes (absmiddle = absolute middle = au milieu dans tous les cas). .
Avec align="absbottom" vous alignez l'inscription en bas du graphique à savoir au bord inférieur du plus petit texte de la ligne(absbottom = absolute bottom = en bas dans tous les cas). .
Avec align="baseline" vous alignez l'inscription exactement comme avec la mention standard align="bottom". C'est pourquoi il vaut mieux que vous utilisiez la mention standard.

 vers le hautvers le bas 

HTML 4.0XHTML 1.0MSIE 5.0Netscape 6.0 Faire passer le texte à côté de l'objet

Les objets référencés peuvent être alignés à gauche ou à droite. Le texte entoure alors l'objet. Avec deux autres attributs, vous pouvez créer de l'espace par rapport au contexte pour que le texte ne "colle" pas à l'objet. Vous pouvez également interrompre le flux de texte automatique pour forcer sa poursuite sous l'objet. Tous les attributs nécessaires pour le faire sont toutefois classés en cours d'abandon et doivent disparaître à l'avenir du standard HTML. Le même effet peut à vrai dire être obtenu avec les vers le bas feuilles de style CSS.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body bgcolor="#333333" text="#FFFFFF">

<h1>
<object classid="CLSID:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0"
 width="200" height="200" align="left" hspace="10" vspace="7">
 <param name="movie" VALUE="neucler.swf">
</object>
Animation !
</h1>
<p>elle peut �tre belle si vous elle ne d�range pas.
Ceci est un petit film Flash d'� peine un kilooctet.
<br clear="all"></p>
<h2>F�licitations !</h2>
<p>Le texte se poursuit dessous.</p>

</body>
</html>

Explication:

Avec les mentions align="left" ou align="right" vous faites en sorte que le navigateur aligne l'objet à gauche ou à droite et affiche le texte qui suit à droite ou à gauche à côté de l'objet pour l'entourer (align = alignement, left = gauche, right = droite). Le contexte peut contenir divers éléments, par exemple également des titres ou des listes.

Pour créer un espace entre l'objet et le texte qui l'entoure vous disposez des attributs hspace= et vspace=.
Avec hspace= [pixels] vous déterminez l'espace entre un objet et d'autres éléments à sa gauche ou à sa droite (hspace = horizontal space = espace horizontal ).
Avec vspace= [pixels] vous déterminez l'espace entre un objet et d'autres éléments au dessus ou en dessous (vspace = vertical space = espace vertical ).
L'attribut hspace= concerne toujours l'espace du bord gauche et du bord droit de l'objet, la mention vspace= toujours l'espace du bord supérieur et inférieur . Si par exemple vous définissez hspace= pour un objet aligné à gauche , un espace ne sera pas seulement créé entre le bord droit de l'objet et le texte qui le côtoie mais aussi entre le bord gauche de l'objet et le bord de la fenêtre d'affichage. Pour l'éviter, vous pouvez travailler de façon plus précise en utilisant les vers le bas feuilles de style CSS.
Vous pouvez noter les deux attributs ou seulement l'un d'entre eux.

Pour interrompre le flux de texte automatique et forcer ce qui suit à être affiché sous l'objet, vous pouvez noter un Autre page d'information passage à la ligne (retour du chariot) avec l'attribut clear=.
Avec <br clear="all"> vous obtenez que le flux du texte s'interrompe dès la ligne suivante de façon à ce qu'il se poursuive sous l'objet.
Avec <br clear="left"> vous obtenez que le flux de texte passe dès la ligne suivante sous un objet aligné à gauche pour y être poursuivi.
Avec <br clear="right"> vous obtenez que le flux de texte passe dès la ligne suivante sous un objet aligné à droite pour y être poursuivi.

 vers le hautvers le bas 

HTML 4.0XHTML 1.0 Afficher un texte d'avertissement pendant le chargement

Les objets multimédia ou les programmes exécutables comme les applets Java peuvent occasionner en partie des temps de chargement plus longs. Même quand les fichiers eux mêmes ne sont pas plus grands que la moyenne des fichiers HTML ou graphiques, les plugiciels ou interpréteurs de durée doivent être activés chez l'utilisateur. Cela demande du temps.

Pour ne pas laisser l'utilisateur dans l'incertitude sur les temps d'attente et les processus de chargement, vous pouvez mentionner un texte d'annonce qui sera affiché chez l'utilisateur jusqu'au chargement complet de l'objet incorporé.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<h1>B�tissez un pont !</h1>

<p><object classid="java:Bridges.class" codetype="application/java-vm" width="350"
 height="420"
standby="Le jeu est en cours de chargement. Veuillez patienter s'il vous pla�t...">
<param name="Color" value="white">
</object></p>

<p>Cliquez sur les carreaux blancs. Essayez de b�tir un pont rouge entre le haut et le bas
 du jeu. Les bleus essaient de vous en emp�cher.</p>

</body>
</html>

Explication:

Dans le repère d'ouverture <object> vous pouvez avec la mention standby= mentionner un texte d'annonce pour le processus de chargement.

 vers le hautvers le bas 

HTML 4.0XHTML 1.0 N'afficher l'instance d'un objet qu'à la demande de l'utilisateur

Vous pouvez définir un objet qui n'est d'abord que déclaré. Pour qu'il soit affiché ou exécuté, il doit être activé. Cela peut se faire au moyen d'un lien à l'objet déclaré , ou par un autre objet qui déclenche l'initialisation.
Les navigateurs qui ne connaissent pas cette option (parmi lesquels également Netscape et l'Explorer Internet MS) lancent la diffusion tout de suite.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<h1>Tu veux ou tu veux pas?</h1>

<p><object declare id="Marquee" classid="java:zticker.class" codetype="application/java" width="600" height="60">
<param name="msg" value="Tu sais ce que tu veux!">
<param name="href" value="../../../index.htm">
<param name="speed" value="5">
<param name="bgco" value="255,255,0">
<param name="txtco" value="255,000,000">
<param name="hrefco" value="255,255,255">
</object></p>

<p><a href="#Marquee">Afficher le texte anim�</a></p>

</body>
</html>

Explication:

Dans le repère d'ouverture <object> vous pouvez en mentionnant l'attribut autonome declare définir un objet comme étant déclaré (declare = déclarer, mentionner).

Avec l'Chapitre: vue d'ensemble attribut universel id= vous pouvez définir une ancre cible dans l'objet, dans l'exemple: "Marquee" (id = identifier = identificateur). Le nom ne doit pas être trop long et ne peut contenir d'espace, de caractère spécial ou de signes avec accent. Le premier signe doit être une lettre, ensuite les chiffres sont également permis. N'utilisez comme caractère spéciaux dans le nom tout au plus le tiret de soulignement (_), le trait d'union (-), les deux points (:) ou le point (.). les majuscules et les minuscules sont différenciées.

Avec le lien à l'ancre cible (voir l'exemple ci-dessus) vous pouvez laisser l'utilisateur activer l'objet. Pour l'attribut href notez le signe dièse d'introduction (#) suivi par le nom id de l'objet.

 vers le hautvers le bas 

HTML 4.0XHTML 1.0MSIE 5.0Netscape 6.0 Formater des objets avec les feuilles de style en cascade CSS

Les feuilles de style CSS proposent des propriétés à l'aide desquelles les deux fonctions vers le haut aligner un objet par rapport au texte qui l'entoure et vers le haut faire passer le texte à côté de l'objet sont réalisables exactement comme avec HTML. Le "réglage fin" est même beaucoup plus précis avec les CSS. Il vous faut travailler avec les feuilles de style CSS si vous voulez obtenir les effets décrits ici tout en travaillant avec la variante HTML "Strict".
Pour employer des feuilles de style CSS, il vous faut d'abord savoir comment Chapitre: vue d'ensemble  définir des formats CSS Ensuite, vous serez en mesure d'appliquer les propriétés CSS. En relation avec ce qui vient d'être décrit les données de feuilles de style suivantes sont aussi intéressantes
Autre page d'information vertical-align (alignement vertical)
Autre page d'information float (flux de texte)
Autre page d'information clear (poursuite pour le flux de texte)
Autre page d'information Marge extérieure et espace

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Formater des objets avec les feuilles de style en cascade CSS</title>
</head>
<body>

<h1>C'EST ICI <object data="breeze.mid" type="audio/x-midi" width="200" height="100"
style="vertical-align:middle; margin-left:30px; margin-right:30px;">
Votre navigateur ne peut malheureusement pas afficher l'objet !
</object> QUE L'ON JOUE</h1>

</body>
</html>

Explication:

Avec style="vertical-align:middle" placé dans un repère <object> vous obtenez la même chose qu'avec align="middle",
avec style="vertical-align:text-top" vous obtenez la même chose qu'avec align="top",
et avec style="vertical-align:text-bottom" vous obtenez la même chose qu'avec align="bottom".

Avec les mentions CSS margin-left:30px; et margin-right:30px; a été ménagé dans l'exemple ci-dessus un espace de 30 pixels à gauche et à droite par rapport au texte. Quand vous voulez faire passer le texte autour d'un objet (cela n'a pas été fait dans l'exemple ci-dessus), vous pouvez avec une mention telle que style="float:left; margin-right:20px; margin-bottom:10px" obtenir que l'objet soit aligné à gauche, et que le texte qui suit l'objet passe à sa droite. Ce faisant, un espace de 20 pixels sera respecté entre l'objet et le texte (à gauche de l'objet par contre et à la différence de l'attribut HTML hspace=, aucun espace de 20 pixels n'est créé). En bas, un espace de 10 pixels a été défini par rapport au texte.

 vers le haut
page suivante Autre page d'information Incorporer des applets Java (traditionnel)
page précédente Autre page d'information Incorporer des objets
 

© 2001 Stefan Münz / © 2003 Traduction Adresse électronique Serge François, 13405@free.fr
Adresse électronique selfhtml@selfhtml.com.fr