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

我们首先第一反应就是：

  • “按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. 25-1 request模块介绍

    requests模块 - 基于如下5点展开requests模块的学习 什么是requests模块 requests模块是python中原生的基于网络请求的模块,其主要作用是用来模拟浏览器发起请求.功能 ...

  2. Codeforces 662D International Olympiad【贪心】

    比赛的时候后缀长度在4位以内的时候分类讨论了一下,其实他们完全是一个套路的..并不需要讨论. 然后没有考虑前导0的情况,就wa了.. 题目链接: http://codeforces.com/probl ...

  3. sql select时增加常量列

    阅读更多 string sql="select a,b,'常量' as c from table" 注:单引号' ' 很重要,否则编译时会把其看成查询参数,从而提示参数未指定错误. ...

  4. HashMap的运用 计算3个班级的总成绩和平均成绩

    TestStudent.java package com.sxt.home; import java.util.ArrayList; import java.util.HashMap; import ...

  5. this 、静态变量

    /*作者:qingfeng日期:2017/2/18功能:this,静态变量(类变量)*/class Demo3_2{    public static void main(String args[]) ...

  6. call和apply用途与使用方法

    当你看代码时,经常会看到以下情形:(在这个博客里面,参数context是执行上下文的意思,params是参数的意思) Object.prototype.toString.call(context, p ...

  7. HDU3844 Mining Your Own Business

    HDU3844 Mining Your Own Business 问题描述John Digger是一个大型illudium phosdex矿的所有者.该矿山由一系列隧道组成,这些隧道在各个大型交叉口相 ...

  8. python实现以立春为起点n为周期任意日期所在的日期区间

    python实现以立春为起点n为周期任意日期所在的日期区间 需求 话不多说,直接上具体需求. ''' 以每年的立春作为起始点,每N天为一个单元,任给一个日期,返回该日期所在单元的起始和结束日期.例如: ...

  9. 最新版本的ADT使用问题

    昨天把androidsdk和adt更新到最新版本,android sdk r22版本. 更新完后原来的项目打包后出现第三方JAR包找不到,网上搜了半天终于找到问题所在: 新版本多了一个Android ...

  10. CSipsimple最新版本编译

    CSipsimple最新版本编译 CSipsimple是依赖pjsip协议,官网http://code.google.com/p/csipsimple/,官网上也有已经编译好的apk,对于编译CSip ...