首页 web前端 css教程 TopStyle Pro 的使用技巧

TopStyle Pro 的使用技巧

May 16, 2016 pm 12:10 PM
css 浏览器

TopStyle Pro是一款功能专注于CSS设计的辅助工具,功能相当多,附有CSS码检查功能,减少写错的机会。尤其是它的HELP文件中详细的 CSS指令介绍,很适于用作参考文件与初次接触CSS的人做为学习使用。下面我们来介绍一下TopStyle Pro 的使用技巧 :

文字注释:Shift+Ctrl+M

向右缩进:Shift+Ctrl+.

向左缩进:Shift+Ctrl+,

下一个CSS:Ctrl+]

上一个CSS:Ctrl+[

选颜色:Shift+Ctrl+C

保存以后不能撤销(Ctrl+Z)的

我们给改过来~

选项位置:Options--Editor--选择Enable undo after save

自动替换

比如你打"!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、颜色名称等。

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
2 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

如何在网页上正确显示本地安装的'荆南麦圆体”? 如何在网页上正确显示本地安装的'荆南麦圆体”? Apr 05, 2025 pm 10:33 PM

在网页中使用本地安装的字体文件最近,我从网上下载了一种免费字体,并成功将其安装到了我的系统中。现在...

如何通过CSS选择第一个类名为item的子元素? 如何通过CSS选择第一个类名为item的子元素? Apr 05, 2025 pm 11:24 PM

在元素个数不固定的情况下如何通过CSS选择第一个指定类名的子元素在处理HTML结构时,常常会遇到元素个数不�...

H5页面制作是否需要持续维护 H5页面制作是否需要持续维护 Apr 05, 2025 pm 11:27 PM

H5页面需要持续维护,这是因为代码漏洞、浏览器兼容性、性能优化、安全更新和用户体验提升等因素。有效维护的方法包括建立完善的测试体系、使用版本控制工具、定期监控页面性能、收集用户反馈和制定维护计划。

H5页面制作是前端开发吗 H5页面制作是前端开发吗 Apr 05, 2025 pm 11:42 PM

是的,H5页面制作是前端开发的重要实现方式,涉及HTML、CSS和JavaScript等核心技术。开发者通过巧妙结合这些技术,例如使用<canvas>标签绘制图形或使用JavaScript控制交互行为,构建出动态且功能强大的H5页面。

H5页面制作的优势有哪些 H5页面制作的优势有哪些 Apr 05, 2025 pm 11:48 PM

H5 页面制作的优势包括:轻量级体验,加载速度快,提升用户留存率。跨平台兼容性,无需针对不同平台适配,提升开发效率。灵活性和动态更新,无需审核,便于内容修改和更新。成本效益,开发成本比原生 App 低。

在移动端如何兼容多行溢出省略? 在移动端如何兼容多行溢出省略? Apr 05, 2025 pm 10:36 PM

移动端多行溢出省略在不同设备上的兼容问题在使用Vue2.0开发移动端应用时,常常会遇到需要对文本进行多行溢...

如何高效修改嵌套DIV元素的样式? 如何高效修改嵌套DIV元素的样式? Apr 05, 2025 pm 10:45 PM

深入探讨嵌套DIV样式修改方法本文将详细解答如何有效地修改嵌套结构的DIV元素样式。我们面临的挑战是如何精...

H5页面制作的门槛高吗 H5页面制作的门槛高吗 Apr 05, 2025 pm 11:45 PM

H5页面制作门槛既不高也不低,取决于目标。制作简单的静态页面较容易,只需要掌握HTML、CSS基础知识;制作交互性强、功能丰富的页面则门槛较高,需要深入掌握HTML、CSS、JavaScript、前端框架、性能优化和兼容性等知识。

See all articles