본문 바로가기
Reference/CSS

hyphens 속성은 텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다.

by @webstoryboy 2022. 11. 21.

hyphens 속성은 텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다.

Reference/CSS

hyphens 속성은 텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다.

by @webs 2022. 11. 19.

hyphens

hyphens 속성은 텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다. 단어에서 줄바꿈이 될때 하이픈(-)으로 연결해주는 작업을 설정하는 방법입니다.


특징 설명
기본값 hyphens : manual
적용 text
버전 CSS3
사용성 ★☆☆☆☆

정의(Definition)

  • hyphens 속성은 텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다.

줄바꿈과 관련된 속성 및 태그

  • white-space 속성은 줄바꿈, 공백 여부를 설정합니다.
  • word-break 속성은 줄바꿈을 할때 단어를 기준으로 설정하는 속성입니다.
  • overflow-wrap 속성은 의미가 없는 텍스트 줄바꿈을 설정합니다.
  • hyphens 속성은 텍스트 줄바꿈 할때 하이픈으로 연결하는 방법을 설정합니다.
  • <br> 태그는 텍스트 줄바꿈을 설정합니다.
  • <wbr> 태그는 의미가 없는 텍스트 줄바꿈을 설정합니다.

문법(Syntax)

hyphens : none | manual | auto

/* 기본 속성 */
hyphens: none;
hyphens: manual; /* 기본값 */
hyphens: auto;

/* 전역 속성 */
hyphens: inherit;   /* 상속 */
hyphens: initial;   /* 초기화 */
hyphens: revert;    /* 원래대로 돌리기 */
hyphens: unset;     /* 설정 해제 */

속성(Property)

속성값 값(예) 설명
none hyphens: none 줄바꿈 지점에서 변경됩니다.
manual hyphens: manual 줄바꿈 지점이 없을 경우 단어를 기준으로 변경합니다.
auto hyphens: auto 줄바꿈 지점이 없을 경우 임의로 변경합니다.

호환성(Compatibility)

크롬 아이콘 파이어폭스 아이콘 사파리 아이콘 오페라 아이콘 네이버 웨일 익스플로러6 아이콘6 익스플로러7 아이콘7 익스플로러8 아이콘8 익스플로러9 아이콘9 익스플로러10 아이콘10 익스플로러11 아이콘11 엣지 아이콘 안드로이드 아이콘 ios 아이콘
hyphens

참고(Reference)


댓글