网页开发实现布局边界展示功能

原创 于 2021-04-04 17:44:30 发布 · 412 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #js #html #web开发 #网页设计

本文介绍了如何在Chrome浏览器中通过自定义书签，利用JavaScript代码快速查看网页布局边界。只需三步：右键书签栏选择'添加网页'，自定义名称并输入JS代码，保存后在目标网页上点击此书签即可查看布局。

以Chrome为例：

1.书签栏右键，选择‘添加网页’；
2.名称自定义，网址部分填写如下JS代码：
javascript:(function() {
   
    
	var style = document.querySelector('#_outline_');
	if (style) {
   
    
		style.
最低0.47元/天 解锁文章
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值