Create your own awesome maps

Even on the go

with our free apps for iPhone, iPad and Android

Get Started

Already have an account?
Log In

Positionner un élément en HTML5/CSS3 by Mind Map: Positionner un élément en
HTML5/CSS3
0.0 stars - 0 reviews range from 0 to 5

Positionner un élément en HTML5/CSS3

L'auteur : Olivier Legrand

Formateur du Web

Olivier Legrand - Concepteur pédagogique multimédia

Statique

position: static;

Position normal de l'élément

Relatif

position: relative;

left: valeur ou %

top; valeur ou %

right; valeur ou %

bottom; valeur ou %

Exemple

Absolu

position: absolute;

left: valeur ou %

top; valeur ou %

right; valeur ou %

bottom; valeur ou %

Exemple

L'élément devient indépendant du reste du document

Fixe

position: fixed;

left: valeur ou %

top; valeur ou %

right; valeur ou %

bottom; valeur ou %

Exemple

L'élément devient indépendant du reste du document

Flottement

float:

left:

right;

none;

Retire un élément de la boite de flux

Permet de placer l'élément a gauche ou a droite

Dégagement

clear

left:, annule le flottement de gauche

right;, annule le flottement de droite

both;, annule le flottement des deux cotés

none;, annule toute propriété de flottement

Clear annule le flottement de la propriété de float

Superposition

z-index

z-index: 1

z-index: 2

z-index: 3

Les éléments au-dessus ou en dessous des autres

Exemple

CSS

HTML

Dépassement

overflow

hidden, La partie qui dépasse est cachée

scroll, la partie qui dépasse est cachée, La partie est accessible par une barre

visible, La partie qui dépasse est affichée

auto, La main est rendue au navigateur

Exemple

HTML

CSS

Découpage

clip

rect(sup_gauche sup_droit inf_droit inf_gauche)

Exemple

HTML

CSS

Clip détermine la partie visible de l'image

Affichage

display

block

inline

none

Contrôle l'affichage des éléments de la page

Exemple

CSS

HTML

display: none;, l'élément est retiré de la page

Visibilité

visibility

visible, affiche l'élément

hidden, cache l'élément

Exemple

CSS

Détermine si l'élément est visible ou caché

Les éléments conservent leur position