网页设计:使用CSS缩写给你的网站加速[1]

时间:2015-3-31 1:55:31   作者:互联网   来源:互联网转载   阅读:108   评论:0
内容摘要:用CSS缩写给你的网站加速   Web网站可用性的关键指标是速度更确切地说是页面能以多快的速度出现在访问者的浏览器窗口里影响速度的因素有很多种包括Web服务器的速度访问者的Internet连接情况以及浏览器必须下载的文件大小尽管你无法控制服务器和连接的速度但是你可以控制构成网站Web页面的文件大小  为了让网站能够更快...
    用CSS缩写给你的网站加速

  Web网站可用性的关键指标是速度更确切地说是页面能以多快的速度出现在访问者的浏览器窗口里影响速度的因素有很多种包括Web服务器的速度访问者的Internet连接情况以及浏览器必须下载的文件大小尽管你无法控制服务器和连接的速度但是你可以控制构成网站Web页面的文件大小

  为了让网站能够更快Web的建设者都会按常规地压缩和优化网站上的每一个图像文件这常常使得为了将文件的大小减少几个百分点而牺牲了图像的质量由于CSS样式表是纯文本文件和图像相比相对较小所以Web建设者很少考虑采取措施减少其CSS样式表文件的大小但是通过使用CSS缩写以及其他的一些简单技巧你可以在很大程度上减少样式表的大小在我对自己样式表的一次非正式的特别测试中我把文件的大小降低了大约%

  使用CSS的缩写性质

  CSS的缩写性质(shorthand property)是一些专用的性质名用来代替多个相关性质的集合例如间隙性质(padding property)是顶部间隙(paddingtop)右侧间隙(paddingright)底部间隙(paddingbottom)和左侧间隙(paddingleft)的缩写

  使用速写性质让你能够把多个性质/属性对(property/attribute pair)压缩进CSS样式表的一行代码里例如想一想下面的代码

以下是引用片段
  sample {
  margintop: px;
  marginright: px;
  marginbottom: px;
  marginleft: px;
  paddingtop: px;
  paddingright: px;
  paddingbottom: px;
  paddingleft: px;
  bordertopwidth: thin;
  bordertopstyle: solid;
  bordertopcolor: #;
  }

  将它用一些缩写性质来替代就能够把代码减少为下面这样两者的实际效果是完全一样的

以下是引用片段
  sample {
  margin: px px px px;
  padding: px px px px;
  bordertop: thin solid #;
  }

  要注意缩写性质还有多个属性每一个(属性)都对应一个被组合进入缩写性质的常规性质属性由空白隔开

[]  []  []  []  []  []  []  


标签:网页 设计 使用 写给 给你 

免责申明:

站内素材文件均整理自互联网,仅供个人学习参考使用,请勿用于商业用途,如您喜欢请购买正版

站内资源除部分为本站原创外皆由网上搜集和整理,若无意中侵犯到您的权利,敬请告之(QQ:2390986128)敬请告之,我们将在48小时内删除。知识产权声明】【★下载说明★】

图库精选

全站地图