颜色透明度

属性描述
color: rgba(255, 255, 255, 0.5);RGB透明度
opacity:0.5;通用透明度(整体)

边框属性-border

基本属性描述
border-width宽度
border-style:样式
border-color:颜色
border:5px solid red;简写属性
border-radius圆角

- 边框的样式:

样式属性介绍
none:默认无边框
dotted定义一个点线边框
dashed:定义一个虚线边框
solid:定义实线边框
double:定义两个边框。 两个边框的宽度和 border-width 的值相同
groove:定义3D沟槽边框。效果取决于边框的颜色值
ridge:定义3D脊边框。效果取决于边框的颜色值
inset:定义一个3D的嵌入边框。效果取决于边框的颜色值
outset:定义一个3D突出边框。 效果取决于边框的颜色值

过渡属性

简写属性描述
transition: width 1s linear 2s;宽度变化持续2秒,延直线触发时间2s
transition: width 2s, height 2s;多属性用逗号隔开

- 样式属性

属性描述
transition简写属性,用于在一个属性中设置四个过渡属性。
transition-property规定应用过渡的 CSS 属性的名称。
transition-duration定义过渡效果花费的时间。默认是 0。
transition-timing-function规定过渡效果的时间曲线。默认是 "ease"。
transition-delay规定过渡效果何时开始。默认是 0。

-三大过渡属性

scale属性(缩放)描述
scale(数值)定义倍数缩放,>1放大,<1缩小
scaleX()通过x轴定义,仅水平方向缩放
scaleY()通过y轴定义,仅垂直方向缩放
scaleZ()通过z轴定义,定义3d缩放

例如:transform: scale(2); X、Y分别放大两倍

translate属性(移动)描述
translate()相当于水平平移,+ 表示向右/下,- 表示向左/上
translateX(x)水平方向平移
translateY(y)垂直方向平移
translateZ(z)相当于放大
translate(x,y)相当于水平平移+垂直平移
translate(x,y,z)相当于水平平移+垂直平移+放大

例如:translateX(100px)水平向右平移100px

rotate(旋转)描述
rotate(angle)定义2D旋转
rotateX(angle)
rotateY(angle)
rotateZ(angle)
rotate3d(angle)定义3d旋转

例如:transform: rotate3d(1, 0, 1, -180deg);顺时针旋转消失

动作类

a:link正常,未访问过的链接
a:visited用户已访问过的链接
a:hover当用户鼠标放在链接上时
a:active链接被点击的那一刻


--end--