From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- files/ko/web/css/line-break/index.html | 112 +++++++++++++++++++++++++++++++++ 1 file changed, 112 insertions(+) create mode 100644 files/ko/web/css/line-break/index.html (limited to 'files/ko/web/css/line-break') diff --git a/files/ko/web/css/line-break/index.html b/files/ko/web/css/line-break/index.html new file mode 100644 index 0000000000..76fabd4316 --- /dev/null +++ b/files/ko/web/css/line-break/index.html @@ -0,0 +1,112 @@ +--- +title: line-break +slug: Web/CSS/line-break +tags: + - CSS + - CSS Property + - CSS Text + - Reference + - i18n + - l10n + - 'recipe:css-property' +translation_of: Web/CSS/line-break +--- +
{{CSSRef}}
+ +

CSS line-break 속성은 한중일(CJK) 3개국어의 텍스트 줄을 어디서 바꿀지 지정합니다.

+ +
/* 키워드 값 */
+line-break: auto;
+line-break: loose;
+line-break: normal;
+line-break: strict;
+line-break: anywhere;
+
+/* 전역 값 */
+line-break: inherit;
+line-break: initial;
+line-break: unset;
+
+ +

구문

+ +

+ +
+
auto
+
기본 줄 바꿈 규칙을 사용합니다.
+
loose
+
가장 자유로운 줄 바꿈 규칙을 사용합니다. 보통 신문 등 짧은 줄에서 사용합니다.
+
normal
+
가장 흔한 줄 바꿈 규칙을 사용합니다.
+
strict
+
가장 엄격한 줄 바꿈 규칙을 사용합니다.
+
anywhere
+
+

모든 타이포그래피 글자 단위 주위에서 줄을 바꿀 수 있습니다. 줄 바꿈 위치는 모든 문장 부호, 공백, 단어 중간을 포함하며 GL, WJ, ZWJ 문자 클래스가 나타내는 줄 바꿈 제한 및 {{cssxref("word-break")}}가 요구하는 규칙 모두 무시할 수 있습니다. 붙임표는 사용하지 않습니다.

+
+
+ +

형식 정의

+ +

{{cssinfo}}

+ +

형식 구문

+ +
{{csssyntax}}
+ +

예제

+ +

줄 바꿈 지정하기

+ +

줄 바꿈이 "々", "ぁ", "。"의 주위에서 어떻게 발생하는지 살펴보세요.

+ +

HTML

+ +
<div lang="ja">
+  <p class="wrapbox auto">auto:<br>そこは湖のほとりで木々が輝いていた。<br>その景色に、美しいなぁと思わずつぶやいた。</p>
+  <p class="wrapbox loose">loose:<br>そこは湖のほとりで木々が輝いていた。<br>その景色に、美しいなぁと思わずつぶやいた。</p>
+  <p class="wrapbox normal">normal:<br>そこは湖のほとりで木々が輝いていた。<br>その景色に、美しいなぁと思わずつぶやいた。</p>
+  <p class="wrapbox strict">strict:<br>そこは湖のほとりで木々が輝いていた。<br>その景色に、美しいなぁと思わずつぶやいた。</p>
+  <p class="wrapbox anywhere">anywhere:<br>そこは湖のほとりで木々が輝いていた。<br>その景色に、美しいなぁと思わずつぶやいた。</p>
+</div>
+
+ +

CSS

+ +
.wrapbox { width: 10em; margin: 0.5em; white-space: normal; vertical-align: top; display: inline-block; }
+.auto { line-break: auto; }
+.loose { line-break: loose; }
+.normal { line-break: normal; }
+.strict { line-break: strict; }
+.anywhere { line-break: anywhere; }
+
+ +

결과

+ +

{{ EmbedLiveSample('줄_바꿈_지정하기', 200, 400) }}

+ +

명세

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('CSS3 Text', '#line-break-property', 'line-break')}}{{Spec2('CSS3 Text')}}Initial definition
+ +

브라우저 호환성

+ + + +

{{Compat("css.properties.line-break")}}

-- cgit v1.2.3-54-g00ecf