day20 标签与 CSS基础
form表单标签：专门用来进行用户信息收集的一个标签，一般要结合表单相关的标签使用才有意义；表单相关标签：input、select、textarea；主要是提供form中子标签的内容提交和重置功能；action：提交路径；method：提交方式(post、get)
-
input标签：可以在form表单中使用，input标签可以因为type值的不同，功能完全不一样
- <input type="text">：文本输入框
- <input name="">：区分：提交(相当于字典的key)，要不要给这个属性赋值，主要看：需不需要区分不同的内容，需不需要提交这个input标签的值
- <input value="">：value的意义会根据type的不同而不一样，但是表单提交的时候提交的是value的值
- <input placeholder="">：placeholder设置输入框的默认显示文本
- <input maxlength="">：文本框输入最大长度
- <input type="password">：文本框中输入密码信息.
- <input type="radio" checked="checked">：单选按钮，需要多个该标签，且保持name属性一致、value不一样才有意义，checked表示默认选中
- <input type="checkbox">：复选按钮
- <input type="button">：按钮类型input
- <input type="reset">：重置按钮
- <input type="submit">：提交按钮
<label for="input标签的id"></label >：点击label中的文字课选中for对应input标签的id来选中input
-
<select >：整个下拉菜单
- <option >：下拉菜单中的选项
- <optgroup >：在select中用于提示作用
<textarea rows="行数" cols="列数" autofocus="autofocus">：多行文本域，提供一个可以换行输入的输入框，rows属性影响输入框的默认高度，cols属性影响输入框默认宽度，autofocus当页面加载时，文本框自动获得焦点
<div >和<span >：div标签用于网页中的内容分组和分块
-
CSS：层叠样式表，是web标准中的表现标准，专门用来针对网页内容的布局和样式
- 语法：选择器(属性1：属性值1，属性2：属性值2)
- 说明：选中需要设置样式的标签，在内联样式中选择需要省略；
- rgb颜色：r-red(0-255)、g-green(0-255)、b-blue(0-255)
- red-rgb(255,0,0)-#ff0000
- green-rgb(0,255,0)-#00ff00
- blue-rgb(0,0,255)-#0000ff - 内联样式表：将样式写在标签的style属性中
- 内部样式表：将样式写在style标签中
- 外部样式表：写在CSS文件中，在html中通过link标签导入
- 复用性：外部>内部>内联
- 优先级：内联>内部=外部，内部与外部css注意顺序
- 常见属性：
- color：设置标签中的字体颜色
- backgroud-color：设置背景颜色
- font-size：字体大小
- width：标签宽度
- height：标签高度
- 选择器：通过选择器选中标签
- 元素选择器(标签选择器)：直接将标签名作为选择器，选中当前页面中对应的素有标签
- id选择器(#id_value{})：将标签的id属性的值的前面加#作为选择器，选中id属性值是指定值的标签。所有标签都有一个id属性，值自定义，但是要保证一个html中id唯一
- 类选择器(.class_name{})：将标签的class属性值前面加个'.'作为选择器，选中class属性值为指定值的标签'；同一个标签的class属性可以由多个值，不同值之间用空格隔开；一个html页面中可以多个标签拥有同样值的class属性
- 通配符选择器(*{})：选中当前html中所有标签
- 多标签选择器(p,a{}，选中所有p标签和a标签)：选中每个独立的选择器对应的标签，不同选择器之间用逗号隔开
- 后代选择器(p a{}，选中所有p标签中的a标签)：将不同选择器用空格隔开
- 伪类选择器：普通选择器选中的html中不同的标签，伪类选择器选中的是标签的状态
- 语法：普通选择器:状态{}，
- a:link(初始状态，一般只在超链接a标签中设置)：选择所有未被访问的链接
- a:visited(在a标签中设置)：选择所有被访问过的链接
- a:hover(不止针对超链接标签)：鼠标悬停在标签上时的状态
- :active(多用于超链接和按钮)：鼠标按住标签时对应的状态
- 选择器优先级：权重越大，优先级越高
- 伪类选择器优先级：link>visted>hover>active
- HTML标签选择器权值：0001
- class选择器权值：0010
- id选择器权值：0100
- 内联样式表权值：永远最大
- 多标签选择器的权值：看单独每个选择器的权重
- 后代选择器权重：所有权重值之和
