对比两个CSS文件的不同之处

html-css012

对比两个CSS文件的不同之处,第1张

1、打开Dreamweaver选择右键css样式-附加样式表。

2、选择任意2个范例样式表。

3、选择完成后点击右上方CSS可以看到两个样式表,选择任意一个双击即可打开,然后就可以看到两个CSS样式表的定义内容和区别。

1.我们以谷歌浏览器为例,来讲讲怎么调试CSS。先打开谷歌浏览器,看截图里的红色箭头,点击“工具”,点击“开发者工具”,就打开调试工具了,也可以按下快捷键F12来打开调试工具;

2.打开的调试工具如下图所示:

3.我们就以百度的首页为例,看看调试效果。看截图,点击那个“抓取元素”的按钮,来获取要审查的元素;

4.看截图,出现下面的界面后,点击“style”,单击那个对勾,就可以看到效果了;

5.我去掉一些样式之后,就出现了下面的效果,看截图;

作为曾经的web前端工程师,来答一发。

jsonView Chrome插件

这是一个Chrome浏览器的json视图的插件。这个插件非常强大的,不仅可以把你在浏览器输出的json数据格式化,也可以将浏览器的xml格式的文件格式化,非常非常的方便,尤其是前端同学在查看api数据的时候,无需再去各种json格式化网站逐个匹配了~~~~强烈推荐!!

WebStorm IDE开发工具

这是款前端开发的ide。基本上前端开发中你能想到的,他都可以帮你实现了,语法高亮,代码补全提示,terminal终端连接,mysql操作功能,集成一体,甚至php都可以写,异常的强大,非常重的一个前端开发工具,推荐。

Hbuilder 一个可以云打包html5app的开发工具

Hbuilder是一个国内互联网公司DClound开发的ide,这款ide非常的强大,专门为了Html5所打造的一款ide,如果你不想做原声的Android和iOS APP,那么你可以通过在Hbuilder上开发webapp,之后通过Hbuilder的云打包打包成自己的apk或者.ipa的文件,一秒钟可以打包你的安卓或者iOS APP。如果你不想云打包的话,你可以本地打包,可以下各种插件,是一款非常强大的免费前端H5的ide,强烈推荐!

SessionBox 可以随意切换你的Session的Chrome插件

sessionBox是一块可以让你随意切换你的session的Chrome插件~ 用户还可以给不同的session设置各种颜色,方便地标识session;SessionBox只对那些把网页的状态保存到session中的才有效果。顺便提供一下SessionBox的官网:https://sessionbox.io   ;对于起那段同学来说,切换Sesssion几乎成了必不可少的一项工作,如果你使用了sessionbox,将会大大的减轻你的工作量,同时这个插件对于后端开发的RD同学也将是大大的帮助。

目前介绍了以上四款工具,建议题主可以尝试一下,都是非常不错的工具,虽然我现在不在是前端,但是对于除了webstorm之外的三款工具我都是经常会使用的;至于我为什么不使用webstorm是有原因的,因为我现在已经是作为一枚后端RD的存在,目前在公司开发机上只能用vim开发~~