HTML中级题库第 2 组，共 12 张卡片。
HTML · 中级 02
<div id="box" style="width:200px;padding:10px;border:5px solid;box-sizing:content-box;overflow:auto">
<div style="width:400px;height:20px"></div>
</div>
<script>
console.log('inner', box.clientWidth);
console.log('outer', box.offsetWidth);
</script>
假设无纵向滚动条，浏览器缩放为 100%，且没有其他样式覆盖。
在 content-box 下，声明的 width: 200px 只表示内容区宽度。
如果需求只是多行纯文本输入，原生 textarea 已提供表单提交、键盘操作、焦点、可访问名称和输入行为等完整基础能力。
BroadcastChannel 为同源浏览上下文提供按频道名称广播消息的能力，适合当前已打开的标签页、窗口或相关上下文之间传递短暂通知。
两个页面的协议相同但主机不同，因此不属于同源。
contenteditable 让普通元素的内容可由用户编辑，但不会把 div 变成原生表单控件，也不会自动赋予 value、name 或表单提交语义。
新窗口若能取得 window.opener，恶意或被攻陷的目标页面可能尝试操纵来源页面。
应使用带有正确 as、type 和 crossorigin 属性的 preload。
当响应式图片涉及艺术指导，也就是不同视口需要不同裁切或构图时，应使用 picture 与多个 source 描述媒体条件，再由各自的 srcset 提供…
content-visibility: auto 允许浏览器跳过远离视口内容的布局和绘制等工作，同时元素仍存在于文档结构中。
语义化的核心不是更换标签名称或调整视觉效果，而是让元素类型准确表达内容角色与层级。
要让一个元素成为可接收外部文件的放置目标，通常必须在 dragover 事件中调用 preventDefault()。
preload 只声明当前页面将很快使用某项资源，并以指定类型提高其获取优先级，它本身不会把 CSS 应用到文档。