CSS break-before అట్రిబ్యూట్

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

break-before విధంతో మీరు నిర్దేశించిన అంతర్భాగం ముందు పేజీలు, కలములు లేదా ప్రాంతాలను విడిచిపెట్టాలా లేదా నిరోధించాలా నిర్ణయించవచ్చు.

break-before విధంతో మీరు CSS2 యొక్క page-break-before విధానాన్ని విస్తరించవచ్చు.

break-before విధంతో మీరు బ్రాసర్ కు సందేశం పంపవచ్చు అని మీరు బ్రేక్-అఫ్టర్ అంతర్భాగంలో ప్రయోగించిన అంతర్భాగం ముందు పేజీలు, కలములు లేదా ప్రాంతాలను విడిచిపెట్టవచ్చు లేదా అంతర్భాగాన్ని రెండు పేజీలకు విడిచిపెట్టకుండా నిరోధించవచ్చు.

ఉదాహరణ

నాణ్యమైన టెక్స్ట్ లో విందు ముందుగా ప్రింట్ చేయండి:

@media print {
  h1 {
    break-before: always;
  }
}

CSS సంకేతం

break-before: auto|all|always|avoid|avoid-column|avoid-page|avoid-region|column|left|page|recto|region|right|verso|initial|inherit;

属性值

描述
auto 默认。在元素之前自动进行分页、分列、分区。
all 始终在主体框之前立即插入分页符。
always 始终在元素之前插入分页符(page-break)。
avoid 避免在元素之前出现页、列、区域中断。
avoid-column ఎలిమెంట్ ముందుగా కాలమ్స్ నివారించండి.
avoid-page ఎలిమెంట్ ముందుగా పేజీ నివారించండి.
avoid-region ఎలిమెంట్ ముందుగా పార్టిషన్ నివారించండి.
column ఎలిమెంట్ ముందుగా ఎల్లప్పుడూ కాలమ్స్ సైఫ్ట్స్ ప్రవేశపెట్టుము.
left ఎలిమెంట్ ముందుగా ఒకటి లేదా రెండు పేజీ సైఫ్ట్స్ ప్రవేశపెట్టండి, ఆ విధంగా తదుపరి పేజీని ఎడమ పేజీగా ఫార్మాట్ చేయండి.
page ఎలిమెంట్ ముందుగా ఎల్లప్పుడూ పేజీ సైఫ్ట్స్ ప్రవేశపెట్టుము.
recto ప్రధాన ఫ్రేమ్ ముందుగా ఒకటి లేదా రెండు పేజీ సైఫ్ట్స్ ప్రవేశపెట్టండి, ఆ విధంగా తదుపరి పేజీని రెక్టో పేజీగా ఫార్మాట్ చేయండి.
region ఎలిమెంట్ ముందుగా ఎల్లప్పుడూ పార్టిషన్ సైఫ్ట్స్ ప్రవేశపెట్టుము.
right ఎలిమెంట్ ముందుగా ఒకటి లేదా రెండు పేజీ సైఫ్ట్స్ ప్రవేశపెట్టండి, ఆ విధంగా తదుపరి పేజీని కుడి పేజీగా ఫార్మాట్ చేయండి.
verso ప్రధాన ఫ్రేమ్ ముందుగా ఒకటి లేదా రెండు పేజీ సైఫ్ట్స్ ప్రవేశపెట్టండి, ఆ విధంగా తదుపరి పేజీని వెర్సో పేజీగా ఫార్మాట్ చేయండి.
initial ఈ లక్షణాన్ని అప్రమేయ విలువకు అమర్చుము. చూడండి: initial.
inherit ఈ లక్షణాన్ని తన ముందస్తు ఎలిమెంట్స్ నుండి పరిచయం చేసుకుంటుంది. చూడండి: inherit.

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

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

మరిన్ని ఉదాహరణలు

ఉదాహరణ

ముద్రణ సమయంలో అన్ని కొత్త అధ్యాయాలు సరైన పేజీ (పుస్తకంలో) నుండి ప్రారంభమవుతాయి అని నిర్ధారించుటకు, అన్ని <h1> ఎలిమెంట్స్ కు break-before: ఉపయోగించవచ్చు:

@media print {
  h1 {
    break-before: right;
  }
}

ఉదాహరణ

ఎల్లప్పుడూ region లో <ul> ముందుగా region-break ప్రవేశపెట్టుము:

.region ul {
    break-before: region;
  }
}

బ్రాఉజర్ మద్దతు

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

క్రోమ్ IE / ఎండ్జ్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
50.0 10.0 65.0 10.0 37.0