Atributo offset-anchor de CSS

Página anterior offset
Página siguiente offset-distance

Definición y uso

offset-anchor El atributo especifica que el elemento se fija en el punto offset-path puntos definidos por el atributo en la trayectoria.

Si se utiliza offset-rotate El atributo rota el elemento, entonces offset-anchor El punto definido por el atributo también se convertirá en el centro de rotación.

Ejemplo

Fijar el punto central derecho del elemento <img> en la trayectoria definida:

img {
  offset-path: path('M 50 80 C 150 -20 250 180 350 80');
  offset-anchor: right center;
}

Pruebe usted mismo

Sintaxis de CSS

offset-anchor: auto|value|initial|inherit;

Valor del atributo

Valor	Descripción
auto	Valor predeterminado. El ancla está en el centro del elemento, equivalente al valor de atributo 50% 50%.
left top left center left bottom right top right center right bottom center top center center center bottom	Si solo se especifica una palabra clave, el otro valor será "center".
xpos ypos	El primer valor es la posición horizontal, el segundo valor es la posición vertical. La esquina superior izquierda es 0 0. La unidad puede ser píxeles (0px 0px) o cualquier otra unidad CSS. Si solo se especifica un valor, el otro valor será 50%. Se puede mezclar % y posiciones.
x% y%	El primer valor es la posición horizontal, el segundo valor es la posición vertical. La esquina superior izquierda es 0% 0%. La esquina inferior derecha es 100% 100%. Si solo se especifica un valor, el otro valor será 50%. El valor predeterminado es: 50% 50%.
initial	Establezca este atributo en su valor predeterminado. Ver: initial.
inherit	Hereda este atributo de su elemento padre. Ver: inherit.

Detalles técnicos

Valor predeterminado:	auto
Herencia:	No
Producción de animación:	Admite. Consulte:Atributos relacionados con la animación.
Versión:	CSS3
Sintaxis de JavaScript:	object.style.offsetAnchor="bottom right"