-
padding用于设置元素内容与边框间的距离,提升可读性和视觉舒适度;其值不可为负,会增加元素实际占用空间。通过单、双、三、四值写法可分别设置不同方向的内边距。在标准盒模型中padding会扩大元素尺寸,而box-sizing:border-box则将其包含在宽高中,便于布局控制。常用于文本容器、按钮、导航菜单及响应式设计,是实现精准布局的基础。
-
移动端background-attachment:fixed失效是浏览器主动禁用策略,iOSSafari早废弃、AndroidChrome84+默认忽略;最稳妥方案是用position:fixed+独立div模拟固定背景。
-
flex-basis设百分比无效是因为父容器缺少明确的主轴尺寸(如width/height),导致浏览器无法解析而回退到auto;需确保父容器有display:flex、正确flex-direction及显式主轴尺寸。
-
IE10必须用display:-ms-flexbox替代display:flex,且需配套-ms-flex-pack、-ms-flex-align等旧属性;flex缩写无效,须拆解为-ms-flex-positive/-negative/-preferred-size;兜底推荐display:table。
-
OKLCH是基于人眼感知建模的色彩空间,调L不偏色、调C不变亮、调H不失饱和;参数需带百分号(L为0%–100%),混用色彩空间会导致插值失效,全程统一使用才能发挥感知均匀优势。
-
默认插槽的后备内容直接写在<slot>标签内,仅当父组件未传入内容时生效,支持文本、HTML、组件及动态绑定,但仅作用于无name属性的默认插槽。
-
<progress>标签需同时设置value和max属性才能正确显示进度,如<progressvalue="65"max="100">;仅设value会导致解析异常;兼容IE需降级为<div>模拟,动态更新须校验边界并用requestAnimationFrame实现平滑动画。
-
未清理的事件监听器导致DOM移除后回调仍占用内存;2.闭包不当引用大型对象阻碍回收;3.全局变量意外增长积累内存;4.定时器依赖大型对象使内存无法释放。
-
答案是调试CSS选择器需结合开发者工具排查匹配失败、优先级冲突等问题。首先检查选择器是否正确命中元素,利用F12工具查看Styles面板及document.querySelector验证;其次分析样式覆盖情况,关注删除线属性和!important影响;通过实时编辑、调整选择器特异性或重构HTML结构优化定位;注意拼写、空格、伪类顺序等常见陷阱,提升调试效率。
-
HTML5模板是符合标准的静态HTML文件,不可import或require;应直接打开或用本地服务器访问,注意路径、script加载属性、viewport标签及id/class命名规范。
-
<option>标签用于定义<select>、<optgroup>或<datalist>中的可选项,用户看到的是标签文本,提交的是value值;2.构建友好下拉菜单需搭配<label>、name属性、optgroup分组及“请选择”提示项;3.在<datalist>中<option>提供智能提示而非强制选择,兼顾灵活性与引导性;4.常见误区包括混淆显示文本与value值、忽视无障碍访问、动态加载处理不当及缺乏多端测试,均需
-
应在:root中定义带语义的CSS变量(如--color-btn-primary-bg),用HSL值便于计算,所有var()调用必须含fallback,变量不可嵌套在媒体查询或class内,JS通过document.documentElement.style.setProperty动态修改。
-
虚线撕裂效果需用linear-gradient模拟可控锯齿,因原生dashed渲染不一致、打印易失效;水平撕裂用repeat-x梯度,垂直/弧形边缘用radial-gradient拼接,并须在@mediaprint中重写背景、避免outline/box-shadow、设明确高度。
-
是,但必须由主线程通过transferControlToOffscreen()移交OffscreenCanvas实例,Worker内不可直接new;Chrome69+、Firefox72+支持,Safari17.5仍不支持。
-
可用--rating变量控制星星填充比例,通过background-clip:text+渐变或clip-path:inset()实现,取值0–100,需设默认值、防NaN并注意浏览器兼容性。