CSS margin-block అట్రిబ్యూట్

నిర్వచనం మరియు వినియోగం

margin-block అత్యంత విలువలు బ్లాక్ దిశలో ప్రారంభ మరియు ముగింపు సరిహద్దు మార్జిన్లను నిర్వచిస్తుంది, ఇది క్రింది అత్యంత విలువల లఘువు రూపం ఉంది:

margin-block అత్యంత విలువలను వివిధ రీతుల్లో అమర్చవచ్చు:

మార్జిన్-బ్లాక్ అత్యంత విలువలు రెండు ఉన్నప్పుడు:

margin-block: 10px 50px;
  • ప్రారంభ సరిహద్దు మార్జిన్ 10px ఉంటుంది
  • 结束边缘的外边距为 50px

如果 margin-block 属性有一个值：

margin-block: 10px;
  • margin-block: 10px;

ప్రారంభ మరియు అంతిమ సరిహద్దులకు వెళుతున్న మార్గదర్శకాలను 10pxగా నిర్వచించారు margin-block margin-left లక్షణం చాలా అనిలిక కానీ, margin-block మరియు సిఎస్ఎస్ యొక్క లక్షణాలు సిఎస్ఎస్ యొక్కmargin-bottommargin-topmargin-bottom, margin-left మరియు margin-right లక్షణం చాలా అనిలిక కానీ, margin-block మరియు margin-inline

లక్షణం బ్లాక్ దిశ మరియు పరిమాణ దిశపై ఆధారపడి ఉంటుంది.ముప్పు నోటిస్: writing-mode బ్లాక్ దిశను నిర్వచిస్తుంది. ఇది బ్లాక్ ప్రారంభ మరియు అంతిమ స్థానాలను ప్రభావితం చేస్తుంది మరియు బ్లాక్ దిశలో సంబంధిత సిఎస్ఎస్ లక్షణాలను ప్రభావితం చేస్తుంది: margin-block లక్షణ ఫలితం. ఇంగ్లీష్ పేజీలలో, బ్లాక్ దిశ క్రిందకు ఉంటుంది మరియు పరిమాణ దిశ నుండి ఎడమకు ఉంటుంది.

ఉదాహరణ

ఉదాహరణ 1

బ్లాక్ దిశలో ప్రతి పక్కల మార్గదర్శకాలను సెట్ చేయండి:

div {
  margin-block: 35px;
}

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

ఉదాహరణ 2

నాలుగు <div> అంశాల పేర్వత దిశలో ఉన్నప్పుడు, writing-mode లక్షణాన్ని vertical-rlగా సెట్ చేసినప్పుడు, బ్లాక్ దిశలో అంశాల ప్రారంభ స్థానం మొదటి పైకి మరియు అంతిమ స్థానం క్రిందికి కదులుతుంది. writing-mode మార్పులు కూడా margin-block ప్రభావితం చేస్తాయి:

#parentDiv {
  writing-mode: vertical-rl;
}
#myDiv {
  margin-block: 10px 50px;
}

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

సిఎస్ఎస్ సంకేతాలు

margin-block: auto|length|initial|inherit;

లక్షణ విలువ

విలువ వివరణ
auto అప్రమేయ విలువ
length

px, pt, cm వంటి అక్షరాంశాలతో margin-block నిర్దేశించండి. పేర్వత దిశలో నేరుగా విలువలు అనుమతిస్తాయి。

చూడండి:CSS యూనిట్స్。
% పేర్వత దిశలో పరిమాణం నిర్దేశించిన margin-block
initial ఈ లక్షణాన్ని అప్రమేయ విలువకు సెట్ చేయండి. చూడండి: initial。
inherit ఈ లక్షణాన్ని తన పేర్వత అంశం నుండి పారంపర్యం చేసుకుంది. చూడండి: inherit。

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

అప్రమేయ విలువ: auto
పారంపర్యం: లేదు
అనిమేషన్ తయారీ: మద్దతు పొందండి:అనిమేషన్ సంబంధిత లక్షణాలు。
సంస్కరణ: సిఎస్ఎస్3
జావాస్క్రిప్ట్ సంకేతాలు: object.style.marginBlock="50px 20px"

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

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

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
87.0 87.0 66.0 14.1 73.0

相关页面

参考：CSS margin-block-end అట్రిబ్యూట్

参考：CSS margin-block-start అట్రిబ్యూట్

参考：CSS margin-bottom అట్రిబ్యూట్

参考：CSS మార్జిన్-ఇన్లైన్ అట్రిబ్యూట్

参考：CSS మార్జిన్-లెఫ్ట్ అట్రిబ్యూట్

参考：CSS మార్జిన్-రైట్ అట్రిబ్యూట్

参考：CSS మార్జిన్-టాప్ అట్రిబ్యూట్

参考：CSS వ్రాటింగ్-మోడ్ అట్రిబ్యూట్