>웹 프론트엔드 >CSS 튜토리얼 >인라인 위치 지정에 영향을 주지 않고 CSS를 사용하여 `h4` 요소 뒤에 줄 바꿈을 추가하려면 어떻게 해야 합니까?

인라인 위치 지정에 영향을 주지 않고 CSS를 사용하여 `h4` 요소 뒤에 줄 바꿈을 추가하려면 어떻게 해야 합니까?

Mary-Kate Olsen
Mary-Kate Olsen원래의
2024-10-30 00:30:021035검색

How can I add a line break after an `h4` element using CSS without affecting its inline positioning?

CSS를 사용하여 줄 바꿈 만들기

CSS를 사용하면 추가 HTML 요소를 통합하지 않고 콘텐츠에 줄 바꿈을 삽입할 수 있습니다. 특정 시나리오에서는

뒤에 줄바꿈을 추가하려고 합니다. 요소의 인라인 위치 지정을 방해하지 않고 유지하세요.

이를 수행하려면 다음 CSS 코드를 사용하세요.

<code class="css">h4 {
  display: inline;
}
h4:after {
  content: "\a";
  white-space: pre;
}</code>

이 코드는

요소 뒤에는 보이지 않는 문자 "a"가 추가됩니다. 공백 속성을 pre로 설정하면 공백 문자를 존중하고 의도한 대로 줄 바꿈을 표시합니다.

개념을 더 자세히 이해하려면 https://stackoverflow.com/a/66000/509752를 참조하세요. 여기에 사용된 기술에 대한 심층적인 설명.

위 내용은 인라인 위치 지정에 영향을 주지 않고 CSS를 사용하여 `h4` 요소 뒤에 줄 바꿈을 추가하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.