颜色和透明度
p{
color:red;
}
解释:设置文本颜色。
p{
color:red;
opacity:0.5;
}
解释:设置元素的透明度
盒子阴影和轮廓
box-shadow
hoffset阴影的水平偏移量,是一个长度值,正值表示阴影向右偏移,负值表示阴影向左偏移。voffset阴影的垂直偏移量,是一个长度值,正值代表阴影位于元素盒子的下方,负值代表阴影位于元素盒子上方。
blur(可选)指定模糊值,是一个长度值,值越大盒子的边界越模糊。默认值为0,边界清晰
spread(可选)指定阴影延伸半径,是一个长度值,正值代表阴影向盒子各个方向延伸扩大,负值代表阴影沿相反方向缩小
color(可选)设置阴影的颜色,如果省略,浏览器会自行选择一个颜色
inset(可选)将外部阴影设置为内部阴影
div {
width: 200px;
height: 200px;
border: 10px solid green;
box-shadow: 10px 10px 5px 2px gray inset;
}
outline
CSS3还提供了轮廓样式,它和边框一样,只不过它可以在边框的外围再加一层。样式表如下: outline-color外围轮廓的颜色
outline-offset轮廓距离元素边框边缘的偏移量
outline-style轮廓样式,和border-style一致
ontline-witdh轮廓宽度
outline <颜色><样式><宽度>
div{
width:200px;
height:200px;
border:10px solid silver;
outline:10px double red;
}
解释:在边框的外围再增加一圈轮廓。
div {
width: 200px;
height: 200px;
border: 10px solid green;
outline: 5px double red;
}
光标样式
cursor:auto,default,none,context-menu,help,pointer,progress,wait,cell,crosshair,text,vertical-text,alias,copy,move,no-drop,not-allowed,e-resize,n-resize,ne-resize,nw-resize,s-resize,se-resize,sw-resize,w-resize,ew-resize,ns-resize,nesw-resize,nwse-resize,col-resize,row-resize,
all-scroll
div{
cursor:move;
}
解释:设置当前元素的光标为移动光标。