CSS break-inside 속성
예시
<img> 요소 내에서 페이지 나누기를 피하세요.
@media print
{
img {
display: block;
break-inside:
avoid;
}
}
정의 및 사용
속성 은 break-inside
지정된 요소 내에서 페이지 나누기, 열 나누기 또는 영역 나누기가 발생해야 하는지 여부를 지정합니다.
속성 은 break-inside
CSS2 속성을 확장합니다.
page-break-inside
를 사용하면 break-inside
이미지, 코드 스니펫, 테이블 및 목록 내에서 중단을 방지하도록 브라우저에 지시할 수 있습니다.
브라우저 지원
표의 숫자는 속성을 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.
Property | |||||
---|---|---|---|---|---|
break-inside | 50.0 | 10.0 | 65.0 | 10.0 | 37.0 |
CSS 구문
break-inside: auto|all|always|avoid|avoid-column|avoid-page|avoid-region|column|left|page|recto|region|right|verso|initial|inherit;
속성 값
Value | Description |
---|---|
auto | Default. Automatic page/column/region break inside the element |
avoid | Avoid a page/column/region break inside the element |
avoid-column | Avoid a column-break inside the element |
avoid-page | Avoid a page-break inside the element |
avoid-region | Avoid a region-break inside the element |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
더 많은 예
예시
<table>, <ul>, <ol> 요소 내에서 페이지 나누기를 피하세요::
@media print
{
table, ul, ol {
break-inside: avoid;
}
}