CSS ప్యాడింగ్‌ఇన్లైన్ అట్రిబ్యూట్
- ముంది పేజీ padding-bottom
- తరువాతి పేజీ padding-inline-end
నిర్వచనం మరియు ఉపయోగం
మెటా అంశం padding-inline ఇది అంతరం పై నుండి సరిహద్ది వరకు సరిహద్ది వరకు ఉన్న స్థానాన్ని సూచిస్తుంది. ఇది క్రింది అంశాల లఘువైన రూపం ఉంది:
padding-inline అంశం విలువలను వివిధ రీతుల్లో అమర్చవచ్చు:
padding-inline అంశం రెండు విలువలతో ఉంటే:
padding-inline: 10px 50px;
- ప్రారంభ మూలకు అంతరం 10px ఉంటుంది
- ముగింపు మూలకు అంతరం 50px ఉంటుంది
如果 padding-inline 属性有一个值：
padding-inline: 10px;
- 起始端和结束端的内边距都是 10px
CSS padding-inline మరియు padding-block లక్షణాలు సిఎస్ఎస్ లక్షణాలతో padding-topమరియుpadding-bottomమరియుpadding-left మరియు padding-right చాలా అనికట ఉంది, కానీ padding-inline మరియు padding-block లక్షణం పిండి దిశ మరియు బ్లాక్ దిశపై ఆధారపడి ఉంటుంది.
గమనిక:సంబంధిత సిఎస్ఎస్ లక్షణాలను ప్రభావితం చేస్తుంది writing-mode మరియు direction పిండి దిశను నిర్వచిస్తుంది. ఇది అంశం పిండి దిశలో ప్రారంభ మరియు ముగింపు మూల దిశలను ప్రభావితం చేస్తుంది మరియు padding-inline లక్షణం ఫలితం. ఇంగ్లీష్ పేజీలలో, బ్లాక్ దిశ క్రిందకు ఉంటుంది, పిండి దిశ ఎడమ నుండి కుడికి ఉంటుంది.
ఉదాహరణ
ఉదాహరణ 1
పిండి దిశలో పెద్దదానికి అంతరాన్ని సెట్ చేయండి:
div {
padding-inline: 50px;
}
ఉదాహరణ 2
మీ <div> అంశం యొక్క writing-mode లక్షణానికి vertical-rl విలువ సెట్ చేసినప్పుడు, పిండి దిశ క్రిందకు మారింది. ఫలితంగా అంశం యొక్క ప్రారంభ మూల మరియు ముగింపు మూల దిశలు మారినవి:
div {
writing-mode: vertical-rl;
padding-inline: 10px 100px;
}
ఉదాహరణ 3
మీ <div> అంశం యొక్క direction లక్షణానికి rtl విలువ సెట్ చేసినప్పుడు, పిండి దిశ ఈశాన్యం నుండి ఈశాన్యం కు మారింది. ఫలితంగా అంశం యొక్క ప్రారంభ మూల మరియు ముగింపు మూల దిశలు మారినవి:
div {
direction: rtl;
padding-inline: 10px 100px;
}
సిఎస్ఎస్ సంకేతాలు
padding-inline: auto|value|initial|inherit;
లక్షణానికి విలువ
| విలువ | వివరణ |
|---|---|
| auto | అప్రమేయం. అంశం యొక్క అప్రమేయ padding-inline దూరం. |
| length |
px, pt, cm వంటి ఏకాకర సంఖ్యలతో దూరాన్ని నిర్ణయించండి. నిషేధించబడిన మానికలు. చూడండి:సిఎస్ఎస్ యూనిట్స్。 |
| % | పిండి దిశలో పరిమాణాన్ని ప్రాతిపదికగా నిర్ణయించండి. |
| initial | ఈ లక్షణాన్ని అప్రమేయ విలువకు సెట్ చేయండి. చూడండి: initial。 |
| inherit | ఈ లక్షణాన్ని తన పూర్వీక అంశం నుండి పారంపర్యం చేసుకుంటుంది. చూడండి: inherit。 |
సాంకేతిక వివరాలు
| అప్రమేయ విలువ: | auto |
|---|---|
| పారంపర్యం: | ఏ |
| అనిమేషన్ తయారీ: | మద్దతు ఉంది. చూడండి:అనిమేషన్ సంబంధిత లక్షణాలు。 |
| సంస్కరణ: | సిఎస్ఎస్ 3 |
| జావాస్క్రిప్ట్ సంకేతాలు: | object.style.paddingInline="100px 20px" |
బ్రౌజర్ మద్దతు
పట్టికలో ఉన్న సంఖ్యలు ఈ లక్షణాన్ని పూర్తిగా మద్దతు ఇస్తున్న బ్రౌజర్ సంస్కరణను సూచిస్తాయి。
| క్రోమ్ | ఎడ్జ్ | ఫైర్‌ఫాక్స్ | సఫారీ | ఆపెరా |
|---|---|---|---|---|
| 87.0 | 87.0 | 66.0 | 14.1 | 73.0 |
相关页面
పరికళ్పనలు:CSS డిరెక్షన్ అట్రిబ్యూట్
పరికళ్పనలు:CSS ప్యాడింగ్‌ఇన్లైన్ ఎండ్ అట్రిబ్యూట్
పరికళ్పనలు:CSS ప్యాడింగ్‌ఇన్లైన్ స్టార్ట్ అట్రిబ్యూట్
పరికళ్పనలు:CSS ప్యాడింగ్‌బాటమ్ అట్రిబ్యూట్
పరికళ్పనలు:CSS ప్యాడింగ్‌లైట్ అట్రిబ్యూట్
పరికళ్పనలు:CSS ప్యాడింగ్‌రైట్ అట్రిబ్యూట్
పరికళ్పనలు:CSS ప్యాడింగ్‌టాప్ అట్రిబ్యూట్
పరికళ్పనలు:CSS వ్రాయింగ్-మోడ్ అట్రిబ్యూట్
- ముంది పేజీ padding-bottom
- తరువాతి పేజీ padding-inline-end
