外边距 margin:1px 1px 1px 1px 简写margin:1px;
maigin:1px 2px 1px 2px 简写 margin:1px 2px;
margin:1px 2px 3px 2px 简写 margin:1px 2px 3px;
上边距 margin-top:1px
下边距 margin-bottom:1px
右边距 margin-right:1px
左边距 margin-left:1px
居中设置 margin:0 auto;
内边距 padding同上外边距
边框 简写 border:1px solid #120
类似border-top border-right border-bottom border-left
none无边框 solid实线 dashed虚线 dotted点线
背景 background-color:颜色
Background-image:url(1.jpg)
Background-repeat:repeat|repeat-x|repeat-y|no-repeat 平铺样式
background-attachment:scroll|fixed
Background-position:x y|top center bottom left center right 背景位置x y是百分比默认0% 0%
简写:background:#ff url() no-repeat 0 0;
默认transparent是背景透明
none无图片
repeat横纵都平铺
scroll背景随内容滚动 fixed背景固定
% 0%默认图像位置
字体 font-style:nomal|italic 正常和斜体
Font-variant:nomal | small-caps 正常 小型大写字母
Font-weight:nomal(400) |bold(700) | 100-900 字体粗细
Font-size:medium默认 12px 12号字体
Line-height:nomal |12px 行高
Font-family:"Times New Roman",serif
简写 font:(italic small-caps bold) 12px/13px “Times New Roman”,serif
文本修饰: text-decoration:none|underline下划线|line-through中划线|overline上划线
文本位置: vertical-algin:baseline默认|sub下标|super上标
文本剪切:text-overflow:clip不显示...剪切|ellipais显示...剪切
文本流入方向:direction:ltr左|rtl右|inherit集成父类
文本对齐:text-align:left|right|center|justify两端对齐
列表 list-style:none //清除所有列表样式
List-style-type:disc实心圆|circle空心园|squqre实心方块|decimal数字|none无符号
List-style-position:outside文本外|inside文本内
List-style-image:none|url(1.jpg)
简写:list-style:disc outside none
定位 position:static无特殊定位|absolute文档流出|relative对象不层叠
上->下->左->右(top-bottom-left-right)
z-index:auto|2 数字越大越在上
宽高 width:20px height:100px;
布局 clear:none允许两边浮动|left不允许左浮动|right清除右浮动|both清除浮动
float:none对象不浮动|left左浮动|right右浮动
overflow:visible不剪切不添加滚动|auto自动|hidden不显示超过对象尺寸|scroll显示滚动
display:block添加新行,显示|inline行内|none隐藏|
visibility:inherit继承|visible显示|hidden隐藏 保留空间
属性选择器 a[rel='it']{color:red;}
子对象选择器 div ul>li{} 选择li属性
分组选择符 td,div,a{}
未被访问 a:link{}
移动到上边 a:hover{}
点击中 a:active{}
点击后 a:visited{}
方式 L V H A
@import url(css.css);导入css样式
div{color:red!important} 优先级
圆角 简写 –moz-border-radius:5px 5px 5px 5px
-webkit-boder-radius:0 5px 5px 5px
Border-radius:5px;
插入文字或图片 div:before{content:’文字’}在div之前插入文字
div.after{content:url()}在div之后插入图片
文字阴影 text-shadow:5px 5px 5px red; x y方向位移 模糊半径 颜色
手型 cursor:hand(pointer)手型 | help帮助 |url(1.ani) |wait等待
常见颜色值 Transparent透明 black黑色 white白色 red红色 黄色yellow 绿色green 蓝色blue
橙色orange 灰色#C0C0C0 紫色#FF00FF
垂直居中设置 line-height=height
IE6居中body{text-align:center;}
文本居中div{text-align:left;margin:0 auto;}
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="ie6.css" />< ![endif]-->
IE6高度为1px overflow:hidden,zoom:0.8,line-height:1px;
-01添加一个
如果相邻元素要想平行就需要第一个元素设置vertical-algin:middle 第二个设置display:inline这样就可以了,有浮动尽量清除