CSS总结

CSS：层叠样式表(英文全称：Cascading Style Sheets)

<div style="color:red;">
    <span style="font-size:40px;">你好</span>
</div>

​ 样式：Style 用来设置元素（标签）的显示效果的

​ 格式：​

选择器{
    属性: 值;
    属性: 值;
}

​ 选择器

为哪个元素设置样式（jQuery中）

​ 一、基础选择器：

​标签选择器： 就是用标签名作为选择器来使用的。作用是选中页面中所有的这个标签的元素。

​类（class）选择器：按照元素所拥有的分类来选中元素。格式是 （点）.类名 在元素中需要设置class属性来指定元素的类别。多个类别使用空格分割。

​id选择器：（id选择器规定只能有一个）。格式是 #id名 选中指定id的特定的一个元素。元素中需要设置id的属性

​分组选择器：, 表示一种并列关系

​二、扩展选择器：

​层级选择器（后代选择器）：外层选择器 内层选择器。可以选中有特定结构的元素。

伪类选择器：描述元素在某些状态下的样式。：hover （鼠标放置在元素上）

列表标签

​ul：无序列表（unorder list）

ol：有序列表（order list）

li： list 列表元素

表单标签

表单是什么？能干什么？

就是用来收集用户数据的一组标签。

怎么干？

5个标签5个属性8个值

5个标签：form input select options textarea

5个属性：action method name value type

8个值： type属性的值 text password radio checkbox file submit reset button

form 标签：就是表单，没有显示效果，就是一个框，用来装其他标签

action：数据提交的url地址，如果不写，默认提交当前路径

method：数据的提交方式。GET、POST，主要区别是数据放置的位置不同，GET是拼接在请求路径中，是明文显示的，所以不安全。POST，数据放置在请求体中，也是明文传送的，所以也较不安装。

input 标签

​type属性：（8个值）

text：文本

password：密码

radio：单选（name 属性需要一致）

checkbox：复选

file： 文件上传

submit：提交

reset：重置

button：按钮

name属性：标识提交数据的键，不设置的话，就不会被提交

value属性：就是真实要提交的数据。

select 标签：下拉列表框

options 标签：选项

textarea 标签：多行文本框

value：是两个textarea中间的部分 <textarea>这就是value的值</textarea>

display属性

inline： 内联元素（行内元素），不能设置宽高，尺寸取决于其中的内容大小。

block： 行级元素（块级元素），可以设置宽高的，默认占满一行。

none： 不显示

inline-block： 行内块级元素。在一行中显示，并且可以设置宽高。

table: 表格标签

tr： 行（记录） table row

td： 数据（单元格）table data

th：表头 table head

<table>
    <tr>
        <th></th>
        <th></th>
    <tr>
    <tr>
        <td></td>
        <td></td>
    <tr>
</table>

vertical-align： 竖直方向上的对齐top middle bottom

text-align：水平方向上的对齐left center right

定位

相对定位（position: relative;）：相对自己所在的原位置定位。原有的位置不释放。

绝对定位（position: relative;）：从父级（祖宗级）拥有定位属性的元素开始定位，如果父级没有就继续向上找。直到找到body。会释放原有的位置。

固定定位（position: fixed;）：从浏览器的四个边开始定位top left right bottom

层级（z-index）。从小到大，小的在下，大的在上。