ホームページ > 記事 > ウェブフロントエンド > 基本的な HTML ルーチンの詳細な紹介
基本的な HTML ルーチンの詳細な紹介
- 高洛峰オリジナル
- 2017-03-23 10:15:551733ブラウズ
このメモは、将来の統合を容易にするため、また、万里の長城は幼い頃から始まり、HTML 5 に必要なような些細な例を示すために、最も基本的なタグと使用ルーチンを記録します。それ以外に良い方法はありません。
さらに、私のプログラミング環境は次のように構成されています: html 5 編集 IDE は Brackets を使用し、php は Notepad ++ を使用します。 ; HTML5 ドキュメントとして宣言されます
100db36a723c770d327fc0aef2ce13b1 要素は HTML ページのルート要素です
93f0f5c25f18dab9d176bd4f6de5d30e 要素はドキュメントのタイトルを記述します
b2386ffb911b14667cb8f0f91ea547a7ドキュメント
6c04bd5ca3fcae76e30b72ad730ca86d 要素には、表示されるページコンテンツが含まれます
4a249f0d628e2318394fd9b75b4636b1 この要素は、段落を定義します
ルーチン 2: タイトル
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第一个教程</title>
</head>
<body>
<h1>hello world</h1>
</body>
</html>ルーチン 3: html段落
<!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>ルーチン4: HTMLリンク
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<h1>我的标题1</h1>
<p>这是第一个段落</p>
<p>这是第二个段落</p>
</body>
</html>ルーチン5 HTML画像
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<a href="http://www.runoob.com">网易</a>
</body>
</html>ルーチン6: Webページに行を追加
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>第二个例子</title>
</head>
<body>
<img src="screenshots/quick-edit.png" width="200" height="200">
</body>
</html>ルーチン7: プログラムにコメントを追加
<!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>ルーチン8 フォントの書式設定出力
<!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> ルーチン 9 html css
<!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>ルーチン 10 テーブル
<!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>
ルーチン 11 順序なしリスト
<!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>ルーチン 12: 順序付きリスト
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的例程</title>
</head>
<body>
<ul>
<li>第一</li>
<li>第二</li>
<li>第三</li>
</ul>
</body>
</html>ルーチン 13: ブロックエリア
<!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>以上が基本的な HTML ルーチンの詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。