新组织CSS代码的利器:Styleneat

2016-02-19 17:04 8 1 收藏

下面,图老师小编带您去了解一下新组织CSS代码的利器:Styleneat,生活就是不断的发现新事物,get新技能~

【 tulaoshi.com - Web开发 】

  Styleneat 能够把 CSS 的选择器(selectors),子选择器( sub-selectors)和属性(properties)按照层式结构化重新组织,这样使得程序员更加容易去定义页面区域和查看它们之间的关系。Styleneat 是一个能够帮你重新组织你 CSS 属性的免费服务。

    比如它会把下面这段 CSS 代码

id1 { width: 100px; }
id1 .class1 { background: #000; }
id1 .class1 a { text-decoration: none; color: #fff; }
id1 .class1 a span { text-indent: 10px; }
id2 { width: 200px; }

    重新组织成:

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

id1 { width: 100px; }
    id1 .class1 { background: #000; }
        id1 .class1 a { color: #fff; text-decoration: none; }
            id1 .class1 a span { text-indent: 10px; }
 
id2 { width: 200px; }

    Styleneat 提供三种使用方式:

    直接粘贴 CSS 代码。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

    上传一个 CSS 文件。

    提供 CSS 文件的 URL 地址。

    另外 Styleneat 还提供一些选项,如按照 CSS 选择的字母顺序排列,单行格式或者多行格式等。Styleneat 在 CSS 优化方面还是提供了比较多的帮助。

来源:http://www.tulaoshi.com/n/20160219/1614076.html

延伸阅读
标签: Web开发
当我们面对网站项目里日益庞大的css,javascript文件,无论是为了二次开发还是浏览器解析,都应该优化他们的代码,但是优化并不意味着是简单的压缩或减小文件体积。条理清晰,运行效率高才是我们要的结果。那么有哪些手段能够我们的css代码呢?一起来看看下面的一些建议吧。 1.使用缩写 缩写能够缩短你的工作时间,减小你的文件...
标签: Web开发
应程序要求,全部用p+类展示。其他要求请自行更改! 关于有序列表OL: 直接对ol定义text-indent:4em;IE内这4em是在序列号前边,FF,GG内,是在序列号和正文中间。 改用对OL使用padding-left:4em !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt...
标签: flash教程
       Flash的ActionScript(简称AS)代码控制是Flash实现交互性的重要组成部分,也是区别于其他动画软件的看家本领。今年新发布的Flash MX Professional 2004的动作脚本语言已经升级到2.0,它是一种面向对象的脚本语言,执行ECMA-262脚本语言规范,支持继承、强类型和事件模型。使用动作脚本语言2.0可以编写出...
标签: Web开发
1. This another great CSS menu Stu Nicholls that’s unique – hovering over a menu item reveals a submenu. If you want get started with this menu just simple view the source code. Demo in page. 2. In this CSS technique, you’ll learn to create a vertically-oriented CSS hover menu that reveals ...
标签: Web开发
命名一直是个让我头痛的问题,特别是那些看上去差不多的模块,所以就得想办法啦,我总结了下面的方法,虽然还在试验中。希望对大家有帮助。欢迎大家提出改进的意见。具体如下: 要注意的内容: 一,命名所选用的单词应选择不过于具体表示某一状态(如颜色、字号大小等)的单词,以避免当状态改变时名称失去意义。 二,样式类名由以字母开头...

经验教程

835

收藏

49
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部