Firebug折腾记_(2)HTML&CSS定位及调试小技巧_html/css_WEB-ITnose
Jun 24, 2016 am 11:38 AM
题外话
传统的开发我们是在编辑器操作代码保存,再到浏览器预览查看效果的;
而如今的firebug和chrome的内置调试器就不需要了..可以直接实时编辑且看到效果;
在调试中对代码的操作不会保存到本地实际代码中..是不是很赞!!;
- 进入调试工具界面,按下”瓢虫”旁边的小鼠标,再进行网页元素的选择
- 默认快捷键,Ctrl + shift + C
- 鼠标移动到网页的某一块元素,鼠标右键,使用Firebug查看元素
##HTML元素编辑
除了写死的代码结构不能操作外(比如DIV块标签),内部的各种属性和内容都支持实时修改和预览的;
修改其中内容,只要单击你选中的东东即可,会有一个小小的蓝色框框出来
比如:
HTML DOM选定
可以轻而易举的选定各种包裹层和父类,单击即可
CSS元素编辑(实时预览)
CSS像素微调技巧
CSDN不支持GIF动态图..所以没做…..百看不如一试
概览区域
全局自定义快捷键调用: ctrl+shift+alt+b,当然也可以点击”瓢虫进去”
Firebug全局快捷键,支持自定义
哪个和你的习惯冲突了.修改内部快捷键保存确定即可生效
版权声明:本文为博主原创文章,未经博主允许不得转载。

Article chaud

Outils chauds Tags

Article chaud

Tags d'article chaud

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Difficulté à mettre à jour la mise en cache des pages Web officielles du compte: comment éviter l'ancien cache affectant l'expérience utilisateur après la mise à jour de la version?

Comment utiliser les attributs de validation du formulaire HTML5 pour valider l'entrée utilisateur?

Quel est le but du & lt; iframe & gt; étiqueter? Quelles sont les considérations de sécurité lorsque vous l'utilisez?

Comment ajouter efficacement les effets de course aux images PNG sur les pages Web?

Quel est le but du & lt; mètre & gt; élément?

Quelles sont les meilleures pratiques pour la compatibilité entre les navigateurs dans HTML5?

Quel est le but du & lt; datalist & gt; élément?

Quel est le but du & lt; Progress & gt; élément?
