-
Bootstrap分页默认横向,需通过CSS覆盖.pagination{flex-direction:column;}实现纵向,并确保样式优先级高于原生规则,同时注意焦点顺序、触摸热区和无障碍支持。
-
纯CSS无法精确绘制独立、不闭合、可定向的弧线,仅能通过border-radius裁角或clip-path裁椭圆实现;前者僵硬但兼容好,后者灵活但Safari/IE支持有限;真正按角度精控需用canvasarc()。
-
summary的outline无法仅用outline:none清除,需同时设置summary:focus、summary::-webkit-details-marker、summary::-moz-focus-inner等规则,并注意可访问性影响。
-
JavaScript代码混淆通过变换变量名、控制流和字符串加密等方式,使源码难以理解但功能不变,常用工具如Obfuscator.io和JavaScriptObfuscator可实现名称压缩、控制流扁平化和字符串加密;然而过度混淆可能导致性能下降和误报风险,且无法完全阻止逆向分析,因此需结合后端校验、接口限流、WebAssembly等手段构建多层防护体系。
-
用CSS变量控制滚动位移易断层,因--offset自由增长未归一化;需JS将其限定在[0,100vw]内重置,或采用双容器错位法实现无缝滚动。
-
绝对定位是开关轨道和按钮的首选,因其能使滑块脱离文档流、紧贴轨道边缘移动且不破坏父容器结构,但前提是轨道必须设为position:relative。
-
:first-of-type选中父元素中同类型标签的第一个,:last-of-type选中最后一个;两者按元素类型匹配,常用于去除首段边距或隐藏末项边框等场景。
-
幽灵空白节点能撑开父盒子高度是因为它作为行内级、零宽度、继承父级font-size和line-height的不可见盒子参与行框构建,而父容器高度由行框总高度决定;vertical-align通过改变对齐基准点间接影响行框底部位置;最可靠方案是font-size:0+vertical-align:bottom+flex布局组合。
-
SVG不支持alt属性,装饰性SVG需加aria-hidden="true",功能性SVG应使用aria-label或aria-labelledby,数据可视化SVG必须配<title>、<desc>和aria-roledescription="chart"。
-
要让多个CSS动画不“错拍”,需确保所有动画的起始时间(animation-delay)和持续时间(animation-duration)均一致,使播放窗口完全对齐;推荐用CSS自定义属性统一管理时序参数,并避免JS启停导致的微时差失步。
-
fetch触发OPTIONS预检当使用PUT/DELETE等非常规方法、含自定义请求头或非标准Content-Type时;前端可降级为简单请求规避,但需后端配合,且credentials需显式设为include并配对应响应头。
-
用padding-bottom实现宽高比裁剪是因为其百分比值基于父容器宽度计算,可纯CSS锁定比例;需配合position:relative与绝对定位子元素,并用object-fit:cover实现居中裁剪。
-
Vue模板HTML嵌套需遵循原生HTML内容模型,禁用非法嵌套(如p内嵌div),template仅作逻辑容器,v-html绕过编译但无响应式,slot和动态组件保障安全嵌套与响应性。
-
全选功能需通过事件委托与状态聚合实现双向同步:全选框change触发子项.checked批量更新,子项change委托至父容器并过滤disabled项计算indeterminate状态,避免setAttribute和计数器误判。
-
label标签必须正确关联表单控件:优先用隐式包裹(input嵌套在label内),显式绑定需确保for与id严格一致;仅可聚焦控件支持关联,错误绑定将导致无障碍失效。