또는 줄 바꿈 공백을 사용하지 않고 HTML에서 특정 줄바꿈 위치의 우선순위를 지정하려면 어떻게 해야 합니까?
- Susan Sarandon원래의
- 2024-10-27 04:06:29365검색
또는 줄바꿈하지 않는 공백?
" />
기본 줄 바꿈 위치 지정
HTML에서 줄 바꿈은 일반적으로 공백이나 쉼표에서 발생합니다. 그러나 강제로 줄 바꿈을 원하는 상황에서는 특정 위치에서 우선순위를 정하는 기술이 있습니다.
단순 공백을 사용하지 않고 기본 줄 바꿈 위치를 지정하려면 다음 접근 방식을 활용할 수 있습니다.
-
CSS 클래스 정의:
<code class="css">span.avoidwrap { display: inline-block; }</code> -
이 클래스에 함께 보관할 텍스트 래핑:
<code class="html"><span class="avoidwrap">Text to keep together</span></code>
이것은 메소드는 래핑된 텍스트를 인라인 블록으로 설정하여 자체 경계 내에서 텍스트가 깨지는 것을 방지합니다. 라인 래핑 알고리즘은 인라인 블록 내의 공백을 고려하기 전에 먼저 지정된 기본 위치(예: 쉼표)에서 끊기를 시도합니다. 🎜>
예를 들어 다음 코드 조각은 다음과 같습니다.<code class="html"><html>
<head>
<style type="text/css">
span.avoidwrap {
display: inline-block;
}
</style>
</head>
<body>
<div class="box">
<table>
<tr>
<td>lorem ipsum</td>
<td>lorem ipsum</td>
<td>lorem ipsum</td>
</tr>
<tr>
<td>lorem ipsum</td>
<td>
<span class="avoidwrap">Honey Nut Cheerios, Wheat Chex, Grape-Nuts, Rice Krispies</span>
<br />
<span class="avoidwrap">Some random cereal with a very long name, Honey Bunches of Oats, Wheaties, Special K</span>
<br />
<span class="avoidwrap">Froot Loops, Apple Jacks</span>
</td>
<td>lorem ipsum</td>
</tr>
</table>
</div>
</body>
</html></code>지정된 쉼표 위치에서 줄 바꿈을 수행하여 각 인라인 블록 내의 텍스트를 함께 유지합니다.위 내용은
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.