<wbr>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

HTML <wbr> 요소는 현재 요소의 줄 바꿈 규칙을 무시하고 브라우저가 줄을 바꿀 수 있는 위치를 나타냅니다.

시도해보기

콘텐츠 카테고리 플로우 콘텐츠, 구문 콘텐츠.
가능한 콘텐츠 없음. 빈 요소입니다.
태그 생략 여는 태그는 필수입니다. 닫는 태그는 존재해선 안됩니다.
가능한 부모 요소 구문 콘텐츠를 허용하는 모든 요소.
암시적 ARIA 역할 대응하는 역할 없음
가능한 ARIA 역할 모두
DOM 인터페이스 HTMLElement

특성

이 요소는 전역 특성만 포함합니다.

참고

UTF-8 인코딩을 사용한 페이지의 <wbr>U+200B ZERO-WIDTH SPACE 코드 포인트처럼 동작합니다. 특히, Unicode bidi BN 코드 포인트처럼 행동하므로 bidi 정렬의 영향을 받지 않습니다. 즉 <div dir=rtl>123,<wbr>456</div>의 줄이 바뀌지 않은 경우, 456,123이 아니라 123,456으로 나타납니다.

같은 이유로 인해 < wbr > 요소로 인한 줄바꿈으로는 붙임표가 나타나지 않습니다. 줄의 끝에 하이픈이 필요한 경우 소프트 하이픈 문자 개체(soft hyphen character entity, & shy;)를 사용하세요.

<wbr>은 Internet Explorer 5.5에서 처음 구현됐고, HTML5가 정식으로 정의했습니다.

예제

URL의 줄을 바꿀 때, 문장 부호 다음에 잘린 경우 독자가 URL이 끝난 것으로 혼동할 수 있으므로, *The Yahoo Style Guide*는 URL의 줄바꿈을 문장 부호 이전에 하라고 추천합니다.

html
<p>
  http://this<wbr />.is<wbr />.a<wbr />.really<wbr />.long<wbr />.example<wbr />.com/With<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages<wbr />/deeper<wbr />/level<wbr />/pages
</p>

명세

Specification
HTML
# the-wbr-element

브라우저 호환성

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
wbr

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

같이 보기