一.HTNML常用标签
1.文体结构
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
注:
标签:由尖括号<>包围,通常成对出现
1.HTML标签分为单标签和双标签(成对出现)两种。
2.<!DOCTYPE html>:声明文档类型是符合HTML5标准的。
3.<html> </html>是文档开始与结束的标记,包含head和body两部分。
4.<head> </head>是HTML头部,包含title标签及文档的元(meta)数据(提供关于网站的各种信息)等,不在浏览器的文档窗口中显示。
5.<title> </title>是HTML标签结构标签,在浏览器标题栏显示。
6.<body> </body>是HTML主体标签,网页中包含的具体内容。
7.charset属性:字符集编码方式
2.常用标签
(1)标题(双标签)
h1--h6分别代表一级--六级标签
注:一个页面建议只有一对h1标签
每级标题大小不同,一级标题文字字号最大(如图)
(2)段落(双标签)
1.p标签会对其中内容进行自然分段,段落之间浏览器会默认添加一个段落间距
2.浏览器默认样式可能出现后几级标题比正文小的情况,可用css样式规定
3.对于HTML的源文件来说,会自动变连续空格为一个空格,且不换行.
(3)段内换行(单标签)
<br />
水平线标签:<hr>
空格字符: (特殊字符是由&开头, ;结束且全用小写)
(4)预留格式(双标签)
<pre></pre>
(5)超链接
<a></a>
内容分类:1.文字超链接2.图片超链接3.导航栏
格式:<a href="网址">进行超链接的文字或图片</a>
链接分类:1.链接到其他站点
2.连接到本站点其他网页
3.虚拟超链接:<a href="#"></a>
(6)拓展标签
<em></em>斜体标签
<b></b><strong></strong>加粗标签
<u></u><ins></ins>下划线标签
<s></s><del></del>删除线标签
<dl></dl>自定义列表标签
<dt>定义标题<dd>定义内容
<nav></nav>导航排版标签
<article></article>独立区域排版标签
(7)插入图像
图像格式:JPG,GIF,PNG
标签格式:<img src="路径+文件名" alt="文件的替换文本">
(8)区域
单独的一个组成部分
<div></div>
上角标:<sup></sup>
(9)表格
<table> </table>
<tr>定义了表格中的行
<th>定义了表头内容,文字居中
<td>定义了单元格的内容。
(10)表单
<form> </form>
(11)输入与选择
<input type="text/password/radio/checkbox"/>
文本框:type="text"
密码框:type="password"
单选框:type="radio"
复选框:type="checkbox"
<select> </select>:下拉列表框标签,其中标签项<option>定义选项。
(12)文本域标签
<textarea> </textarea>
(13)列表标签
<ol> </ol>:有序列表标签,其中标签项<li>是有序的。
<ul> </ul>:无序列表标签,其中标签项<li>是无序的,<li>中可以放<p>标签内容。
<dl> </dl>:自定义列表标签,其中标签项<dt>定义了标题,<dd>定义了内容