CSS2简写和常用css总结笔记

外边距 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%默认图像位置

属性选择器     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;}

IE6高度为1px overflow:hidden,zoom:0.8,line-height:1px;
-01添加一个
如果相邻元素要想平行就需要第一个元素设置vertical-algin:middle 第二个设置display:inline这样就可以了,有浮动尽量清除

转载于:https://www.cnblogs.com/Format2012/archive/2012/06/15/2551373.html

CSS2简写和常用css总结笔记

猜你喜欢