整理及优化CSS代码的7个原则】的更多相关文章

作为网页设计师(前端工程师),你可能还记得曾经的那个网页大小建议:一个网页(包括HTML.CSS.Javacript.Flash和图片)尽量不要超过30KB的大小,随着互联网的日益庞大,网络带宽也在飞速发展,很多设计师已经不再考虑这条30KB的理想准则.随着越来越受欢迎的CSS布局和Javascript对网站用户体验的强化,使得这种现象越来越普遍,尤其是对于大型网站来说,仅仅一个CSS文件就已经超过了30KB的上限. 但是即便如此,现在也有很多准则来帮助你在完成CSS布局后进行CSS代码的压缩和…
CSS代码的命名惯例一直是大家热门讨论的话题.今天暴风彬彬想通过分析一个流行三栏布局中的必要元素,来为大家讲解关于使用语义化方法替代结构化方法来命名CSS类的建议和指导. 您还可以参考彬Go的相关文章:<整理及优化CSS代码的7个原则><10个CSS简写技巧让你永远受用><DIV+CSS网页布局常用的一些基础知识整理> CSS类命名的语义化VS结构化方式 一般而言,CSS类名的语义化声明方式应当考虑你的页面中某个相对元素的”用意”,独立于它的”定位”或确切的特性(结构化…
作者:@狼狼的蓝胖子 网址:http://www.cnblogs.com/lrzw32/p/5100745.html 写CSS的同学们往往会体会到,随着项目规模的增加,项目中的CSS代码也会越来越多,如果没有及时对CSS代码进行维护,CSS代码不断会越来越多.CSS代码交错复杂,像一张庞大的蜘蛛网分布在网站的各个位置,你不知道修改这行代码会有什么影响,所以如果有修改或增加新功能时,开发人员往往不敢去删除旧的冗余的代码,而保险地增加新代码,最终的坏处就是项目中的CSS会越来越多,最终陷入无底洞.…
CssStats 是一个在线的 CSS 代码分析工具,你只需要输入网址或者直接 CSS 地址即可进行 CSS 代码的全方位分析,是前端开发人员和网页设计师分析网站 CSS 代码的利器,可以统计出 CSS 代码里的规则数量.字体颜色.字体大小.背景颜色数等等. 马上去试试 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示 十分惊艳的8个 HTML5 & JavaScript 特效 Web 开发中很实用的10个效果[源码下载] 1…
2013-07-21 15:06:47 北京时间2013年4月20日8时02分四川省雅安市芦山县(北纬30.3,东经103.0)发生7.0级地震.震源深度13公里.各大网站将其网站变灰,本人整理了下部分网站变灰的css代码. 1.将网站全部变灰 html { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-…
整理了一下之前用到过的css代码,实现一种效果或许有许多种写法,我这里整理了一下我个人认为兼容性比较好,结构比较简洁的代码……如有写得不对的地方敬请前辈们指点赐教一下,小弟不胜感激!此学习笔记是动态的——我日后发现有好的代码段会陆陆续续整理添加上去. css:ellipsis省略号 <style> .news{width:320px; text-overflow:ellipsis; -o-text-overflow:ellipsis; -moz-binding:url('ellipsis.xm…
1,使用鼠标选中前面浅灰色缩进. 2,Ctrl+H 查找替换  点击 Find All 查找全部缩进. 3,按backspace向后删除两次,如下图所示: 4,向下按一次方向键,再向左按一次方向键,最后向后删除一次backspance  如下图所示: 5,CSS代码就整理好了!!!!这里一定记住在书写CSS样式时,一定要记得同时书写注释. 在书写CSS样式时,可以先写好大体注释: /*all tag 全员基本样式*/ ... /*header导航*/ ... /*banner轮播图*/ ...…
css 写起来并不难,但在大型项目中,就变得难以管理,特别是不同的人在 css 书写风格上稍有不同,团队上就更加难以沟通,为此总结了一些如何实现高效整洁的 css 代码原则. css 优化的原则 1.不影响页面的布局 2.去掉不必要的样式 3.合并相同的样式 4.尽可能缩小样式的大小 css 样式中常见的问题 1.除 body 之外的样式重写了与 body 一样的样式,如: 1 body{font-size:12px;color:red;} 2 h1{font-size:16px;color:r…
CSS代码重构的基本方法 前面说到了CSS代码重构的目的,现在我们来说说一些如何达到这些目的的一些基本方法,这些方法都是易于理解,容易实施的一些手段,大家平时可能也不知不觉地在使用它. 提高CSS性能的手段 首先说说如何提高CSS性能,根据页面的加载性能和CSS代码性能,主要总结有下面几点: 1.尽量将样式写在单独的css文件里面,在head元素中引用 有时候为了图方便或者快速搞定功能,我们可能会直接将样式写在页面的style标签或者直接内联在元素上,这样虽然简单方便,但是非常不利于日后的维护.…
CSS代码重构与优化之路   阅读目录 CSS代码重构的目的 CSS代码重构的基本方法 CSS方法论 我自己总结的方法 写CSS的同学们往往会体会到,随着项目规模的增加,项目中的CSS代码也会越来越多,如果没有及时对CSS代码进行维护,CSS代码不断会越来越多.CSS代码交错复杂,像一张庞大的蜘蛛网分布在网站的各个位置,你不知道修改这行代码会有什么影响,所以如果有修改或增加新功能时,开发人员往往不敢去删除旧的冗余的代码,而保险地增加新代码,最终的坏处就是项目中的CSS会越来越多,最终陷入无底洞.…