浏览器调试css后,如何快速保存自己的修改?

时间:2024-05-31 12:34:48

有时候样式不合心意,想要直接在浏览器中调试一下,直接看清效果。调试是方便了,可是刚才改了哪些样式?东找找西找找,是不是还有什么遗漏的?下面来提供一种方便保存自己修改css的内容,告别记忆时代。

以下调试视图基于 QQ浏览器 对www.baidu.com进行,Google浏览器亦可实现同样操作

1. F12进入到调试模式,选中Elements选项卡
浏览器调试css后,如何快速保存自己的修改?

2. 点击调试页面上左上角的“选择元素”图标后,点击自己所要修改的元素,比如我要修改“百度一下”按钮,操作如下图所示
浏览器调试css后,如何快速保存自己的修改?

3. 根据下图步骤,对“百度一下”按钮做出对应的修改
浏览器调试css后,如何快速保存自己的修改?

4. 还有其他要修改的元素,重复2~3步即可
浏览器调试css后,如何快速保存自己的修改?

5. 怎么找到刚才修改的样式?点击一下下图所示位置即可
浏览器调试css后,如何快速保存自己的修改?

6. 你可以将该css直接复制到自己的代码上,也可以直接save as保存到本地文件中
浏览器调试css后,如何快速保存自己的修改?