CSS పోసిషన్ అట్రిబ్యూట్
- పూర్వ పేజీ pointer-events
- 下一页 @ప్రాపర్టీ
నిర్వచనం మరియు ఉపయోగం
position అనే విధానం సామగ్రి పొందుపరిచే రకాన్ని నిర్వచిస్తుంది.
说明
这个属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。
另请参阅:
CSS 教程:CSS 定位
HTML DOM 参考手册:position 属性
ఉదాహరణ
హెడింగ్ హెచ్2 ఎలిమెంట్ ను లొకేట్ చేయడం:
h2 { position:absolute; left:100px; top:150px; }
CSS సంకేతాలు
position: static|absolute|fixed|relative|sticky|initial|inherit;
అంశపు విలువ
విలువ | వివరణ |
---|---|
absolute |
అబ్సూల్యూట్ లొకేషన్ కలిగిన ఎలిమెంట్ను static లొకేషన్ కి బదులుగా మొదటి ప్రాతిపల్లి ఎలిమెంట్తో సంబంధించి లొకేషన్ చేస్తారు. ఎలిమెంట్ స్థానాన్ని "left", "top", "right" మరియు "bottom" అంశాల ద్వారా నిర్వచిస్తారు. |
fixed |
అబ్సూల్యూట్ లొకేషన్ కలిగిన ఎలిమెంట్ను బ్రౌజర్ విండోకు సంబంధించి లొకేట్ చేస్తారు. ఎలిమెంట్ స్థానాన్ని "left", "top", "right" మరియు "bottom" అంశాల ద్వారా నిర్వచిస్తారు. |
relative |
రియేల్ లొకేషన్ కలిగిన ఎలిమెంట్ను స్థానంలో లొకేట్ చేస్తుంది. కాబట్టి, "left:20" ఎలిమెంట్ యొక్క LEFT స్థానానికి 20 పిక్సెల్స్ జోడిస్తుంది. |
static | డిఫాల్ట్ విలువ. లొకేషన్ లేకుండా, ఎలిమెంట్ సాధారణ ప్రవాహంలో కనిపిస్తుంది (top, bottom, left, right లేదా z-index ప్రకటనలను పరిగణనలోకి లేదు). |
inherit | ఈ విధంగా position అంశాన్ని ప్రాతిపదికగా ప్రాతిపల్లి ఎలిమెంట్ నుండి పారంతరణ చేయవలసివుంది. |
సాంకేతిక వివరాలు
డిఫాల్ట్ విలువ: | static |
---|---|
పారంతరణ సామర్థ్యం: | no |
సంస్కరణ: | CSS2 |
JavaScript సంకేతాలు: | object.style.position="absolute" |
TIY ఉదాహరణ
- లొకేషన్: రియేల్ లొకేషన్
- ఈ ఉదాహరణలో ఎలిమెంట్ను దాని సాధారణ స్థానానికి సంబంధించి ఎలా లొకేట్ చేయాలను చూపిస్తుంది.
- లొకేషన్: అబ్సూల్యూట్ లొకేషన్
- ఈ ఉదాహరణలో ఎలిమెంట్ను అబ్సూల్యూట్ విలువలతో ఎలా లొకేట్ చేయాలను చూపిస్తుంది.
- లొకేషన్: ఫిక్స్ లొకేషన్
- ఈ ఉదాహరణలో ఎలిమెంట్ను బ్రౌజర్ విండోకు సంబంధించి ఎలా లొకేట్ చేయాలను చూపిస్తుంది.
- ఎలిమెంట్ రూపాన్ని సెట్ చేయడం
- ఈ ఉదాహరణలో ఎలిమెంట్ రూపాన్ని ఎలా సెట్ చేయాలను చూపిస్తుంది. ఈ ఎలిమెంట్ ఈ రూపంలో కట్టబడి, చూపబడుతుంది.
- Z-index
- Z-index ఒక ఎలిమెంట్ను మరొక ఎలిమెంట్తో తర్వాత ఉంచడానికి ఉపయోగించబడవచ్చు。
- Z-index
- పై ఉదాహరణలో కొందరు ఎలిమెంట్స్ జి-ఇండెక్స్ మార్చబడ్డాయి。
బ్రౌజర్ మద్దతు
పట్టికలోని సంఖ్యలు ఈ లక్షణను పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ సంస్కరణను చెప్పుతాయి。
క్రోమ్ | IE / ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఓపెరా |
---|---|---|---|---|
1.0 | 7.0 | 1.0 | 1.0 | 4.0 |
- పూర్వ పేజీ pointer-events
- 下一页 @ప్రాపర్టీ