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

CSS sprites技术加快您的网站(减少网站HTTP请求)

       减少网站HTTP请求这是加快网站访问速度的关键,而CSS sprites技术是把多张图像组合成一张图像,这样用户在访问网站时一次性把多张图片加载完,而不需要一张张图片的加载,这样减少了组件的页码,建立更丰富的内容的网站,同时也取得了快速的反应
时间。
       以25亿企业网站管理系统中的源码作为实例深刻讲解CSS sprites技术来加快您的网站(减少网站HTTP请求)。
       先插入说一个SEO中对网站评分的工具:YSLOW,YSLOW的第一个评分要求就是减少页面上的HTTP请求,其中有一段描述:
终端用户响应的时间中,有80%用于下载各项内容。这部分时间包括下载页面中的图像、样式表、脚本、Flash等。通过减少页面中的元素可以减少HTTP 请求的次数。这是提高网页速度的关键步骤。减少HTTP请求的方法包括:合并Javascript/CSS文件、使用CSS Sprites。
        采用了网站优化的综合手段,25亿企业网站管理系统的官方站的网页评级为A,性能评分达到了96(按评测规则集为小型网站或BLOG)。
        25亿企业网站管理系统官方用CSS sprites采用的工具是:ImageManipulation,
工具截图:
工具使用简单,直接添加想要合并的图片,下方的选中小图片CSS就会相应的显示需要使用的图片的CSS样式。
此工具的下载地址:http://www.25yi.com/UploadFiles/ImageManipulation.exe.V0.1.1.zip
         整合成一张图片的名称是:allbgs.png,如下图所示:
在CSS中代码:
.mframe span.tt4 { display:block; float:left;height:30px;width:122px;background:url(../../images/allbgs.png) no-repeat 0px -272px;color:#fff; font-size:14px; padding-left:8px; text-align:center;padding-top:0px;padding-top:0px;_padding-top:0px;}
.m1{background:url(../../images/allbgs.png) no-repeat 0px -53px; font-size:14px;}
.m2{background:url(../../images/allbgs.png) no-repeat 0px -115px; font-size:14px;}
.m3{background:url(../../images/allbgs.png) no-repeat 0px -148px; font-size:14px;}
.m4{background:url(../../images/allbgs.png) no-repeat -5px -181px; font-size:14px;}
.m6{background:url(../../images/allbgs.png)


相关文档:

常用CSS命名规范

模块:module.css
基本共用:base.css
布局、版面:layout.css
主题:themes.css
专栏:columns.css
文字:font.css
表单:forms.css
补丁:mend.css
打印:print.css
头:header  
内容:content/container  
尾:footer  
导航:nav  
侧栏:sidebar
栏目:column  
页面外围控制整体布局宽度: ......

IE6不解析某些CSS代码的解决方法

网页采用了 UTF-8 编码格式,这本来没有问题,问题是外部 CSS 文件默认是 ANSI 编码,并没有保存为 UTF-8 格式。可能你会发现在一般情况下这样也是没有问题的,然而当 CSS 文件中包含有中文注释时就可能不尽如人意了!
  估计是 IE6 版本以下的浏览器在解析这个 CSS 文件时因为编码问题而无法正确解析,所以才会发生 CSS ......

css经典样式

一 CSS文字属性:
color : #999999; /*文字颜色*/
font-family : 宋体,sans-serif; /*文字字体*/ 
font-size : 9pt; /*文字大小*/ 
font-style:itelic; /*文字斜体*/ 
font-variant:small-caps; /*小字体*/ 
letter-spacing : 1pt; /*字间距离*/ 
line-height : 200%; /*设置行高*/  ......

CSS和JS标签style属性对照表


盒子标签和属性对照
CSS语法(不区分大小写)
JavaScript语法(区分大小写)
border
border
border-bottom
borderBottom
border-bottom-color
borderBottomColor
border-bottom-style
borderBottomStyle
border-bottom-width
borderBottomWidth
border-color
borderColor
border-left
borderLeft
border ......

5种方法立刻写出更好的CSS代码

5种方法立刻写出更好的CSS代码
引自:http://bbs.seuuo.com/thread-2625-1-3.html
当然,每个人都可以编写CSS代码,甚至你现在已经让它为你的项目工作了。但是CSS还可以更好吗?开始用这5个Tips改进你的CSS吧!
1.重置
首先,很认真的告诉你,总是要重置某些分类。无论你是使用 Eric Meyer Reset、YUI Reset或者你自己编 ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号