Introduction à l'utilisation du positionnement CSS

L'option

position définit le positionnement de l'élément attribut L'option a 5 valeurs optionnelles : statique, relative, absolue, fixe, hériter

Lorsque la valeur de l'attribut est relative, absolue, fixe

haut gauche droite bas z | -index fonctionnera.

statique (par défaut)

relatif (positionnement relatif)

absolu (positionnement absolu )

fixe (positionnement absolu, navigateur absolu et fenêtre, les navigateurs de version inférieure ne prennent pas en charge tels que ie6 et ie7)

relatifs et statiques Ils sont tous positionnés par rapport aux autres éléments du document et appartiennent à la catégorie du positionnement relatif. La différence est que l'un peut contrôler le déplacement et l'autre ne peut pas

statique (valeur par défaut). )

Si

utilise la valeur par défaut , la définition de haut, gauche, droite, bas, z-index pour l'élément en CSS ne prendra pas effet

relative

relative se comporte de la même manière que la valeur par défaut, sauf que vous pouvez contrôler le décalage par rapport à d'autres positions normales en définissant le décalage et l'index z.

La valeur par défaut du positionnement (positon) de tous les éléments est statique. N'écrire rien signifie un positionnement relatif. L'utilisation de position:relative ne définit pas les valeurs topp, left, z-index, right et bottom. . Le comportement est le même que la valeur par défaut.

absolu et fixe

Caractéristiques :

1. La largeur des éléments au niveau du bloc n'est plus de 100 % lorsqu'elle n'est pas définie ; est automatiquement ajusté en fonction du contenu

2. Lorsque le z-index n'est pas défini, l'élément absolu couvrira les autres éléments.

3. Il se détachera du flux normal du document et n'occupera plus d'espace, similaire à l'effet après

flottant

l'absolu est relatif à l'élément parent précédent qui n'est pas statique Effectuer un positionnement absolu. Si la position de l'élément parent n'est pas spécifiée, absolu sera positionné de manière absolue par rapport à l'ensemble du

document html.

fixed

Génère un élément positionné de manière absolue, positionné par rapport à la fenêtre du navigateur. En d’autres termes, quelle que soit la manière dont la page Web défile, l’élément reste toujours à une certaine position sur l’écran. Si nous voulons que la barre de contrôle de gauche soit toujours visible par l'utilisateur, utilisez position:fixe pour le positionnement.

Que faire si ie6 et ie7 ne prennent pas en charge les attributs fixes

Solution

Utiliser position:absolute

_top:expression ( eval(

document.documentElement.scrollTop))

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!