html

摘要

HTML基本语法

基本语法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>c.isme.pub</title>
</head>
<body>
<h1>我的第一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>
<p>我的第一个段落。</p>
<a href="https://c.isme.pub">这是一个链接</a>
<img loading="lazy" src="/images/logo.png" width="258" height="39" />
<!-- 换行 -->
<br>
<!-- 水平线 -->
<hr>
<p>这个<br>段落<br>演示了分行的效果</p>




</body>
</html>

表格

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

列表

无序

1
2
3
4
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

有序

1
2
3
4
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

区块

定义了文档的区域,块级 (block-level)
用来组合文档中的行内元素, 内联元素(inline)

表单

文本域

1
2
3
4
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>

密码段

1
2
3
<form>
Password: <input type="password" name="pwd">
</form>

单选按钮

1
2
3
4
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

复选框

1
2
3
4
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>

提交按钮

1
2
3
4
<form name="input" action="html_form_action.php" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>