浏览器篇

目录

• 浏览器渲染原理篇
• 浏览器内核篇
• 开发者工具
• CSS
• HTML
• JS

浏览器渲染原理篇

浏览器内核篇

开发者工具

整理所有关于开发这工具的一切！

CSS

• 计算样式：在“元素”面板中，查看元素的计算样式，了解最终应用的样式值。
• 盒模型：查看元素的盒模型，了解元素的尺寸、边距、边框和内边距。
• CSS 断点：在“源代码”面板中，设置样式表断点，当样式表被修改时，代码会暂停执行，帮助定位问题。
• 元素检查：右键点击页面元素，选择“检查”或按 F12 打开开发者工具，查看和修改元素的 CSS 样式。
• 实时编辑：在“元素”面板中，直接编辑 CSS 规则，实时查看效果。
• 样式层叠：查看元素的所有样式，包括用户代理样式、外部样式表、内联样式等，理解样式的层叠和优先级。

HTML

JS

• 实时修改代码 ：Shift+Enter 你可以尝试搭配使用 Shift+Enter 按键去输入多行代码

等等其他，