요약:
1. 블록 요소에는 인라인 요소 또는 특정 블록 요소가 포함될 수 있습니다(위의 예는 실제로 잘못된 사용입니다---> 를 안에 넣습니다). )
2, 사용을 위해 DTD는 블록 수준 요소를 규정합니다.
3. 핵심 사항: 세 가지 수준의 블록 요소
4. 인라인 요소에는 없는 너비와 높이가 있습니다. W3C는 이를 대체 요소로 정의합니다. 요소를 display:inline-block으로 설정하면 대체 요소의 효과가 시뮬레이션됩니다. ㅋㅋㅋ
하지만 많은 오류가 발생하여 매우 놀랐습니다. 그래서 이유를 조사한 결과 p가 블록 수준 요소 P 내에 중첩될 수 없다는 것을 발견했습니다.
심층 조사: HTML의 거의 모든 요소는 인라인 요소이거나 블록 요소이므로 먼저 인라인 요소와 블록라인 블록 요소를 이해해 보겠습니다.
in-line이라는 단어는 inline, inline, inline, line level 등 다양한 해석이 있습니다. 그러나 여기서는 모두 동일한 의미를 의미합니다. 여기서는 관례적인 이름인 inline Union을 선택합니다. 먼저 아래 예를 보면 둘 사이의 차이점을 이해할 수 있을 것입니다. 블록 요소와 인라인 요소 사이의 차이점을 테스트해 보세요.
블록 요소
효과는 다음과 같습니다.
위에서 예를 들어
는 자체적으로 새 줄을 생성하지만 은 CSS 렌더링이 없는 경우에만 적용되며, CSS를 통해 p를 정의할 수도 있습니다. 블록 요소는 HTML에서 임의로 변환할 수 없습니다. 블록 요소에는 인라인 요소나 특정 블록 요소가 포함될 수 있습니다(위의 예는 실제로 잘못된 사용입니다---> 안에 를 넣었습니다). , 이것을 다시 살펴보세요: 를 포함할 수도 있습니다. 다음은 인라인 요소에 블록 요소가 포함되어서는 안 되기 때문에 잘못된 것입니다. <h2>我喜欢在<a href="#" >经典论坛</a>讨论Web标准的原因。</h2>
여기서 인라인 요소는 를 포함하는 데 아무런 문제가 없습니다. 마찬가지로
<a href="#"> <h2>这样是错误的用法!</h2></a>
일부 블록 요소가 다른 블록 요소를 포함할 수 없는 경우가 있습니다. 예:
<p>测试文字 <ul> <li>现阶段是不能这样用的,要等到XHTML 2.0才可以这样用。</li> </ul> 测试文字 </p>
그리고 이건 괜찮습니다.
<ul> <li><p>这样是可以的</p></li> </ul>
왜요? 우리가 사용하는 DTD에서는 블록 수준 요소를
안에 배치할 수 없다고 규정하고 일부 브라우저에서는 이 쓰기 방법을 허용합니다.
<p>这是一个段落的开始 <p>这是另一个段落的开始
当一个 签还没结束时,遇到下一个块元素就会把自己结束掉,其实浏览器是把它们处理成这样:
<p>这是一个段落的开始</p> <p>这是另一个段落的开始</p>
所以刚才那样的写法会变成这样:
<p>测试文字</p> <ul> <li>现阶段是不能这样用的,要等到XHTML 2.0才可以这样用。</li> </ul> 测试文字<p></p>
这也是跟刚才说第一个例子中 里面放 不合理是同一个道理。
以下为重点理解部分:
那哪些块元素里面不能放哪些块元素呢?我知道你有这个疑问,也知道我仅仅列一张清单你不好记住它们。我们可以先把所有的块元素再次划分成几个级别的,我们已经知道是在最外层,下一级里面只会有<head>、、
为什么说第二级的元素可以自由嵌套呢?我们可以把它们看成是一些容器(或者说是盒子), 这些容器的大小可以自由变化,例如我们可以把 里面,也可以把 嵌在嵌在
HTML에는 이것은 또한 많은 사람들이 W3C 검증을 통과하지 못하는 이유이기도 합니다. 잘못된 요소 중첩입니다. 그러나 오류를 표시하는 레이블을 할 수 없습니다. 확인을 위해 맹목적으로 확인하는 것은 가 신이 아니며 는 semantic 태그를 대체할 수 없습니다. 실제로 인라인 요소 중에서는 구별할 수 있습니다. 특별한 여러 요소(, 등)가 있으며 이러한 요소를 정의할 수 있습니다. 너비와 높이. 비록 IE에서는
브라우저에서 모든 요소는 너비와 높이를 정의할 수 있지만 이는 IE 자체 표준이며 모든 브라우저가 이를 지원하는 것은 아닙니다. W3C는 이를 대체 요소라고 부릅니다. 번역에 적합한 단어를 찾을 수 없습니다. 해당 요소는 In-line에 속합니다. "desplay: inline-block의 적용"에서 언급한 inline-block은 실제로 다른 요소를 대체된 요소로 시뮬레이션할 수 있도록 해줍니다. . 나중에 배우려면 기다려주세요. 위 내용은 HTML의 P 태그에 DIV 태그를 포함할 수 없는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!,
,
,
과 같은 몇 가지 특수 요소가 있으며, 해당 하위 수준은 지정된 요소여야 합니다. ;ol>은
의 하위 레벨이어야 합니다;
의 하위 레벨은
이어야 합니다(
은 ,
,
에만 존재함). 콘텐츠를 배치할 수 있는 위치는