css基础知识

css基础小知识

css三种样式表：
1.直接添加（行内样式表）
直接在元素上加style（优先级高 影响范围小）
2.页内样式表
加在本页的head里的style中（优先级中等 影响范围只能影响本页）
3.外联样式表
优先级和页内样式表一致 （ 影响范围大 只要引入就能影响）
//当html中同时出现页内样式表和外联样式表时，他们的优先级一样，就按照顺序看他们的加载顺序。后面出现的就可以覆盖掉前面出现的。
优先级就是1>2=3(2和3的优先级具体看加载顺序)

css选择器：
//越精确的css设置优先级越高
id>class>元素
元素选择器 div p table 用元素标签选择
类选择器 .xxxx 用class调用
id选择器 #xxxx 用id调用
div > ul 子元素选择器 只影响div子类中的ul
div ul 后代选择器 影响div下所有层级的ul
子元素选择器和后代选择器的优先级一样 看的是加载顺序
div，p，table表示所有的div p table都受影响
属性选择器[name=“xxx”]{}

from表单
text文本的输出
password密码框
radio单选框
chexkbox复选框
submit按钮提交
file文本上传
image生成图像域
select元素中的option标签用于定义列表中的可用选项

CSS盒子模型：

Margin(外边距) - 清除边框外的区域，外边距是透明的。
Border(边框) - 围绕在内边距和内容外的边框。
Padding(内边距) - 清除内容周围的区域，内边距是透明的。
Content(内容) - 盒子的内容，显示文本和图像。