수

CSS3 워드 래핑

· 2017-08-18 (금) 14:14:33 · 2258
CSS3 워드 래핑

CSS3 word-wrap속성을 사용하면 긴 단어를 끊어서 다음 줄로 감쌀 수 있습니다. 

단어가 너무 길어서 한 영역 내에 들어 가지 않으면 외부로 확장됩니다.

970f7ed8ffa9df1df597855b97d0c6ff_1503033240_2801.png
 
예
긴 단어를 깨뜨리고 다음 줄로 감쌀 수있게하십시오 :

p {
    word-wrap: break-word;
}



<!DOCTYPE html>
<html>
<head>
<style> 
p.test {
    width: 11em; 
    border: 1px solid #000000;
    word-wrap: break-word;
}
</style>
</head>
<body>

<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

</body>
</html>
970f7ed8ffa9df1df597855b97d0c6ff_1503033269_9311.png
 
|
댓글을 작성하시려면 로그인이 필요합니다.

퍼블리셔팁

1,282건

퍼블리싱과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
CSS 17-08-23 조회 2,116
CSS 17-08-23 조회 2,138
CSS 17-08-22 조회 1,911
CSS 17-08-22 조회 2,219
CSS 17-08-22 조회 2,659
CSS 17-08-20 조회 2,269
CSS 17-08-20 조회 1,569
CSS 17-08-20 조회 1,790
CSS 17-08-18 조회 1,816
CSS 17-08-18 조회 1,939
CSS 17-08-18 조회 2,259
CSS 17-08-17 조회 2,556
CSS 17-08-17 조회 2,221
CSS 17-08-17 조회 2,190
CSS 17-08-16 조회 2,060
CSS 17-08-16 조회 1,842
CSS 17-08-16 조회 1,833
CSS 17-08-15 조회 2,042
CSS 17-08-15 조회 2,101
CSS 17-08-15 조회 1,921
CSS 17-08-11 조회 1,814
CSS 17-08-11 조회 2,465
CSS 17-08-11 조회 2,583
CSS 17-08-10 조회 1,929
CSS 17-08-10 조회 2,445
CSS 17-08-10 조회 2,242
CSS 17-08-09 조회 2,139
CSS 17-08-09 조회 2,574
CSS 17-08-09 조회 2,123
CSS 17-08-07 조회 2,387