Web基本教程~01.HTML基础元素
Web基本教程~01.HTML基础元素
一 : 标题
标题（Heading）是通过 < h1 >- < h6 > 标签进行定义的。
< h1 > 定义最大的标题。 < h6 > 定义最小的标题。
<html>
<head>
<title>title>
<meta charset="utf-8" />
head>
<body>
<h1>标题Ah1>
<h2>标题Bh2>
<h3>标题Ch3>
<h4>标题Dh4>
<h5>标题Eh5>
<h6>标题Fh6>
body>
html>
标题来呈现文档结构是很重要的,因为用户可以通过标题来快速浏览您的网页。
将 h1 用作主标题，其后是 h2，再其次是 h3，以此 类推
二 : 段落
段落是通过 < p > 标签定义的。如果您希望在不产生一个新段落的情况下进行换行（新行），请使用 < br > 标签
<p>这是一个段落 p>
<br/>
<p>br标签可以实现换行p>
三 : 水平线
< hr/ > 标签在 HTML 页面中创建水平线可用于分隔内容。
<hr color="" width="" size="" align=""/>
color：设置水平线的颜色
width：设置水平线的长度
size：设置水平线的高度
align：设置水平线的对齐方式（默认居中），可取值 left | right
四 : 图片
< img > 标签定义 HTML 页面中的图像。
<img src="" alt="" title="" width="" height=""/>
src：路径（相对路径、绝对路径）
Alt：规定图像的替代文本
Width：规定图像的宽度
Height：规定图像的高度
Title：鼠标悬停在图片上给予提示
五 : 超链接
HTML 使用标签 < a >来设置超文本链接。在标签< a > 中使用了 href 属性来描述链接的地址。
<a href="https://www.baidu.com/">跳转到百度a>
六 : 文本格式化标签
<body>
<b>粗体文本b>
<em>着重文字em>
<i>斜体字i>
<small>小号字small>
<strong>加重语句strong>
<sub>下标字sub>
<sup>上标字sup>
<ins>插入字ins>
<del>删除字del>
body>
七 : 列表
无序列表
无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。无序列表使用
- 标签
<ul type="square">
<li>无序列表li>
<li>无序列表li>
ul>
type 拥有的选项
disc 默认实心圆
circle 空心圆
square 小方块
none 不显示
有序列表
<ol type="a">
<li>有序列表li>
<li>有序列表li>
<li>有序列表li>
ol>
< ol >< li >的属性 type 拥有的选项
1 表示列表项目用数字标号（1,2,3...）
a 表示列表项目用小写字母标号（a,b,c...）
A 表示列表项目用大写字母标号（A,B,C...）
i 表示列表项目用小写罗马数字标号（i,ii,iii...）
I 表示列表项目用大写罗马数字标号（I,II,III...）
自定义列表
自定义列表不仅仅是一列项目，而是项目及其注释的组合。自定义列表以 < dl > 标签开始。每个自定义列表项以 < dt > 开始。每个自定义列表项 的定义以 < dd > 开始。
<body>
<dl>
<dt>animaldt>
<dd>- is dogdd>
<dt>footdt>
<dd>- i love appledd>
dl>
body>
八 : 表格
表格在数据展示方面非常简单，并且表现优秀，通过与 CSS 的结合，可以让数据变得 更加美观和整齐。单元格中内容的填充间距通过 cellpadding(默认 1px)属性来设置，单元格与单元格之间的间距通过 cellspacing(默认 1px)属性来设置。一般表格的第一行是标题，并且是文本居中、加粗，将 td 换成 th。
<body>
<table border="1px" align="center" cellpadding="10" cellspacing="0">
<tr align="center">
<th>姓名th>
<th>年龄th>
<th>部门th>
tr>
<tr align="center">
<td>菠萝菠萝蜜td>
<td>21td>
<td rowspan="2">行合并td>
tr>
<tr>
<td colspan="2">列合并td>
tr>
table>
body>
