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

我们首先第一反应就是:

  • “按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. 2019-11-19-git-修改commit日期为之前的日期

    title author date CreateTime categories git 修改commit日期为之前的日期 lindexi 2019-11-19 08:53:16 +0800 2018- ...

  2. CENTOS7安装R语言环境

    CENTOS7安装R语言环境 yum install texinfo.x86_64 yum install texlive.x86_64 cd /opt wget https://mirrors.tu ...

  3. "不用谢" 的11种表达

    说Thank you ,机械版的反应you are welcome.虽然没错,但实在太老掉牙,在国外使用率不高: 随性,不足挂齿的小事 Not a problem 别放在心上 Any time 有事随 ...

  4. 08Redis入门指南笔记(集群)

    即使使用哨兵,此时的 Redis 集群的每个数据库依然存有集群中的所有数据,从而导致集群的总数据存储量受限于所有节点中,内存最小的数据库节点,形成木桶效应. 对 Redis 进行水平扩容,在旧版Red ...

  5. 「POI2012」约会 Rendezvous

    #2691. 「POI2012」约会 Rendezvous 这题我简直不想说什么了,什么素质,卡常数…… “每个顶点有且仅有一条出边”,所以是一道基环树的题,首先tarjan缩点,在缩完点后的图上求a ...

  6. oracle计算记录条数

    和一般的观点相反, count(*) 比count(1)稍快 , 当然如果可以通过索引检索,对索引列的计数仍旧是最快的. 例如 COUNT(EMPNO)

  7. PHPstorm相关设置以及快捷键

    转自:http://blog.csdn.net/fenglailea/article/details/12166617 1.界面中文方框问题 Settings->Appearance中Theme ...

  8. 阿里云ECS服务器活动99元一年,最高可买三年

    这几天阿里云 99一年.279三年的服务器活动如火如荼,和之前腾讯三年的服务器非常类似,非常低的价格换取非常高的价值,当然,通常情况下便宜没好货的,想要玩一下的老铁可以进阿里云去看看,阿里云270三年 ...

  9. HDU 1372

    题意:模拟国际象棋马的走棋方式,和中国象棋一样马走日,8X8的棋盘,问从起点到终点的最短步数,国际象棋中数字代表行row,字母代表列column, 思路:记忆化深搜. #include<cstd ...

  10. Mule自带例子之stockquote

    1 配置效果图 2 配置文件 <?xml version="1.0" encoding="UTF-8"?> <mule version=&qu ...