此工具是我们的必备工具,以后代码出了问题

我们首先第一反应就是:

  • “按F12”或者是 “shift+ctrl+i” 打开 开发者工具。
  • 菜单: 右击网页空白出---检查

  • 通过开发人员工具小指针工具,查找页面元素
  • 左侧是html页面结构,右侧是css样式

小技巧:

  1. ctrl+滚轮 可以 放大开发者工具代码大小。
  2. 左边是HTML元素结构 右边是CSS样式。
  3. 右边CSS样式可以改动数值和颜色查看更改后效果。
  4. ctrl + 0 复原浏览器大小

0011 开发者工具(chrome)的更多相关文章

  1. Chrome的开发者工具(Chrome Developer Tools)

    Chrome的开发者工具(Chrome Developer Tools) 按F12 https://developer.chrome.com/devtools/index http://www.w3s ...

  2. 浏览器开发者工具Chrome Developer Tool

    开发者工具Chrome Developer Tool https://developers.google.com/chrome-developer-tools/docs/profiles   一直被墙 ...

  3. Chrome开发者工具Debug入门

    译者按: 手把手教你摆脱console.log,掌握高级的debug方法. 原文: Learn How To Debug JavaScript with Chrome DevTools 译者: Fun ...

  4. Chrome开发者工具之测试应用

    一.Chrome开发者工具简介 浏览器的开发者工具(DevTools)可以帮助开发人员对网页进行布局,比如HTML+CSS,帮助前端工程师更好的调试脚本(JavaScript.jQuery)之类的,还 ...

  5. DevTool开发者工具

    DevTool开发者工具 chrome的开发者工具可以说是十分强大了,是web开发者的一大利器,作为我个人而言平时用到的几率很大,相信大家也很常见,但是不要仅仅停留在点选元素看看样式的层面上哦,跟着我 ...

  6. Chrome 开发者工具(DevTools)中所有快捷方式列表

    Chrome DevTools提供了一些内置的快捷键,开发者利用这些快捷键可以节省常工作中很多日的开发时间.下面列出了每个快捷键在Windows/Linux及Mac中的对应键.其中一些快捷键对于Dev ...

  7. Chrome开发者工具不完全指南:(三、性能篇)

    卤煮在前面已经向大家介绍了Chrome开发者工具的一些功能面板,其中包括Elements.Network.Resources基础功能部分和Sources进阶功能部分,对于一般的网站项目来说,其实就是需 ...

  8. Chrome开发者工具不完全指南(四、性能进阶篇)

    前言 Profiles面板功能的作用主要是监控网页中各种方法执行时间和内存的变化,简单来说它就是Timeline的数字化版本.它的功能选项卡不是很多(只有三个),操作起来比较前面的几块功能版本来说简单 ...

  9. Chrome开发者工具不完全指南(五、移动篇)

    前面介绍了Chrome开发者工具的大部分内容工具,现在介绍最后两块功能Audits和Console面板.一.Audits Audits面板会针对目前网页提出若干条优化的建议,这些建议分为两大类,一类是 ...

随机推荐

  1. 【NS2】用eclipse调试NS2(转载)

    相信很多喜欢Java的人对eclipse都情有独钟.NS2程序的调试,可以用打印命令调试,这样太繁琐.也可以用gdb调试,个人觉得上手比较困难.相信各位学习NS2的新手,在看代码的时候,很多的函数或者 ...

  2. JavaScript 验证API

    约束验证 DOM 方法 Property Description checkValidity() 如果 input 元素中的数据是合法的返回 true,否则返回 false. setCustomVal ...

  3. 测试安装phpmyadmin4.0

    在测试环境准备测试安装phpmyadmin,测试环境上为一台zabbix 3.4的服务器,已经安装lamp环境. 根据安装文档,从phpmyadmin官网上下载了4.0版本,复制到/var/www/h ...

  4. java代码简单实现队列

    1. 基于链表简单实现 import lombok.AllArgsConstructor; import lombok.Data; import lombok.NoArgsConstructor; / ...

  5. 用select提取List元素自身序号

    var cs = currentCitys.Select((c, i) => new { id = c.CITY_ID, 序号 = (i + 1).ToString(), 城市类型 = c.IS ...

  6. Java练习 SDUT-1239_水仙花数

    水仙花数 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 春天是鲜花的季节,水仙花就是其中最迷人的代表,数学上有个水仙花 ...

  7. A - Archery Tournament 动态开点+vecotor 神仙题

    存图还是像矩形一样的存,每个节点存所在区级内部的圆的编号,然后暴力判断,开始我也有这个想法,但是...这TM也能过...仔细想想,貌似好像是可以过,时间复杂度玄学无法证明.... #include&l ...

  8. 关于Java语言for循环内外变量定义的问题

    今天看书时,看到一个代码,一个在循环外面没有用的变量,后即有了我的问题,在后面: 我的问题: 变量循环内定义,例如:while(true){String splitStr = null;}这“些”个s ...

  9. day5_python之subprocess模块

    subprocess作用:用来执行系统命令它会开启一个子进程,通过子进程去执行一些命令 读取正确的命令执行结果,如果没有指定把结果输出到哪里,默认打印到屏幕上 #subprocess.Popen(r' ...

  10. codeforces 1230 div2

    C 给一个图,并且在边上放上多米诺骨牌,使得每个多米诺骨牌指向的顶点的数字是一致的,并且每种骨牌只能用一种.问最多能够覆盖多少条边. 先生成每一个点指向的数字,然后判断就好了. #include< ...