HTML 요소
HTML 요소
HTML 요소란?
HTML 요소는 시작 태그부터 종료 태그까지의 모든 코드를 의미합니다.
예:
<p>단락 내용</p>
<p>은 시작 태그이고, </p> "단락 콘텐츠"는 요소 콘텐츠
<a> 링크 콘텐츠 </a>
<a>는 시작 태그이고, </a> "링크 콘텐츠"는 요소 콘텐츠
HTML 요소 구문
HTML 요소는 시작 태그로 시작합니다
종료 태그로 시작하는 HTML 요소 종료
요소의 내용은 여는 태그와 닫는 태그 사이의 내용입니다.
일부 HTML 요소에는 빈 내용(빈 내용)이 있습니다.
빈 요소는 여는 태그에서 수행됩니다. 닫기(여는 태그의 끝으로 끝남)
대부분의 HTML 요소는 속성을 가질 수 있습니다.
참고: 속성에 대한 자세한 내용은 다음을 참조하세요. 이 튜토리얼의 다음 장.
중첩 HTML 요소
<p대부분의 html="" 요소는 중첩될 수 있습니다(다른 ="" 요소를 포함할 수 있음).
네스팅이란 무엇인가요? 중첩 규칙은 무엇입니까?
중첩이란 블록 수준 요소(블록)가 완료될 때까지 인라인 요소(인라인)를 레이어별로 포함한다는 의미입니다.
HTML 문서는 중첩된 HTML 요소로 구성됩니다.
HTML 태그에는 블록 수준 요소(block)와 인라인 요소(inline)가 포함됩니다.
블록 수준 요소
는 일반적으로 웹사이트 아키텍처, 레이아웃 및 전달을 구축하는 데 사용됩니다. content... 다음 태그가 포함되어 있습니다
코드는 다음과 같습니다:
address, blockquote, center, dir, div, dl, dt, dd, fieldset, form, h1~h6 , hr, isindex, menu, noframes, noscript, ol, p, pre, table, ul
인라인 요소
일반적으로 "스타일, 위 첨자, 아래 첨자, 기준점 강조, 구별" 등을 위해 웹사이트 콘텐츠의 특정 세부 사항이나 부분에 사용됩니다. 다음 태그는 모두 인라인 요소입니다.
코드는 다음과 같습니다.
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, 글꼴, i, img, 입력, kbd, label, q, s, samp, 선택, 소형, 범위 , Strike, Strong, sub, sup, textarea, tt, u, var
HTML 태그
블록 요소에 대한 중첩 규칙은 Inline 요소 또는 일부 블록 요소를 포함할 수 있습니다. 그러나 인라인 요소는 블록 요소를 포함할 수 없습니다.
코드는 다음과 같습니다.
<div>< ;h1></h1>< ;p></p></div> —— 오른쪽<p> <a href="#"<span>< /span></a> ;/p> <p>
블록 수준 요소는 <p> 안에 배치할 수 없습니다. 코드는 다음과 같습니다.
li는 div 태그를 포함할 수 있습니다. - 이 항목은 따로 나열할 필요는 없지만 인터넷상에서 많은 분들이 이에 대해 헷갈려 하시는 경우가 많아서 여기서 간단히 설명하겠습니다.
Li 태그와 div 태그는 모두 콘텐츠를 로딩하는 컨테이너입니다. 상태이며 계층 구조가 없습니다(예: h1, h2는 엄격한 계층 구조입니다^_^). li 태그가 상위 태그에 연결되어 있다는 것을 알아야 합니다. ul과 ol을 모두 수용할 수 있습니다. 왜 일부 사람들은 li를 수용할 수 없다고 생각합니까? 사업부? 리가 너무 인색하다고 생각하지 마세요, 리가 꽤 야위어 보여도 사실 리는 마음이 넓습니다...
블록 수준의 요소와 블록 수준 요소, 인라인 요소 및 인라인 요소
를 병치하는 코드는 다음과 같습니다.
</div> —— 틀림
HTML 문서 인스턴스
<!DOCTYPE html>
<html>
<body>
<p>这里是测试事例</p>
</body>
</html>
위의 예에는 세 개의 HTML 요소가 포함되어 있습니다.
HTML 예제 분석
<p> 요소:
<p>여기 테스트가 있습니다. case
<p> 요소는 HTML 문서의 단락을 정의합니다.
이 요소에는 시작 태그 </p>가 있습니다.
요소 내용은 다음과 같습니다.
<body> :
<body>
<p>테스트 예시는 다음과 같습니다</p>
</body>
<body> 문서 본체.
이 요소에는 시작 태그 <body>와 종료 태그 </body>가 있습니다.
요소의 내용은 또 다른 HTML 요소(p 요소)입니다.
<html> 요소:
<html>
<body>
<p>다음은 테스트 사례입니다</p>
</body>
</html>
<html> 요소는 전체 HTML 문서를 정의합니다.
이 요소에는 시작 태그 <html>와 종료 태그 </html>가 있습니다.
요소의 내용은 또 다른 HTML 요소(body 요소)입니다.
닫는 태그를 잊지 마세요
닫는 태그를 사용하는 것을 잊어버린 경우에도 대부분의 브라우저는 HTML을 올바르게 표시합니다.
<p>이것은 문단입니다
<p>이것은 문단입니다
위 예는 닫는 태그가 선택사항이므로 브라우저에서도 정상적으로 표시될 수 있습니다.
그러나 이 접근 방식에 의존하지 마십시오. 닫는 태그를 사용하는 것을 잊어버리면 예상치 못한 결과나 오류가 발생할 수 있습니다.
HTML 빈 요소
내용이 없는 HTML 요소를 빈 요소라고 합니다. 빈 요소는 여는 태그에서 닫힙니다.
<br>은 닫는 태그가 없는 빈 요소입니다(<br> 태그 정의 래핑).
XHTML, XML 및 HTML의 향후 버전에서는 모든 요소를 닫아야 합니다.
<br />와 같이 여는 태그에 슬래시를 추가하는 것은 빈 요소를 닫는 올바른 방법이며 HTML, XHTML 및 XML에서 허용됩니다.
<br>는 모든 브라우저에서 유효하지만 <br />를 사용하는 것은 실제로는 장기적인 보장입니다.
HTML 팁: 소문자 태그 사용
HTML 태그는 대소문자를 구분하지 않습니다. <P>는 <p>와 동일합니다. 많은 웹사이트에서는 대문자 HTML 태그를 사용합니다.
W3C(World Wide Web Consortium)가 HTML 4에서 소문자를 권장하고 (X)HTML의 향후 버전에서는 필수로 지정하기 때문에 W3CSchool은 소문자 태그를 사용합니다.
이 요소에는 시작 태그 </p>가 있습니다.
요소 내용은 다음과 같습니다.
<p>테스트 예시는 다음과 같습니다</p>
</body>
이 요소에는 시작 태그 <body>와 종료 태그 </body>가 있습니다.
요소의 내용은 또 다른 HTML 요소(p 요소)입니다.
<body>
<p>다음은 테스트 사례입니다</p>
</body>
</html>
이 요소에는 시작 태그 <html>와 종료 태그 </html>가 있습니다.
요소의 내용은 또 다른 HTML 요소(body 요소)입니다.
<p>이것은 문단입니다
![프론트엔드 Vue3 실전 전투 [손글씨 vue 프로젝트]](https://img.php.cn/upload/course/000/000/068/639b12e98e0b5441.png)
![APIPOST 튜토리얼 [네트워크 통신 관련 기술 개념의 대중화]](https://img.php.cn/upload/course/000/000/068/63996f34c6c94370.png)
