Code Cola，CSS样式可视化Chrome插件，即时修改浏览器网页效果

Code Cola是一个能够查看网页代码样式的可视化CSS样式chrome扩展插件。

在浏览原生网页的时候，是无法对网页设计就行修改的，但也会遇到需要调整当前网页布局、更改展示样式的情况，这种时候就可以借助这款chrome扩展插件——Code Cola。

Code Cola

开发者工具插件2021-12-214.7

Code Cola是一个可视化编辑在线页面css样式的chrome插件。

直达下载

扩展功能

Code Cola扩展程序提供给用户查看网页版块中所有元素的功能，并支持通过配置到服务器上的文件进行在线编辑。包括网页颜色、网页背景、网页遮罩、文字阴影、字体字号行高等，修改后能在浏览器内实时展示修改效果，但这并不是直接修改原网页，而是对当前页面进行即时展示处理。

下载安装

使用方式

1、扩展程序安装完毕后，打开任意网页，点击浏览器工具栏的扩展图标，则会弹出Code Cola窗口，通过这个窗口可以查看整个网页样式代码。

3、字体更改。

简单说明下字体更改功能，首先选中需要调整的字体版块，然后选中“字体”栏，点击下拉展开所有字体样式，点选目标字体，之前通过蓝色蒙层选中的区域就会变成调整后的字体。

字体、行高、字色、字形都可以这样同理设置。

如需更换页面背景，可以通过背景——选择文件，来自定义当前页面的背景图片。

5、其他元素更改。

除了上诉提到的几个功能外，Code Cola扩展还支持对齐方式、文字阴影、文字描边、线性渐变、透明度、盒阴影、遮罩、反射、变形、边框、圆角、布局进行设置。都是通过对对应参数的调整来进行更改的。

6、撤销更改。

你也可以随时关闭效果，点击“关闭”功能，就会恢复为原网页的效果。

通过Code Cola扩展可以即时修改网页HTML与CSS的样式代码，实现文字样式背景颜色、边框效果等基础元素的自定义。

Code Cola

开发者工具插件2021-12-214.7

Code Cola是一个可视化编辑在线页面css样式的chrome插件。

直达下载