一些基础元素
HTML 元素要以开始标签起始,以结束标签终止
常用元素 | 标签 |
---|---|
标题 | < h >< /h > |
段落 | < p >< /p> |
链接 | < a href=“链接内容”>名称< /a > |
图像 | < img src=“选择图片” width=“调整大小” height=“调整大小” /> |
根据以上的基础标签,做一个简单的人物简介
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>人物简介</h1>
<p>姓名:哪吒</p>
<p>性别:男</p>
<p>登场作品:《哪吒之魔童降世》</p>
<p>人物照片:</p>
<img src="../image/nezha.jpg"width="200">
<p>相关链接</p>
<a href="https://baike.baidu.com/item/%E5%93%AA%E5%90%92/35250?fr=aladdin">哪吒(中国古代人物)百度百科</a>
</body>
</html>
< html > 元素定义了整个 HTML 文档。
< body > 元素定义了 HTML 文档的主体。
< title >描述了元素的额外信息 (作为工具条使用)
浏览器运行结果
表格、列表、区块
1.表格
< table > 标签定义表格
< th > 标签定义表格的表头
< tr > 标签定义表格分成的每行
< td > 标签定义每行分成的单元格
字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
2.列表
无序列表使用 < ul > 标签
有序列表始于 < o l> 标签
每个列表项始于 < li > 标签
自定义列表以 < dl > 标签开始,每个自定义列表项以 < dt > 开始,每个自定义列表项的定义以 < dd > 开始
3.区块
html区块元素: 大多数html元素为块级元素或内联元素
块级元素: 通常在浏览器显示时会以新行开始(和结束)
例如: < ul > < p > < h1 > < table >等
< div > 元素定义了文档的区域,块级元素
内联元素: 在显示时不会以新的一行开始
例如: < a > < img > < td >等
< span > 元素用来组合文档中的行内元素, 内联元素
简单的表格、列表应用
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h>表格、列表、区块</h>
<p>1.表格</p>
<table border="1">
<tr>
<th>标签</th>
<th>描述</th>
</tr>
<tr>
<td>br</td>
<td>定义简单的折行。</td>
</tr>
<tr>
<td>hr</td>
<td>定义水平线。</td>
</tr>
</table>
<p>2.列表</p>
<p>无序列表</p>
<ul>
<li>HTML颜色</li>
<li>HTML布局</li>
</ul>
<p>有序列表</p>
<ol>
<li>HTML颜色</li>
<li>HTML布局</li>
</ol>
<p>自定义列表</p>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
</body>
</html>
浏览器运行结果