Par défaut, les éléments d'une page HTML ou Web ASP.NET sont rendus selon leur ordre d'apparition dans le balisage, ce que l'on appelle parfois mise en page fluide. Vous pouvez également exposer des éléments en deux dimensions, en les positionnant avec des coordonnées horizontales et verticales n'importe où dans la page. Cette option de disposition tire parti des options de positionnement disponibles d'un style à l'autre.
Pour vous aider à travailler avec du texte statique ou pour positionner des éléments en groupe, vous pouvez créer une couche, qui est un élément div possédant des informations de positionnement.
Vous pouvez définir le positionnement individuel d'éléments dans la page. Vous pouvez également définir une option permettant de définir automatiquement le positionnement de tous les éléments que vous ajoutez à la page par glisser-déposer ou par copier-coller depuis le Presse-papiers.
Pour positionner un élément avec des coordonnées horizontales et verticales
-
En mode Design, sélectionnez l'élément que vous souhaitez positionner.
-
Dans le menu Disposition, cliquez sur Position, puis sur Absolue ou Relative.
-
Faites glisser le contrôle à l'endroit de votre choix.
.gif) Remarque |
|---|
| Si l'élément est défini pour positionner des unités en utilisant des pixels, ce qui est le comportement par défaut de Visual Web Developer, vous pouvez assujettir le glisser-déplacer à une grille invisible. Pour plus d'informations, consultez Position CSS, Concepteur HTML, boîte de dialogue Options. |
Pour positionner du texte statique ou des groupes d'éléments
-
Dans le menu Disposition, cliquez sur Insérer une couche.
Visual Web Developer insère un élément div avec des informations de position définies.
-
Pour déplacer l'élément div, cliquez sur le symbole de sélection, puis faites-le glisser sur une nouvelle position.
-
Pour redimensionner l'élément div, cliquez sur le symbole de sélection, puis faites glisser les poignées de redimensionnement.
-
Pour ajouter du texte, cliquez à l'intérieur de l'élément div, puis saisissez le texte.
-
Pour ajouter des éléments, faites-les glisser de la Boîte à outils vers l'élément div.
Pour réinitialiser des éléments en mise en page fluide
-
En mode Design, sélectionnez l'élément que vous souhaitez réinitialiser en mise en page fluide.
-
Dans le menu Disposition, cliquez sur Position, puis sur Statique ou Non défini.
-
Statique règle le positionnement sur static, ce qui conserve la propriété de positionnement de feuille de style en cascade (CSS), mais place explicitement l'élément en mise en page fluide.
-
Non défini supprime toutes les informations de positionnement.
Pour définir les options de positionnement de nouveaux éléments
-
Dans le menu Outils, cliquez sur Options.
-
Dans le nœud Concepteur HTML, sélectionnez Position CSS.
-
Sous Options de positionnement, activez la case à cocher.
-
Dans la liste, sélectionnez l'option de positionnement que vous souhaitez appliquer à tous les éléments que vous faites glisser sur la page ou que vous collez depuis le Presse-papiers.
Pour plus d'informations sur la signification de chaque option, consultez Position CSS, Concepteur HTML, boîte de dialogue Options.
Voir aussi