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

HTML 프로그래밍의 마크업과 문서구조에 대한 자세한 설명_HTML/Xhtml_웹페이지 제작

WBOY
풀어 주다： 2016-05-16 16:36:16
원래의
1351명이 탐색했습니다.

HTML로 콘텐츠를 표시하는 목적은 웹페이지에 의미를 부여하는 것입니다. 즉, 웹 페이지 콘텐츠에 사용자 에이전트가 이해할 수 있는 의미를 부여해야 합니다.

HTML은 콘텐츠를 다르게 표시하기 위해 태그 세트를 지정합니다. 각 태그는 포함된 내용에 대한 설명입니다. 가장 일반적으로 사용되는 HTML 설명은 제목, 단락, 링크 및 그림입니다. 현재 HTML에는 총 114개의 태그가 있지만 80/20 원칙에 따르면 이 중 25개 정도를 사용하면 마크업 요구 사항의 80%를 충족할 수 있습니다.

HTML의 최신 버전인 HTML5는 웹페이지의 전체 구조를 더욱 표준화하기 위해 관련 콘텐츠의 태그를 그룹화하는 데 사용되는 새로운 구조화된 태그 배치를 규정합니다. 이러한 새 태그에는

,

1. 태그 폐쇄

콘텐츠가 포함된 각 요소(예: 제목, 단락, 이미지)에 대해 두 가지 태그 방법이 있습니다. 콘텐츠가 텍스트인지 여부에 따라 하나는 닫는 태그를 사용하고 다른 하나는 태그를 지정하는 것입니다. 닫히지 않는 태그를 사용하세요.

1.1 텍스트에 닫는 태그 사용

예:

Hello, CSS!


1.2 참조된 콘텐츠에 자체 닫는 태그 사용

예: 이것은 내 개입니다. 팁:

자체 닫는 태그의 경우 XHTML 요구사항을 다음과 같이 작성해야 합니다.

XML/HTML 코드클립보드에 콘텐츠 복사
  1. <img src="images/dog.jpg " alt="이것은 내 개입니다." /> HTML5에서는 마지막 닫는 슬래시를 생략하고 다음과 같이 쓸 수 있습니다.


    XML/HTML 코드클립보드에 콘텐츠 복사
    1. <img src="images/dog.jpg " alt="이것은 내 개입니다." >

    2.속성

    팁: 시각 장애가 있는 사용자가 사용하는 스크린 리더는 alt 속성의 내용을 소리내어 읽어 주므로 태그의

    alt 속성에 사람들이 한눈에(또는 한눈에) 이해할 수 있는 내용을 추가하세요.

    3. 제목과 문단4. 복합요소

    HTML은 제목, 이미지, 단락과 같은 기본 콘텐츠 태그뿐만 아니라 목록, 표, 양식과 같은 복잡한 사용자 인터페이스 구성 요소를 생성하기 위한 태그도 지정합니다. 여러 개의

    태그로 구성됩니다.

    5. 중첩 태그

    간단히 말하면 하나의 태그를 다른 태그 안에 중첩하는 것입니다.

    6.HTML5 템플릿

    XML/HTML 코드
    클립보드에 콘텐츠 복사
    1. >  
    2. <html>  
    3.  <머리>  
    4.  <메타 문자 집합="utf- 8" />  
    5.  <제목>HTML 템플릿 제목>  
    6.  머리>  
    7.  <몸>  
    8.    
    9.  몸>  
    10. html>  

    7.块级원素화행内원素

    文档流效果：HTML 元素会按光它们各自在标记中流现的先后顺序，依次从页面上方流向下方.

        几乎所有HTML 元素的 디스플레이는 属性要么为 블록, 要么为 인라인입니다.

        块级元素（比如标题和段落）会互堆叠在一起沿页face向下排列，每个元素分别、一行。而行内元素（比如链接和사진) 则会互并列，只只会不足以并列的情况下才会折到下一行显示。

    유보적인 정보:

        块级元素盒子会扩展到与父元素同宽。

        行内元素盒子会 收缩包裹 其内容，并且会尽可能包紧。


    201581172030371.png (301×322)

    7.嵌套적 원素

    지금 标记中嵌套的是HTML标签，而屏幕上嵌套的则是一个个的盒子。

    8.文档对象模型
    中特定的位置，就可以选中상应的 HTML 元素，并修改其样式属性。


    简而言之, 就是通过 HTML 标记来构建 DOM, 然后在页face初次加载和用户与页face交互时, 使用 CSS 来修改 DOM.

관련 라벨：
html 标记
원천：php.cn
이전 기사：3초 후 자동으로 HTML 페이지로 이동하는 세 가지 일반적인 방법_HTML/Xhtml_웹페이지 제작 다음 기사：HTML 테이블 레이아웃의 실제 활용에 대한 자세한 설명_HTML/Xhtml_웹페이지 제작
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
PX가 REM 오류로 자동 변환  <style>html {   글꼴 크기: calc(100vw / 3.75);      }body {    글꼴 크기: 0.16rem;      }&l...
에서 2024-04-16 09:34:16
0
0
4687
페이지가 갑자기 CSS나 부트스트랩을 가져올 수 없습니다. 그래서 저는 페이지를 개발 중입니다. 어제 일부 작업을 했는데 잘 작동했고, 오늘은 나머지 작업을 계속했는데 모든 것이 괜찮습니다. 일반 HTML 페이지로 열려고...
에서 2024-04-06 21:58:04
0
1
800
CSS에서 페이지 하단의 신비한 공백을 해결하는 방법 Bootstrap과 D3를 사용하여 간단한 웹페이지를 구축하려고 하는데 하단의 공백을 모두 없애는 방법을 모르겠습니다. 나는 그것을 제거하고 싶다. 본문과 HTM...
에서 2024-04-06 20:22:15
0
1
454
Livewire 게으른 자리 표시자와 함께 laravel 구성 요소를 사용하는 방법 livewire3 자리 표시자 안에 내 laravel 구성 요소의 뼈대를 추가하고 싶습니다. 지금까지 시도한 작업: Laravel 구성 요소를 포함하는 Livew...
에서 2024-04-06 20:02:10
0
2
543
문자열을 HTML 코드(배열에서 생성됨)로 바꾸는 최상위 방법 다음과 같은 문자열이 주어지면...$htmlPattern="Usernameis:#name#andusercompanyis#company#";하위 ...
에서 2024-04-06 17:40:41
0
2
410
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！