推荐一个Chrome浏览器全局查看css布局的插件

yiBen_

于 2024-08-30 17:21:11 发布

阅读量124

点赞数 4

文章标签： chrome css 前端

本文链接：https://blog.csdn.net/Sawiue/article/details/141722815

版权

推荐一个Chrome浏览器全局查看css布局的插件

其他浏览器没有测试，有需要的可以自测下

在这里插入图片描述

1、

在这里插入图片描述

2、

// 添加如下代码到书签网址中，保存即可
javascript: (() => {
	const headElement = document.head;
	const styleElement = document.createElement("style");
	styleElement.setAttribute("debug-css", "");
	styleElement.innerText = "*{outline:1px solid orange;}";
	const debugElement = headElement.querySelector("[debug-css]");
	if (debugElement) return debugElement.remove();
	headElement.append(styleElement);
})();