Propriété CSS offset-position

La propriété offset-position spécifie la position initiale du chemin de décalage.

Si la propriété position est spécifiée avec la valeur "static", la propriété offset-position sera ignorée.

La propriété offset-positionest aussi ignorée lorsque la propriété offset-path est "geometry-box", ou "basic shape".

Valeur initiale auto
Appliquée à Éléments transformables.
Héritée Non.
Animable Oui.
Version Motion Path Module Level 1
Syntaxe DOM Object.style.offsetPosition = "auto";

Syntaxe

offset-position: auto | <position> | initial | inherit;

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style>
      #element1{
      position: relative;
      width: 300px;
      height: 300px;
      border: 2px solid #666;
      }
      #element2{
      width: 100px;
      height: 100px;
      background-color: #1c87c9;
      position: absolute;
      top: 90px;
      left: 100px;
      offset-position: auto;
      offset-anchor: center;
      offset-path: ray(45deg);
      }
    </style>
  <body>
    <h2>Exemple de la propriété offset-position</h2>
    <div id="element1">
      <div id="element2"></div>
    </div>
  </body>
</html>

Valeurs

Valeur Description
auto Indique que la position initiale est la position de la boîte qui est spécifiée avec la propriété position.
<position> Spécifie la position initiale, avec le bloc englobant comme un zone de positionnement et un point sans dimension (boîte de la taille 0) comme la zone de l'élément.
initial Fait utiliser la valeur initiale.
inherit Hérite la propriété de son élément parent.

Support de Navigateurs



Trouvez-vous cela utile?

Articles Associées