欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

css学习记录(一)

程序员文章站 2022-04-28 07:56:12
...

一、使用css样式的方式

1.内联

<any style="样式声明;样式声明"></any>

样式声明格式:
样式属性:值

常用样式属性:
color: ;font-size: ;background:

内联样式的优先级最高(内联用的不多)
2.内部样式:
在head标签中加入style标签,由选择器和样式声明组成

内部样式可重用
3.外部样式
在head中写入
<link rel="stylesheet" href="css文件的相对路径">

二、css样式特性

1.继承性
大部分css效果,子元素可以继承父元素的样式
2.层叠性
可以为一个元素定义多个样式
如果不冲突,可全部显示
3.优先级
4.调整优先级
!imoport规则

三、选择器

1.通用选择器
项目中可能用到的:*{margin:0;padding:0;}
2.元素选择器
div{} p{} span{}
3.类选择器

注意:
1.声明,必须以.开头。点是不能省略
2.引用使用的时候,直接写在class中,没有点.点
3.类名不能以数字开头
4.不能包含特殊字符(除了 - , _ )

4.ID选择器
#id{}
5.群组选择器
选择器1,选择器2,选择器3{}
6.后代选择器
选择器1 选择器2 选择器3{}
7.子代选择器
选择器>选择器{}
8.伪类选择器
1.链接伪类:
:link 匹配元素尚未访问的状态
:visited 匹配元素访问
2.动态伪类
:hover 匹配元素鼠标悬停时的状态
:active 匹配元素被**时的状态
:focus 匹配元素获取焦点时的状态
9.权值
!important >1000
内联样式 1000
id 100
类和伪类 10
元素 1
通用 0
继承 无

10000个id权值综合也到不了1000

四、尺寸

1.尺寸单位 px
2.em 相对父元素乘以的倍数
3.rem 相对根元素乘以的倍数
4.%

颜色

1.rgb(r,g,b)
2.#rrggbb
3.#rgb
4.rgba(r,g,b,alpha) 0-1透明度

相关标签: css学习