知道了怎么写和查看代码，是不是很激动呢，那么我们就赶紧来认识更多的html标签（标签：使用<>包起来的内容），以便页面可以展示更多的内容吧： 将下面这些标签放到body中就可以哦，如果不会，可以先查看我的上一篇博客：开始html
- h系列的标签(Header)：h1,h2,h3,h4,h5,h6
- 作用：把页面上的文字加上标题的语义 h1,h2,h3,h4,h5,h6:将文字放大，加粗.并且逐渐变小。（h1标签是最大的。）
- 代码：
<h1>这是h1标题</h1>- 注意：一个页面只能有一个h1标签。
- p标签(Paragraph)：段落标签
- 作用：给页面的上一段文字加上段落的说语义
- 代码：
<p>这是段落</p>- 特点：页面上的一个段落，单独占一行，并且与上下内容之间存在距离。
- hr标签(Horizontal Rule)
- 作用：在页面显示一条横线。
- 代码：
<hr />- 特点：在页面显示一条横线，默认占整行。
- br标签(break)
- 作用：换行。
- 代码：
<br />- 特点：换行。
- b(Bold),u(Underlined),i(Italic),s(Strikethrough),strong,em,del,ins
- 作用： b：加粗 u: 下划线 i: 倾斜 s: 删除线
- 建议不要使用，因为这些标签没有语义。
- 作用：strong:加粗 ins:下划线 em:倾斜 del:删除线
- 可以使用
- Img标签(image)：
- 作用：在页面显示一张图片。
- 代码：
<img src=”图片的路径” />- 特点：就是显示图片。
- 属性：
| 属性名称 | 作用 |
|---|---|
| src | 图片的路径 |
| alt | 如果图片加载不出来会显示它的文字 |
| title | 当鼠标放到图片上时出现的文字 |
- a标签(Anchor)：锚
- a标签的其它名称：超级链接，超链接，锚链接。
- 作用：可以在一个页面跳转到另一个页面。
- 代码：
<a href=”页面的路径”></a>- 注意：在a标签之内必须要写上文字，如果没有，那么这个标签在页面上找不到。
- a标签的其它用法：
-
- 可以不跳转（跳转到当前页面）href=”#”
-
- 可以跳转到另外的页面。
-
- 可以在当前页面进行定位。
- A.设置a标签的href属性为“#id名”，
- B.在页面的指定位置加入一个目标标签（可以是任意标签）
- C.必须给这个标签设置一个id名：<p id=”mubiao”>这是目标</p>
-
- 在跳转的页面进行定位。
-
- 可以进行下载。（强烈不推荐使用）
- a标签的属性：
| 属性名称 | 作用 |
|---|---|
| href | a标签跳转的目标地址 |
| target | _blank:保留原始页面，再进行跳转 |
| _self | 在当前页面进行跳转 |
| base | 为页面上所有的a标签设置跳转的方式（base标签一般放在titile标签下面） |
- 列表：分为无序列表和有序列表和自定义列表
-
无序列表
-
作用：显示一列没有排列顺序的数据。
-
语义：就是一组没有顺序的数据。
-
代码：
<ul> <li></li> <li></li> </ul>
-
-
注意：
- 1.0无序列表中的数据没有先后顺序之分。
- 2.0ul标签最好不要单独出现。
- 3.0ul标签是用来管理li标签。
- 4.0ul标签中只能放li标签。
- 5.0li标签中可以放其它标签。
- 6.0li标签是一个容器。
-
- 有序列表：
-
作用：显示一段有顺序的数据。
-
语义：一组有顺序的数据。
-
代码：ol:Ordered List
<ol> <li></li> <li></li> </ol> -
注意：有序列表中的所有数据都是顺序的。现在一般情况下ul标签用的比较多，ol标签用的比较少。
-
自定义列表：
-
作用：显示一段数据，格式自己定义
-
代码：dl:Definition List dt:Definition Term dd:Definition Description
<dl> <dt></dt> <dd></dd> </dl>
-
-
- 表格
- 作用：用来将数据以表格形式显示出来。
- 代码：
<table> <tr> <td></td> <td></td> </tr> <tr> <td></td> <td></td> </tr> </table> ```
- 表格属性
| 属性名称 | 作用 |
|---|---|
| border | 给表格加上了边框 |
| width | 给表格设置宽 |
| height | 给表格设置高 |
| cellspacing | 规定单元格之间的空白 |
| cellpadding | 规定单元边沿与其内容之间的空白 |
- 注意：虽然我们可以使用table中的标签来设置标签的一些样式，但最好不要用，因为将来凡是和样式相关的内容都是由css来设置的。
怎么样，赶紧试一试吧，更多的标签可以查看html标签大全。
- 补充表格中的其他标签：
| 标签 | 作用 | 特点 |
|---|---|---|
| <th></th> | 起到表头的作用 | 其中的文字加粗，居中 |
| <caption></caption> | 给表格设置标题 | 在表格的最上面显示标题 |
| <thead></thead> | 用来存放当前列的表头 | 如果没有加css页面默认将表头中的高度设置变小 |
| <tbody></tbody> | 一般用来存放页面中的主体数据 | 如果不写会自动加上 |
| <tfoot></tfoot> | 一般情况不会出现 |
- form表单
- 作用：用来收集信息，将来提交到服务器。
- 表单元素：
- 属性作用
| 标签 | 属性 | 作用 |
|---|---|---|
| input | type | text:文本框,password：密码框,hidden:隐藏域,radio:单选框,checkbox:多选框,button:按钮,reset:重置,image:图片按钮,submit:提交 |
| value | 用于设置默认值(text,password,button) | |
| select | option | 下拉框 |
| textarea | 文本域 |
- 注意点：如果想要多个radio或者checkbox组成一个选择集合，那么必须给每个radio以及checkbox都设置相同name属性。 那么如何给radio,checkbox设置默认值呢？设置另外一个属性：checked=‘checked’； 如何给下拉框设置默认值呢？selected='selected'; 为什么提交之后没有将数据显示在地址栏上呢？必须要给需要提交的标签加上name属性。
另外，我再补充一下html固定结构相关的说明哈：
- Html标签：作用所有html中标签的一个根节点。
- Head标签：作用：用于存放：title,meta,base,style,script,link
- 注意：每个head标签中都必须有一个有title标签，其它的可选。
- Body标签：作用：用于存放所有的html的结构标签：p,h,a,b,u,i,s,em,del,ins,strong,ul,li,ol,
- Title标签：作用：让页面拥有一个属于自己的标题。
- meta 标签：
- 常用用法：
- 1.Description：可以描述页面，可以用来使用百度程序（网络爬虫）来收录关键信息，以此提高页面的排名。
- 2.Keywords：关键词，可以用来提高页。面的关健词的比重（前升排名的一种方式。）
- 3.字符集（编码格式）：
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">- 说明：Charset（字符集的格式）：UTF-8. - 注意：字符集（文字在电脑是存储的字典）：
电脑是不能直接存储文字的，一般情况下电脑存储的是这个文字在“字典”里对应的位置。 gb2313---->gbk;国标2313---->国标扩。 那么，怎样通过浏览器查看页面上的标签呢？ 再开发人员工具（如何打开：打开浏览器开发人员工具）中，选择Elements,鼠标放上去就可以查看啦！
如有问题，欢迎指正哈！
627
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
