1.我们都知道chrome浏览器打开开发者工具的Sources 栏可以查看css文件,并且可以实时修改样式,查看效果,但是这里修改的内容并不会保存到源文件中。

2.   以下方法可以使在chrome浏览器中修改的样式同时更新到源文件中。

(1) 在Sources面板空白处右键,将项目文件添加到工作区中,选择项目文件路径——选择允许,如下图所示:

(2)添加后,面板中会出现一个项目文件夹,但是此时的项目文件与浏览器中打开的文件并没有关联起来。

(3)选择一个相应的文件,右键——Map to netWork resource 进行文件关联。

(4)关联后,面板中只剩下一个项目文件夹。

(5)此时再对css文件进行修改,在浏览器中其实是对源文件的修改,可以直接查看效果,是不是方便很多哈哈。

Chrome_调试CSS的更多相关文章

  1. 如何在普清的屏上调试CSS样式二倍图背景

    背景: 最近就遇到一个同事的项目,还是像平常一样小心切图,认真对像素. 一切测试都没有问题,顺利上线. 但是,上线之后,产品经理跑过来说,有BUG. BUG描述:(不认为是BUG) 前端页面上的图标是 ...

  2. SharePoint远程调试CSS

    1.在浏览器中找到需要调试的样式文件: 2.在SharePoint打开对应的文件,直接修改看到效果:

  3. 趣图:后端工程师是怎样调试CSS的

      一大波趣图:CSS的力量 趣图:前端 VS 后端

  4. Sublime + Chrome 本地调试 CSS 选择器

    生成简单的 HTML 代码 使用MacDown写 Markdown,快捷键ALT+CMD+C拷贝成 HTML 代码 粘贴到 Sublime 中,加上 body 标签和 css 头 html <h ...

  5. Chrome_调试js出现Uncaught SyntaxError: Unexpected identifier

    转载自:http://blog.csdn.net/yiluoak_47/article/details/7663952 chrome下运行编写的JavaScript代码时,在工具javascript控 ...

  6. CSS调试小技巧 —— 调试DOM元素hover,focus,actived的样式

    最近学习html5和一些UI框架,接触css比较多,就来跟大家分享一下css中的一些调试技巧.之前做页面,css都是自己写的,所以要改哪里可以很快的找到,现在使用了UI框架,里面的样式是不可能读完的, ...

  7. 移动端页面(css)调试之“weinre大法”

    移动端页面调试一般分两步.第一步我们需要把本地(pc端)写的页面效果展现在移动端,一个很方便的办法是用 fiddler 作为代理,具体可以参考 如何用 fiddler 代理调试本地手机页面,这样我们就 ...

  8. 小技巧 - CSS中:hover调试

    在调试CSS的时候,我一般使用Chrome的F12开发者工具,或者FireFox的FireBug直接在元素上面修改好Style后,再写入到CSS中.前几天遇到一个问题就是a:hover,鼠标一移开效果 ...

  9. CSS实现进度条和订单进度条

    最近半个月为了期末考试,可要了学渣我半瓶血啊!今天本该好好复习的,可是状态不好,就随便找点乐子玩一玩,于是乎就想起之前面试时面试官给的一道题(见标题),那就弄点简单的小玩意给自己洗洗脑咯. 简单地效果 ...

随机推荐

  1. Docker常见命令

    docker制作Images docker build -t 镜像名 .(“.”最后这一个点不能忽略) docker 运行Images docker run --name=容器名 --net=host ...

  2. loadrunner下的putty和plink

    loadrunner中是有集成plink和putty的,难怪可以通过监控机监控linux上的负载情况呢,可以通过这个命令来进行访问:C:\Program Files\Mercury\LoadRunne ...

  3. 51nod1967 路径定向 Fleury

    题目传送门 题解 几乎是Fleury模板题. 一开始我们把图看作无向图,然后对于度为奇数的点增边,使得整个图的所有点都是偶数的. 然后跑一遍欧拉回路 Fleury ,所有的边就定向好了~ 代码 #in ...

  4. ORA-12154: TNS: 无法解析指定的连接标识符 问题

    ORA-12154: TNS: 无法解析指定的连接标识符 问题:https://zhidao.baidu.com/question/397519550.html

  5. 047 SparkSQL自定义UDF函数

    一:程序部分 1.需求 Double数据类型格式化,可以给定小数点位数 2.程序 package com.scala.it import org.apache.spark.{SparkConf, Sp ...

  6. 027 ResourceBundle.getBundle方法

    在程序中遇到这个,感觉会比较重要,就学习一番. 一:静态读取配置文件的Demo 1.新建工程 2.新建properties 3.新建Java的demo程序 注意不要写properties. packa ...

  7. URL简介

    一般来说,http请求都会和URL地址有关,那么今天就来说说URL的组成部分. 实例:http://192.168.1.12/phpwind/searcher.php?keyword=phpwind& ...

  8. bind注意事项(传引用参数的时候)

    默认情况下,bind的那些不是占位符的参数被拷贝到bind返回的可调用对象中. 当需要把对象传到bind中的参数中时,需要使用ref或者cref. 例如: #include<iostream&g ...

  9. BUG总是存在的

    遇到了一个Bug 前段时间,添加功能的时候,在其他页面的Html中(django)的python调用{{}}中不小心按多了一个空格. 这导致这个值在读取的时候,读取多了一个空格:split的时候,多分 ...

  10. python——比return优先级更高的语句

    调用sqlmap,使用sqlmap做二次开发的时候,出现的问题: 在调用sqlmap中return,然而主程序还是会被sqlmap中的某些代码给中断. 添加try也无法阻止中断. 后来猜测中断是由ex ...