易截截图软件、单文件、免安装、纯绿色、仅160KB

最常用和实用的CSS技巧[zz]

下面是CSS最常用和实用的技巧。 
1.重置浏览器的字体大小
 
重置浏览器的默认值 ,然后重设浏览器
的字体大小你可以使用雅虎的用户界面重置
的CSS方案 ,如果你不想下载9MB的文件,代码如下: 
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,
blockquote,th,td {margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:”; }
abbr,acronym { border:0; }
其次,我们重设浏览器字体的大小为10像素,使用如下: 
html {font-size: 62.5%;}
这个大小基本合适,然后您可以根据自己的需要调整大小,如 标题1为120像素: 
h1 {font-size: 2em;}
2.设置水平居中
 
大多数的网站目前都是固定宽度的。CSS代码如下: 
div#container {margin: 0 auto;}
3.控制位置:绝对位置,相对位置
 
假如有两个div 
<div id='parent'>
<div id='son'></div>
</div>
div有left和top属性,是用来定位的. 
如果内层的div的position属性是absolute.那他就是相对于文档的左上角的位置.. 
如果内层的div(id为son的那个)position属性为relative,那它的left和top值就是相对于外层的div的左上角的距离. 
4.将重要元素放置在屏幕中央
 
如果你希望将您想要的东西放在最中央,可以使用以下CSS: 
div.popup { height:400px; width:500px; position: absolute; top: 50%; left: 50%;}
div.popup { margin-top: -200px; margin-left: -250px;}
您必须明确的指定宽度和高度,再把top和left属性设为他们的一半,这样就可以是这个部分回到屏幕的中心。 
5.可以重复利用的规则
 
.left {float: left;}
.right {float: right;}
img .left { border:2px solid #aaaaaa; margin: 0 10px 0 0;}
img .right { border:2px solid #aaaaaa; margin: 0 0 0 10px; padding: 1px;}
设置自己的CSS样式表,就可以在您需要的时候直接的添加标记即可。 
 
6. 解决IE6 的浮动元素的双倍边


相关文档:

IE6下css定义DIV高度的问题


IE6下默认的字体尺寸大致在 12 – 14px 之间,当你试图定义一个高度小于这个默认值的 div 的时候, IE 会固执的认为这个层的高度不应该小于字体的行高。所以即使你用 height:4px; 来定义了一个 div 的高度,实际在 IE 下显示的仍然是一个 12 px 左右高度的层。添加overflow: hidden解决问题。
<div style=&rdquo ......

7种CSS圆角框解决方案

1,无图片纯css圆角框
收录理由:兼容性强,不用图形
图一
特点:
1.不用任何图形,使用很多个div容器模拟出圆角效果。
2.兼容性:通杀所有浏览器
缺点:
1.构造这个圆角需要加入太多的无语义的标签,结构比较冗余。
2.重用性不强:如果一个页面有多个圆角,并且要实现不同的半径大小,则其灵活性不够。
3.边框颜 ......

Jquery input控件的CSS控制

<html>
<head>
<meta http-equiv="Content-Language" content="en" />
<meta name="GENERATOR" content="Zend Studio" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery test</title>
</head>
<style>
.lastp{bord ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号