HTML知识点小总结
程序员文章站
2022-03-10 07:57:48
...
1、HTML是标记性语言。头部声明DOCTYPE是document type（文档类型）的简写，用来说明你用的XHTML或者HTML是什么版本。
<!doctype html>
告诉浏览器当前页面使用h5版本解析
2.网页结构与内容
<html></html>
一个页面有且只有一对html标签。表示网页的开始和结束。
在html标签中，有头部内容和主体内容。
<html>
<head></head> 网页的头部，定义全局信息
<body></body> 网页的主体，所有显示的内容
</html>
`<div></div>可以把文档分割为独立的、不同的部分
<h1></h1>…<h6></h6>可定义标题。<h1>定义最大的标题，<h6>定义最小的标题
<ol></ol>定义有序列表，必须嵌套<li>
<ul></ul>定义无序列表，必须嵌套<li>
<li></li>定义列表项目，是有序列表和无序列表的子标签
<table></table>定义表格
<tr></tr>定义表格行<th></th>定义表头
<td></td>定义表格单元
<p></p>定义段落
<br/>换行符
<from></from>用于为用户输入创建HTML表单行内属性标签（内联元素）
<span></span>被用来组合文档中的行内元素
head元素 是其他头元素的容器
<title></title>网页标题
<meta />定义全局信息，元数据信息
<meta charset="utf-8">
<meta name="description" content="描述内容">
<meta name="keywords" content="关键词内容">
<style></style> css定义网页的内部样式
<script></script>定义或者引用js文件
<link>css引用外部样式
<em></em>把文本定义为强调内容，浏览器一般以斜体显示
<a></a>锚文本，最重要的属性是href，指定连接的目标
<img/>是单标签，链接图片，有src和alt属性
margin与padding 的区别
margin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。
padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离。
链接部分
<a href="url"></a>
href:链接的路径
target:指定打开链接的方式
_blank 在新的标签页中打开网页
新建邮件
<a href="mailto:[email protected]">新建邮件</a>
锚点
锚点就是页面中的一个记号，可以通过点击超链接的方式，直接回到记号处
第一种方式 <a name="锚点名称"></a>
第二种方式 给任意的标签添加id，把id当做锚点名称使用
<any id="锚点名称">
<a href="#锚点名称">链接本页锚点</a>
文本框和密码框
文本框 type="text"
密码框 type="password"
按钮
提交按钮 `type="submit"`
将表单中的数据提交给服务器
重置按钮
type="reset"
将表单内容恢复初始化状态
普通按钮
type="button"
没有任何特殊功能
value：定义按钮上的文字
单选按钮和复选框
单选按钮 type="radio"
复选框 type="checkbox"
checked 无值属性，设置默认被选中项
隐藏域
type="hidden"
想提交给服务器，但是不想给用户看的数据，可以放在隐藏域中
文件选择框
type="file"
文本域
允许录入多行数据的文本框
<textarea name="" readonly value="123"></textarea>
cols 指定文本域的列数
rows 指定文本域的行数
超出部分会显示滚动条
下拉选择框(下拉选)
<select>
<option></option>
.......
</select>
name 定义下拉选的名称
value 下拉选的值
size 定义显示选项的数量，默认1，如果取值大于1，元素表现为滚动列表
multiple 设置多选，无值属性