CSS 3命令

link

style

color:#000；颜色

background-color:#000; 背景颜色

background:rgba(0,0,0,0.3); 背景透明度设alpha(0~1)

opacity: 0.3;元素透明度；

background-image:url(); 背景图片

background-repeat:; 背景图平铺原则

background-attachment:;设置背景图像是随对象内容滚动还是固定的

background-position:;背景图位置，可方位名词和%

font-size：px；文字大小

font-family:“宋体”; 字体

font-weight: normal正常 400;（bold粗700，lighter细） 字体粗细

font-style: normal正常(italic斜体); 字体风格

 

【字体连写:选择器{font:  font-style  font-weight  font-size / line-height  font-family;}顺序不可逆，没有参数可省略,下划线标注参数不可省略。h1{font: 25px “宋体”;}】

 

【背景连写:选择器{background:背景颜色 背景图片地址 背景平铺 背景滚动 背景位置;}无序，例background:{#000 url() no-repeat fixed center top}】

 

texe-align:L R C; 水平对齐方式

line-height:px; 行高（垂直方向移动对齐）

text-indent:2em; 首行缩进

text-decoration: none取消装饰（underline下划线，line-through删除线）; 取消装饰

 

display:inline; 把块级元素转换为行内元素

display:block; 把行内元素转换为块级元素

display: inline-block; 把行内元素转换为行内块元素

border:0; 去掉所有边框

border-width: 1px; 边框粗细

border-color: red; 边框颜色

border-style: solid 实线 (dashed 虚线dotted 点线); 边框样式

【边框简写:选择器{border: 1px solid red;}】

 

border-top(bottom left right): 1px solid red;  单边框(做分隔用)

border-collapse: collapse; 合并相邻边框线(1+1=1)。

padding:px; 内边距，适合做与文字内容长度相同有边距的盒子（padding-top（B L R）:;单侧边距）

 

margin:px; 外边距

cursor: pointer;  鼠标变小手

border-radius: 6px（50%）;  小手矩形，正方形50%变圆形，可以分别设置四角。

list-style: none; 取消无序列表小点

margin:0 auto; auto自动（自动充满），让盒子水平居中对齐

flaot:left; 浮动                                                                                                                                   

clear:both(L R); 清除浮动，作用于浮动元素父元素在无法添加高度且需要占位时使用此方法，达到占位的效果。

 

overflow:hidden; 溢出隐藏，（auto需要时显示滚动条）（scroll总显示滚动条）

 

position: static; 定位模式(static自动（静态）定位relative相对定位 absolute 绝对定位 fixed 固定定位)，边偏移参数（top left right bottom）。

 

z-index:1; 叠放次序，只有定位的盒子才有用，默认值0，无单位。

 

 

CSS选择器

基本选择器
类选择器	.nav{}	可多次重复使用(最常用)
ID选择器	#nav{}	只能用一次
标签选择器	div{}	作用于所有此标签元素
伪类选择器	:link	link未访问visited已访问hover鼠标悬浮时active点击
通配符选择器	*{}	作用于整个页面的所有元素(较少)
复合选择器
后代选择器	div ui li{}	用空格分隔,作用于后代所有重名选择器
子代选择器	div>ui>li{}	用>分隔,仅作用于后代子代所有重名选择器
交集选择器	div.(#)nav{}	选择器按序混用,仅作用于最后一级
并集选择器	div,p,span{}	用逗号隔开,集体声明,相同的样式

转载于:https://www.cnblogs.com/harrymiao/p/10593173.html