이 노트는 가장 기본적인 태그와 사용 루틴을 기록하여 향후 통합을 용이하게 하고 다른 동료들이 참조할 수 있도록 간단한 예를 제공합니다. 만리장성은 HTML처럼 사소한 것입니다. 5 단계적으로 진행해야합니다. 다른 좋은 방법은 없습니다!
또한 내 프로그래밍 환경은 다음과 같이 구성됩니다. HTML 5 편집 IDE는 대괄호를 사용하고, php는 Notepad++를 사용합니다.
루틴 1: hello world
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第一个教程</title>
</head>
<body>
<h1>hello world</h1>
</body>
</html>설명:
8b05045a5be5764f313ed5b9168a17e6은 HTML5 문서로 선언됩니다.
100db36a723c770d327fc0aef2ce13b1 요소는 HTML 페이지의 루트 요소입니다.
ef0c2772b76bfffb9337fc47aea795ed 요소에는 문서의 메타데이터가 포함됩니다.
요소는 문서의 제목을 설명합니다. <p>6c04bd5ca3fcae76e30b72ad730ca86d 🎜></p>4a249f0d628e2318394fd9b75b4636b1 요소는 큰 제목을 정의합니다<p></p>e388a4556c0f65e1904146cc1a846bee 요소는 단락을 정의합니다<p></p>루틴 2: 제목<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<h1>我的标题1</h1>
<h2>我的标题2</h2>
<h3>我的标题3</h3>
<h4>我的标题4</h4>
<h5>我的标题5</h5>
<h6>我的标题6</h6>
</body>
</html></pre></p>루틴 3: html 단락<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<h1>我的标题1</h1>
<p>这是第一个段落</p>
<p>这是第二个段落</p>
</body>
</html></pre></p>루틴 4: html 링크<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<a href="http://www.runoob.com">网易</a>
</body>
</html></pre></p>루틴 5 html 이미지<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<img src="screenshots/quick-edit.png" width="200" height="200">
</body>
</html></pre></p>루틴 6: 웹 페이지에 줄 추가<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<img src="screenshots/quick-edit.png" width="200" height="200">
<hr>
<p>段落1</p>
<hr>
<p>段落2</p>
<hr>
</body>
</html></pre></p>루틴 7: 프로그램에 주석 추가<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<!-- 在网页上显示图片 -->
<img src="screenshots/quick-edit.png" width="200" height="200">
<hr>
<!-- 段落1的内容 -->
<p>段落1</p>
<hr>
<p>段落2</p>
<hr>
</body>
</html></pre></p>루틴 8 글꼴 서식 출력<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<b>加粗文本</b><br><br>
<i>斜体文本</i><br><br>
<code>电脑自动输出</code><br><br> 这是 <sub> 下标</sub> 和 <sup> 上标</sup>
</body>
</html></pre></p>루틴 9 html css<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的例程</title>
</head>
<body>
<a href="http://www.163,com/" >访问网易!</a>
<h1 style="text-align:center">居中对齐</h1>
</body>
</html></pre></p>루틴 10 테이블<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的例程</title>
</head>
<body>
<table border="1">
<tr>
<th>头部1</th>
<th>头部2</th>
</tr>
<tr>
<td>第1行第1列</td>
<td>第1行第2列</td>
</tr>
<tr>
<td>第2行第1列</td>
<td>第2行第2列</td>
</tr>
</table>
</body>
</html></pre></p>루틴 11 순서 없음 목록<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的例程</title>
</head>
<body>
<ul>
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ul>
</body>
</html></pre></p>루틴 12: 순서가 지정된 목록<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的例程</title>
</head>
<body>
<ol>
<li>呵呵</li>
<li>呵呵</li>
<li>呵呵</li>
</ol>
<ol start="50">
<li>呵呵</li>
<li>呵呵</li>
<li>呵呵</li>
</ol>
</body>
</html></pre></p>루틴 13: 블록 영역<p><pre class="brush:html;toolbar:false"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的例程</title>
</head>
<body>
<div style="color:#0000FF">
<h3>这是一个在 div 元素中的标题。</h3>
<p>这是一个在 div 元素中的文本。</p>
</div>
</body>
</html></pre></p>
위 내용은 기본 HTML 루틴에 대한 자세한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
