Float有4个值:
left :元素向左浮动。
right :元素向右浮动。
none :默认值。
inherit :从父元素继承float属性。
浮动后的div宽度会变成0,但是其内边框可能撑起它的宽和高。
* 通配符选择器
选择所有的标签
*{margin:0px;padding:0px;
}
以上的代码就是去掉所有标签的内边距padding和外边距margin
标签选择器
以标签名作为选择器的名字
div{css样式...属性:属性值;...
}
去掉小圆点
ul{list-style:none;
}
阴影
盒子阴影 box-shadow
box-shadow:x y blur spread color [inset];
示例
.box{width:200px;height: 200px;border: solid 1px #ccc;margin: 100px auto;box-shadow: 0px 0px 0px 0px red;
}
box-shadow的值可以有多个,且每个值之间用逗号隔开
box-shadow:x y blur spread color [inset],x y blur spread color [inset]; (blur模糊程度,spread范围)
示例:
.box{width:200px;height: 200px;border: solid 1px #ccc;margin: 100px auto;box-shadow: 0px 0px 0px 0px red,0px 0px 0px 0px blue,0px 0px 0px 0px green,0px 0px 0px 0px yellow;
}
文字阴影 text-shadow
text-shadow:x y blur color; (blur模糊程度)
示例
.box{...text-shadow: 0px 0px 0px green;...
}
text-shadow的值可以有多个,且每个值之间用逗号隔开
.box{text-shadow: 1px 0px 0px #000, -1px 0px 0px #fff;
}
透明
opacity 背景透明内容也透明
0 全透明 1不透明 透明背景颜色和内容
opacity: 0.1
rgba() 背景透明,内容不透明
r: red 0-255
g: green 0-255
b: blue 0-255
a: 透明度 0-1
background: rgba(0,0,0,.1);