CSS ఆఫ్సెట్-అంకర్ అట్రిబ్యూట్

定义和用法

offset-anchor లక్షణం నిర్ధారించిన మార్గం ద్వారా ఎల్లప్పుడూ ఎల్లప్పుడూ ఎల్లప్పుడూ నిలబడే చేస్తుంది: offset-path లక్షణానికి నిర్ధారించిన మార్గంపై ఉన్న పదం.

ఈ లక్షణాన్ని ఉపయోగించినట్లయితే offset-rotate అనిమేషన్ ఎల్లప్పుడూ లక్షణాన్ని పరివర్తన చేస్తే offset-anchor లక్షణానికి నిర్ధారించిన పదం కూడా పరివర్తన కేంద్రంగా ఉంటుంది.

ఉదాహరణ

ముఖ్యమైన <img> ఎల్లప్పుడూ నిర్ధారించిన మార్గంపై కుడి మధ్యము నిలబడే చేస్తుంది:

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

స్వయంగా ప్రయత్నించండి

CSS సంకేతాలు

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

లక్షణానికి విలువ

విలువ వివరణ
auto అప్రమేయ విలువ. అంకురం ఎల్లప్పుడూ ఎల్లప్పుడూ కేంద్రంలో ఉంటుంది, అనురూపం 50% 50% లక్షణానికి.
  • left top
  • left center
  • left bottom
  • right top
  • right center
  • right bottom
  • center top
  • center center
  • center bottom
ఒక పదాన్ని మాత్రమే సూచించినట్లయితే, మరొక విలువ "center" గా ఉంటుంది.
xpos ypos

మొదటి విలువ అడుగున స్థానాన్ని, రెండవ విలువ ఎత్తు స్థానాన్ని సూచిస్తుంది.

ఎడమ మేలము ఉంది 0 0.

యూనిట్లు పిక్సెల్స్ (0px 0px) లేదా మరొక సిఎస్ఎస్ యూనిట్లు ఉంటాయి.

ఒక విలువను మాత్రమే సూచించినట్లయితే, మరొక విలువ 50% గా ఉంటుంది.

ప్రత్యేకంగా % మరియు స్థానాలను కలిపి ఉపయోగించవచ్చు.

x% y%

మొదటి విలువ అడుగున స్థానాన్ని, రెండవ విలువ ఎత్తు స్థానాన్ని సూచిస్తుంది.

ఎడమ మేలము ఉంది 0% 0%. కుడి క్రిందము 100% 100% ఉంది.

ఒక విలువను మాత్రమే సూచించినట్లయితే, మరొక విలువ 50% గా ఉంటుంది.

అప్రమేయ విలువ: 50% 50%.

initial ఈ లక్షణాన్ని అప్రమేయ విలువకు సెట్ చేయండి. చూడండి: initial
inherit ఈ లక్షణాన్ని తన పేర్వీకుడు నుండి పారంపర్యం చేసుకుంది. చూడండి: inherit

సాంకేతిక వివరాలు

అప్రమేయ విలువ: auto
పారంపర్యం: లేదు
అనిమేషన్ తయారీ: మద్దతు ఉంది. దయచేసి చూడండి:అనిమేషన్ సంబంధిత లక్షణాలు
సంస్కరణ: CSS3
జావాస్క్రిప్ట్ సంకేతాలు: object.style.offsetAnchor="తక్కువ కుడి"

బ్రౌజర్ మద్దతు

పట్టికలో ఉన్న సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ సంస్కరణను సూచిస్తాయి。

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
116 116 72 16 102

相关页面

教程:SVG 路径

教程:CSS 动画

参考:CSS ఆఫ్సెట్ అట్రిబ్యూట్

参考:CSS ఆఫ్సెట్-డిస్టెన్స్ అట్రిబ్యూట్

参考:CSS ఆఫ్సెట్-పాత్త్ర్ అట్రిబ్యూట్

参考:CSS ఆఫ్సెట్-పోజిషన్ అట్రిబ్యూట్

参考:CSS ఆఫ్సెట్-రోటేషన్ అట్రిబ్యూట్