简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > HTML 튜토리얼 > 본문

HTML 요소 중첩 문제

高洛峰
풀어 주다： 2017-02-15 14:03:59
원래의
2145명이 탐색했습니다.

HTML 요소 중첩 문제

요소 중첩

<p>블록 요소는 인라인 요소 또는 某些블록 요소를 포함할 수 있지만 인라인 요소는 블록 요소를 포함할 수 없으며 기타 인라인 요소만 포함할 수 있습니다.

P 요소 중첩 문제

<p>
  <p></p>
</p>
로그인 후 복사
<p> P 요소의 p 및 기타 블록 수준 요소 중첩은 브라우저에서 다음과 같이 구문 분석됩니다.

<p>HTML元素嵌套问题

<p>요소 끝에 빈 <p></p>이 있는 것을 볼 수 있습니다.

<p> 문의 결과 p元素는 块级元素 내에 포장할 수 없는 것으로 확인되었습니다.
우리가 사용하는 DTD에서는 块级元素을 <p> 안에 넣을 수 없다고 규정하고 일부 브라우저에서는 다음 쓰기 방법을 허용합니다. 

<p>这是一个段落的开始
<p>这是另一个段落的开始
로그인 후 복사
<p><p> 태그가 없으면 태그가 끝나게 됩니다. 실제로 브라우저는 다음과 같이 처리합니다. 

<p>这是一个段落的开始</p>
<p>这是另一个段落的开始</p>
로그인 후 복사
<p> 이는 브라우저의 <p></p> 끝에 추가 공간이 있는 이유이기도 합니다.

블록 수준 요소 중첩 문제

<p>먼저 모든 블록 요소를 다시 여러 수준으로 나눌 수 있습니다. 우리는 이미 <html>가 가장 바깥 수준에 있고 <html>가 그 다음이라는 것을 알고 있습니다. 레벨에는 <head>、<body>、<frameset>、<noframes>만 있고 시각적 요소는 <body>에만 나타날 것이라는 것을 이미 알고 있으므로 <body>를 첫 번째 레벨에 넣습니다. 그런 다음 不可以自由嵌套의 요소를 세 번째 수준에 배치하고 나머지 요소는 두 번째 수준에 배치합니다. 자유롭게 중첩될 수 없는 요소는 인라인 요소만 배치할 수 있는 요소입니다. 여기에는 제목 태그의 경우 <h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<caption>, 단락 구분 기호의 경우 <p> 및 특수 요소인 <hr>( 목록 요소 <dt>)의 하위 수준에만 존재합니다. <dl>

<p>은 인라인 요소만 중첩할 수 있는 블록 수준 요소를 나타냅니다. 三级元素 역시 그 중 하나입니다. p

2차 수준 요소를 자유롭게 중첩할 수 있는 이유는 무엇인가요?

이를 컨테이너(또는 상자)로 생각할 수 있으며 이러한 컨테이너의 크기는 자유롭게 변경할 수 있습니다. <p>은 <ul> 안에 삽입될 수 있고, <p>은 <p> 안에 삽입될 수 있습니다. <li>

HTML에는 매우 특별한 여러 요소가 있습니다. <p>, 해당 하위 수준은 지정된 요소여야 하고, <ul>、
    、<dl>、<table>>의 하위 수준은 <ul>、이어야 합니다. <li>의 하위 수준은 <dl> 또는 <dt>이어야 하며, <dd>의 하위 수준은 <table> 또는 <caption>이어야 하며, 하위 수준은 <thead>、<tfoot>、<tbody>이어야 합니다(<tr>은 <tr>)에만 존재하며 그 뒤에 콘텐츠를 배치할 수 있는 <thead>、<tfoot>、<tbody> 또는 <td>이 옵니다. <th>

    인라인 요소

    사실 인라인 요소 중에는 너비와 너비를 정의할 수 있는 특별한 요소가 여러 개 있습니다. 키. <p> 브라우저에서는 모든 요소가 너비와 높이를 정의할 수 있지만 이는 <img>、<input> 자체 표준이며 모든 브라우저가 이를 지원하는 것은 아닙니다. IE는 이를 대체 요소라고 부릅니다. 인라인 블록, 이러한 요소는 인라인에 속하지만 특정 블록을 갖습니다(너비와 높이를 설정할 수 있음). 또한 모든 요소에 CSS 속성인 display:inline-block을 지정할 수 있습니다. IE인라인 블록을 갖고 있는 요소는 그렇게 해서는 안 됩니다! W3C
    더 많은 HTML 요소 중첩 문제 및 관련 기사를 보려면 PHP 중국어 웹사이트를 주목하세요!

    <p></p>

관련 라벨：
HTML 元素嵌套
원천：php.cn
이전 기사：파비콘은 단순한 아이콘 그 이상입니다 다음 기사：HTML의 선택 옵션을 숨길 수 없는 문제를 완벽하게 해결합니다.
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
반복을 통해 HTML 테이블에 객체의 중첩 배열 표시 중첩된 개체 배열이 포함된 다음 입력이 있습니다. summary는 상위 개체 배열이고, run_type은 중첩된 개체 배열입니다. letinput={"s...
에서 2024-04-05 14:11:42
0
1
1373
PDF 파일에서 HTML5 및 Javascript를 실행할 수 있습니까? PDF에 포함되므로 어떤 컴퓨터에서도 차단되지 않는 프로그램을 만들어 보자는 어리석은 생각이 있습니다(Javascript가 PDF에서 실행될 수 있다고 들었습니다...
에서 2024-04-05 12:57:00
0
1
456
최종 사용자의 현재 선택에 따라 선택 상자에서 선택한 옵션을 이동하려면 jquery 스크립트가 필요합니다. 최종 사용자가 선택 상자 요소를 통해 항목의 순위를 지정할 수 있는 HTML 페이지가 있습니다. 간단한 데모를 보려면 바이올린을 참조하세요: https://jsf...
에서 2024-04-04 18:40:04
0
1
3528
Selenium을 사용하여 클래스에서 URL을 클릭하고 정의하고 싶습니다. 오늘은 또 다른 팁이 필요해요. 저는 Python/Selenium 코드를 작성하려고 하는데 아이디어는 www.thewebsiteIwantoclickon을 클릭하는...
에서 2024-04-04 14:14:44
0
1
3492
재작성된 제목: 크기를 조정할 때 고정 HTML 정사각형 또는 원 요소를 가로 및 세로 중앙에 배치 다양한 크기의 정사각형 또는 원형 고정 HTML 요소를 가로 및 세로로 중앙에 배치하는 방법은 무엇입니까? 너비와 높이가 동일하게 유지되어야 한다는 사실 때문에 ...
에서 2024-04-04 12:31:51
0
1
322
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！