CSS的一些属性

coler

  • 预定义颜色:red,green,blue
  • 十六进制:#ff0000(#f00),#ff6600(#f60),#29d794(不能缩写);
  • rgb颜色:rgb(255,255,0),rgb(100%,%100,0)

文本修饰

  • text-decoration
参数 说明
none 无效果
underline 下划线
line-through 贯穿线
overline 上划线

三大特性

  • 层叠
  • 继承性
子标签会继承父标签的某些样式,例如文本的颜色和字号。
  • 优先级
  • 权重
继承或者*的贡献值		0,0,0,0
每个元素标签的贡献值		0,0,0,1
每个类,伪类的贡献值		0,0,1,0
每个ID贡献值				0,1,0,0
每个行内样式贡献值		1,0,0,0
每个!important贡献值		无穷大
继承的权重				0,0,0,0 
  • 权重叠加
div p{}权重高
p{}权重低
<div>
	<p></p>
</div>

background连写

background:transparent url(img.png) repeat-y stroll 50% 0;
顺序无强烈要求,建议使用以下写法
background:背景颜色 背景图片地址 背景平铺 背景滚动 背景位置
background: [background-color] [background-image] [background-repeat] [background-attachment] [background-position] / [ background-size] [background-origin] [background-clip];

CSS3背景半透明

background:rgba(0,0,0,0.8); rgba写法
background:#000000cc; 十六进制写法

盒子模型

border

border-边框粗细
border-style:边框样式(none,solid实线,dashed虚线,dotted点线)
border-color:边框颜色

border:1px solid red;连写,无顺序

表格的细线边框

table,td{
	border-collapse:collapse;/*合并相邻边框*/
}

padding

padding:3px;/*上,下,左,右都是3px*/
padding:3px 5px;/*上下3px 左右5px*/
padding:3px 5px 10px;/*上3px,左右5px,下10px(从上到下)*/
padding:3px 5px 10px 15px;/*上3px,右5px,下10px,左15px(顺时针)*/

padding会撑开带有width和height的盒子

外边距合并问题

原文地址:https://www.cnblogs.com/dch0/p/11445774.html