Calque1 placé avec le pointeur centré

Initiation à dreamweaver mx 2004

dw7 - Essais de calques

Placement de calques

 

 

<div id="calque1" style="position:absolute; left:312px; top:170px; width:140px; height:50px; z-index:1; border:1px inset yellow;">
<div align="center">Calque1 plac&eacute; avec le pointeur centr&eacute; </div>
</div>

calque2

placé avec le pointeur à gauche

 

 

 

<div id="calque2" style="position:absolute; width:200px; height:115px; border:1px outset red; z-index:2">
<div align="center">
<p> calque2</p>
<p>plac&eacute; avec le pointeur &agrave; gauche </p>
</div>
</div>

Calque avec arrière-plan fantaisie

 

 

 

<div id="bkgd3" style="position:absolute; width:200px; height:115px; z-index:3; background-image: url(../img_ateliers/carreau_halloween.jpg); layer-background-image: url(../img_ateliers/carreau_halloween.jpg); border: 1px none #000000;">
<div align="center">Calque avec arri&egrave;re-plan fantaisie </div>
</div>
Ici, Dreamweaver génère le code pour IE et Nescape.

Superposition de calques

 

 

 

 

 

Copier un calque

<div id="Layerclip" style="position:absolute; width:101px; height:95px; z-index:6; left: 125px; top: 1230px;"><img src="../img_ateliers/clip_image002_0000.gif" name="clip002" width="101" height="95" id="clip002"></div>
<div id="Layerclip" style="position:absolute; width:101px; height:95px; z-index:6; left: 240px; top: 1230px;"><img src="../img_ateliers/clip_image002_0000.gif" name="clip002" width="101" height="95" id="clip002"></div>
<p align="left">&nbsp;</p>

Ce sont deux clones : seul le positionnement change.!

 

 

 

 

 

 

Débordement

 

 

 

 

 

Définir la partie visible d'un calque

 

 

 

<div id="Layevisible" style="position:absolute; width:101px; height:95px; z-index:10; clip: rect(35,auto,auto,60);"><img src="../img_ateliers/clip_image002_0000.gif" name="visible" width="101" height="95" id="visible"></div>

 

Page faite par Danyelle le 15 septembre 2005 avec le tutoriel de Milytoiles pour Grafixart.