-
在CSS中，margin用于控制元素与其他元素之间的距离，padding用于控制元素内容与边框之间的距离。1.margin设置：一个值设置所有方向；两个值设置上下和左右；三个值设置上、左右、下；四个值分别设置上、右、下、左。2.padding设置方式与margin类似。3.避免margin合并问题，可使用padding或BFC。4.使用box-sizing:border-box;使宽高包括padding和border。5.性能优化时，统一使用类名设置margin和padding。合理使用margin和pa
-
最常见的原因是外部CSS文件未正确引入，包括路径错误、加载顺序不当、缓存问题或MIME类型不匹配，需检查link位置、href路径、Network响应及样式覆盖情况。
-
Flex项目高度不一致源于align-items默认stretch且内容高度不同，解决需统一min-height并区分align-items（项级对齐）与align-content（行级对齐）。
-
display:none仅隐藏渲染但不阻止资源加载和JS执行，导致autoplay触发、图片预加载及CPU消耗；应优先用hidden属性或服务端剔除HTML，配合JS实例销毁。
-
JavaScript事件响应由事件循环与队列决定：交互事件入队，调用栈空时执行；宏任务与微任务分层处理；动态元素需委托监听；stopPropagation与preventDefault作用不同；事件对象仅在回调中有效。
-
<link>标签是HTML中引入外部CSS的唯一标准化方式，必须写rel="stylesheet"才能生效，需置于<head>内、使用可解析的相对路径，禁用@import以避免性能与兼容性问题。
-
JavaScript函数作用域指function内声明的变量、函数仅在该函数内可访问；仅function创建作用域，{}不创建；var受函数作用域和变量提升影响，let/const为块级作用域；闭包依赖函数作用域但易致内存泄漏。
-
本文详解如何在D3v3中为甜甜圈图（donutchart）正确绑定数据，解决d.data为undefined的常见问题，并确保mouseenter事件中能安全访问原始数据以支撑Tooltip功能。
-
使用position:sticky结合媒体查询和弹性布局可实现响应式固定侧边栏。1.设置position:sticky与top值使侧边栏在滚动时吸附；2.通过媒体查询在移动端隐藏或抽屉式展开；3.采用Flex布局适配不同屏幕；4.避免fixed定位导致的脱离文档流问题，确保容器无overflow:hidden以保障sticky正常工作。
-
微博HTML5网页版无独立清除入口，需通过开发者工具手动删除localStorage中search/history相关键值（如search_suggest_history）来清空搜索补全缓存。
-
利用:hover与transition实现颜色过渡；2.通过::after创建滑动下划线；3.使用::before配合transform实现背景渐显；4.添加伪元素箭头并控制显隐与位移。核心是结合伪类与高效CSS属性，确保动画流畅自然。
-
实现响应式卡片翻转布局需结合CSS3D变换与弹性布局。1.结构上每张卡片由包含前后两面的容器组成，通过position和backface-visibility控制显示；2.利用perspective、transform-style:preserve-3d及rotateY实现翻转动画，hover时触发transition过渡；3.布局采用Grid的repeat(auto-fit,minmax(250px,1fr))或Flex的flex-wrap配合gap，使卡片在不同屏幕自适应排列；4.注意移动端触控支持与
-
meta标签必须置于<head>中且语法正确，否则无效。常见问题包括位置错误、属性名或值书写错误、浏览器缓存及SEO延迟生效。关键标签如charset、viewport、description需按标准格式书写，并通过开发者工具或平台验证是否生效。
-
新闻页面应以HTML5article标签构建语义化结构，用CSS实现响应式排版，JavaScript增强交互，严格遵循SEO与无障碍标准。
-
前端数据持久化主要有Cookie、localStorage、sessionStorage和IndexedDB四种方案：Cookie小容量且随请求发送，适合存token；localStorage大容量持久存储字符串；sessionStorage仅限当前会话；IndexedDB支持复杂结构化数据的异步操作。
