有没有编辑CSS的可视化插件

daswcszxw 2016-03-22 12:03:57

<div class="ebanner" style="background-image:url(images/home3_02.jpg);height:350px;background-color:#333;"></div>

像这样每个div的样式写在style里.

鼠标移动到DIV上会出现编辑按钮,点编辑弹出框,会有style的所有CSS.
像这样,高:<input>350</input>px

手动输入值保存即可见到.

我现在在搞这个...
要累死了.求助呀~

...全文

146 3 打赏收藏转发到动态举报

写回复

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

hch126163 2016-03-23

打赏
举报

回复

chrome f12开发人员工具 FF friebug

KK3K2005 2016-03-22

打赏
举报

回复

如 1楼说的我们都是直接浏览器调试面板里面写样式

丰云 2016-03-22

打赏
举报

回复

浏览器就是最好的可视化css编辑器，因为现在所有的浏览器都自带了开发者工具

StyleMesh: 极简的CSS样式可视化工具 StyleMesh 是一款极简的CSS样式可视化工具，可以帮助开发者快速查看网页元素的样式信息，并进行实时编辑和预览。主要功能实时查看网页元素的样式信息，包括CSS属性、值和计算结果；支持多选模式，可以一次性查看多个元素的样式信息；可以在控制台中直接编辑元素的样式，实时预览效果；可以保存当前页面的所有样式信息为一个 .stylemesh...

这些功能的使用方式也非常简单，只需要在相应的输入框中填入想要的属性值，再次点击生成代码按钮，就能够快速生成对应的CSS代码。使用这个工具非常简单，我们只需要在网页上输入想要调整的边框的各个属性，例如边框的宽度、颜色、样式等等，然后点击生成代码按钮，就可以立即生成对应的CSS代码。而且，在输入的过程中，工具会实时地显示出目前所输入的样式效果，这样我们可以随时调整和预览，非常方便。今天我要向大家分享一个前端开发的神器，它不仅可以帮助我们提高工作效率，还能带来快乐工作的体验，并且帮助我们按时下班。

这个算是我用的最多的，早期录的CSS视频，很多复杂点的效果都是用这个工具帮我生成，前列推荐。

Code Cola是一个能够查看网页代码样式的可视化CSS样式chrome扩展插件。在浏览原生网页的时候，是无法对网页设计就行修改的，但也会遇到需要调整当前网页布局、更改展示样式的情况，这种时候就可以借助这款chrome扩展插件——Code Cola。Code Cola是一个可视化编辑在线页面css样式的chrome插件。下载扩展功能Code Cola扩展程序提供给用户查看网页版块中所有元素的功能...

小编的一位同事在校期间连续三年参加ACM-ICPC竞赛。从参赛开始，原计划每天刷一道算法题，实际上每天有时候不止一题，一年最终完成了 600+：凭借三年刷题经验，他在校招中很快拿到了各大公司的offer。入职前，他把他的刷题经验总结成1121页PDF书籍，作为礼物赠送给他的学弟学妹，希望同学们都能在最短时间内掌握校招常见的算法及解题思路。整本书，我仔细看了一遍，作者非常细心地将常见核心算法题和汇总题拆分为4个章节。

87,992

社区成员

224,698

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章