关注图老师设计创意栏目可以让大家能更好的了解电脑,知道有关于电脑的更多有趣教程，今天给大家分享CSS编辑器：TopStyle Pro使用技巧教程,希望对大家能有一点小小的帮助。
【 tulaoshi.com - Web开发 】
大家在编写CSS的时候可能认为记事本并不是最棒的，有什么css编辑工具可以提高我们编码的效率呢？
TopStyle是我一直用的CSS编辑工具，最开始就是瞎用也没有仔细研究过，不过后来把里面的功能仔细看了看发现它的功能真是太强大了！
在这里分享一下使用经验，我在编辑CSS时常用的快捷键：
（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）文字注释：Shift+Ctrl+M
向右缩进：Shift+Ctrl+.
向左缩进：Shift+Ctrl+,
下一个CSS：Ctrl+]
上一个CSS：Ctrl+[
选颜色：Shift+Ctrl+C
保存以后不能撤销(Ctrl+Z)？
我们给改过来，选项位置：Options--Editor--选择Enable undo after save
（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）自动替换
比如你打"!i"然后按一个空格，TopStyle就自动将"!i"替换成"!important"
选项位置：Options--Editor--Auto Replace 你也可以自己添加快捷输入。
树型CSS
有时候是不是觉得CSS太多了不好浏览？TopStyle提供了一个将CSS内容隐藏只显示选择器名称的缩略形式，很方便。
选项位置：Options--Editor--Rule Collapsing 选择Enable rule collapsing
快速校验
快捷菜单中的W3C CSS Validator 和W3C HTML Validator按钮很方便，编辑完直接一点就能知道是否通过了校验。
样式表清道夫
下面隆重推荐TopStyle自带CSS整理功能。样式表清道夫 Style Sweeper。它能把你的CSS整理的非常工整，规范。一个非常不错的功能。
选项位置：Tools--Style Sweeper
Rules 规则面板：Rule Format 可以设置单行多行显示。
Combine Rules 设置是否将有相同属性的CSS组合。
Selectors 选择器面板：Selector Case 设置选择器的大小写。
Selector order 设置选择器的排序方式。
Property属性面板：Property Case 设置属性的大小写。
Property order 设置属性的排序方式。 Shorthand Properties 缩写属性面板：可以选择将font、background、margin、padding属性缩写。
Others 其他属性面板：
Color Format 颜色格式：可选择十六进制、RGB、颜色名称等。
说了这么多还是希望大家在实践当中不断的提高自己的CSS能力，TopStyle是个不错的好帮手！
来源:https://www.tulaoshi.com/n/20160219/1621349.html
看过《CSS编辑器：TopStyle Pro使用技巧》的人还看了以下文章 更多>>
