系统城装机大师 - 固镇县祥瑞电脑科技销售部宣传站!

当前位置:首页 > 系统教程 > 软件教程 > 详细页面

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

时间:2020-10-19来源:www.pcxitongcheng.com作者:电脑系统城

 

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

具体步骤如下:

1、首先进入到一个网页,如“百度经验”首页,会发现页面布局很好看,作为前端开发人员,想了解页面的div分布和模仿,那么请按“F12”进入审查元素框;

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

2、比如您想看右上角那个“分享让生活更美好”的div是如何实现的,点击鼠标右键,选择“审查元素”,那么在页面下面将出现该div的html代码,在其右侧是css样式代码;

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

3、您想要模仿写页面,总不能代码一行一行敲,那么您可以在下图蓝色选择的一行代码右键,选择copy,则复制下这个div的代码啦,在获得html代码的同时,不要忘记右侧的css,顺便copy下来吧;

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

4、是不是觉得审查元素窗口好小,想放大,那么点击下图中类似屏幕的小图标吧,您将使得改窗口变成chrome的独立窗口,同样,再点击下这个图片,又会回到原先的嵌入式窗口模式了;

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

5、那么,对于手机页面的开发,我们如何在pc上实现呢?点击 “Emulation",如果您想选择手机型号,则可以”select model“;

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

6、console平台的妙用,在其中,您可以调试DOM元素和页面解析错误显示等等。

谷歌浏览器审查元素如何使用 谷歌浏览器审查元素的使用技巧

上述给大家讲解的便是谷歌浏览器审查元素的详细使用方法,如果你也感兴趣的话,可以了解一下上面的使用技巧吧,希望帮助到大家。

分享到:

相关信息

  • 有市怎么设置粉丝通知 有市设置粉丝通知的方法步骤

    您是否正在寻找如何关闭有柿软件的粉丝推送通知?该功能允许您在获得新粉丝时收到通知,但您可以根据需要选择禁用它。php小编新一将引导您完成以下内容中设置的详细步骤,帮助您管理粉丝推送通知设置。...

    2024-07-18

  • 如何解除闲鱼资金保护

    闲鱼资金保护解除条件:1.双方协商一致;2.商品质量问题;3.卖家无法发货;4.其他平台核实特殊情况。解除流程:1.联系对方协商;2.填写《资金保护解除申请》;3.提交申请;4.平台审核后解除。解除前需充分沟通,平台处理时间约为 1-3 ...

    2024-07-18

系统教程栏目

栏目热门教程

人气教程排行

站长推荐

热门系统下载