自定义编辑器的显示

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

如果你喜欢一款主题,不过有些地方你想使用自己的设计。这个时候,你就可以使用编辑器的自定义样式表,去覆盖掉原来的主题样式。 打开这个菜单 ... 然后选择 打开 Stylesheet...

你可以把自己的样式放到这个样式表里,其实这是一个 Less 文件,也就是你可以使用 Less 提供的方法去设计样式。不过使用普通的 CSS 样式也是可以的。

然后再打开编辑器的开发者工具 ... 查看,开发者,开发者工具 ... 也可以使用快捷键 alt + command + I .. Windows 上是 alt + ctrl + I ... 你看到的这个开发者工具,跟你的 Chrome 浏览器上的开发者工具是一样的 ...

点击这个放大镜图标 ... 然后再去选择你想要修改样式的地方 ... 选中以后,在右边这样,Styles 这个面板的下面,会显示出应用到这个地方的样式 ... 在这里你可以调整样式的属性,还有对应的值,这样可以实时的看到编辑器的变化 ... 比如我要修改这个标签选项卡下面的边线的宽度 ... 我猜就是这个 border-bottom 样式控制的 .. 关掉这个样式,再打开它,可以确定是不是你要修改样式的地方 .. .

确定以后,复制一下这块样式 ... 包括样式的选择器 ... 然后回到自定义的样式表 ... 粘贴到这里 ... 再去修改想要覆盖原有样式的样式 ... 这里我把边框的宽度改成 1px ...

保存 ... 你会立即看到效果 .. . 使用这样的方法,你就可以去把想要修改的地方换成自己的想法。

我对 seti 这个主题,做了一点修改,你可以在这个地址里,打开自定义的样式 .. 复制一下 ... 然后粘贴到你的编辑器的自定义的样式表里 ... 然后再保存一下 ... 就会应用这些自定义的样式了 ...

https://gist.github.com/wanghao8080/361b6c95cd816a12f47c

自定义编辑器的显示《 Atom:代码编辑器 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点