>웹 프론트엔드 >CSS 튜토리얼 >`` 요소의 표시 속성은 익명 블록 상자의 동작과 그 안에 있는 콘텐츠의 스타일에 어떤 영향을 줍니까?

`` 요소의 표시 속성은 익명 블록 상자의 동작과 그 안에 있는 콘텐츠의 스타일에 어떤 영향을 줍니까?

DDD
DDD원래의
2024-10-25 01:49:30861검색

How does the display property of the `` element affect the behavior of anonymous block boxes and the styling of content within them?

display:block Inside display:inline

다음 시나리오를 고려해보세요. display:inline 및

로 스타일이 지정된 요소 디스플레이:블록으로 스타일이 지정된 요소입니다. CSS 2.1 사양에 따르면 이 설정의 결과는 다음과 같습니다.

"

앞의 익명 텍스트 주위에 익명 블록 상자를 포함하는 주위의 익명 블록 상자,

; 블록 상자 및

" 뒤의 익명 텍스트 주위에 또 다른 익명 블록 상자가 있습니다.

시각적으로 결과 상자는 다음과 같이 표시됩니다.

+- anonymous block box around body ---+
| +- anonymous block box around text 1-+ |
| |                                 + |
| +---------------------------------+ |
|                                     |
| +- P block box -------------------+ |
| |                                 + |
| +---------------------------------+ |
|                                     |
| +- anonymous block box around text 2-+ |
| |                                 + |
| +---------------------------------+ |
+-------------------------------------+

그러나 이 설정은 의 설정과 다릅니다. CSS 2.1 사양에 따라:

"익명 블록 상자를 생성하는 요소에 설정된 속성은 해당 요소의 상자와 콘텐츠에 계속 적용됩니다."

이러한 구별은 속성을 통해 볼 수 있습니다. "테두리 스타일"처럼요. 의 경우 테두리는

앞뒤의 익명 텍스트를 둘러쌉니다. 요소를 삭제하고

요소는 변경되지 않았습니다. 대조적으로, 의 경우 테두리는

요소.

위 내용은 `` 요소의 표시 속성은 익명 블록 상자의 동작과 그 안에 있는 콘텐츠의 스타일에 어떤 영향을 줍니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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