-
box-shadow属性通过设置水平偏移、垂直偏移、模糊半径、扩散半径、颜色和inset实现元素阴影效果，常用于按钮悬浮、卡片立体化和内凹设计，合理调整参数可提升界面层次感与交互真实感。
-
JavaScript错误处理通过try...catch捕获运行时异常，try执行可能出错代码，catch接收error对象（含message和name），finally无论成败均执行清理操作；异步需用async/await配合才能用try...catch捕获Promise错误。
-
CSSGrid可高效构建后台页面布局：通过grid-template-areas划分header、nav、main、footer区域，配合响应式媒体查询适配移动端，辅以gap、min-height等技巧提升实用性与可维护性。
-
使用word-break可解决标题过长导致的布局错乱问题，通过设置break-all等值控制换行行为，避免文本溢出容器。
-
设置OpenGraph标签可优化网页在社交媒体的分享预览效果，核心是通过在HTML的<head>中添加og:title、og:description、og:image、og:url、og:type等meta标签，主动向社交平台提供标题、描述、图片等信息，避免抓取混乱。同时建议配置TwitterCard标签以适配不同平台，使用FacebookSharingDebugger等工具验证并清除缓存确保生效，注意图片尺寸（推荐1200×630）、URL规范性和内容同步更新，提升点击率与传播效果。
-
要实现分页导航中当前页的样式控制，可通过CSS选择器精准选中元素并设置区别性样式。常见方法包括：1.在HTML中为当前页链接添加.current类，再通过CSS定义其样式；2.若无法修改HTML，可使用属性选择器如a[aria-current="page"]或伪类选择器:is()/:where()来匹配目标元素；3.为避免样式被覆盖，可提高选择器优先级，如使用更具体的选择器或在样式表末尾定义规则。此外，还需结合字体、背景等多维度区分当前页，并注意移动端识别性和兼容性问题。
-
使用数值（如400、700）比normal/bold等关键词更可靠，因后者依赖字体是否真实提供对应字重；未匹配时浏览器会模拟加粗或倾斜，导致模糊或失真。
-
::first-letter伪类可实现首字下沉，需作用于块级元素且首字符为可见符号；常用float、font-size、line-height等属性控制效果，兼容现代浏览器，中文同样适用。
-
Flexbox容器内文字不会自动随容器缩放，必须通过clamp()配合容器查询或ResizeObserver实现响应式字号。
-
严格模式通过显式报错暴露隐患：未声明变量赋值、undefined调用方法、重复参数名、只读属性赋值、with语句均抛出错误；需用"usestrict"双引号置于顶部或函数首行启用。
-
实现日历组件的步骤如下：1.创建HTML结构；2.使用JavaScript生成日历，展示当前月份日期；3.添加切换月份的按钮。该组件使用原生JavaScript操作DOM和处理日期，提供了基本的日期展示和月份切换功能。
-
响应式设计需以内容为主设置断点，结合Flexbox与Grid实现流动布局。从移动端优先出发，通过媒体查询在768px、1024px等关键点调整布局结构，利用flex-direction切换排列方式，使用minmax()和auto-fit创建自适应网格，并通过语义类名提升可维护性，最终实现跨设备自然过渡的页面体验。
-
浮动未清除会导致父容器高度塌陷、后续元素错位等问题，正确做法是使用伪元素clearfix或触发BFC；排查时需检查类名遗漏、样式覆盖及宽度溢出，并借助开发者工具验证布局。
-
JavaScript中无内置链表、栈、队列，但可用数组或对象灵活实现；链表适用于中间频繁增删，栈适用于后进先出场景如括号匹配与撤销功能，队列适用于先进先出场景如事件循环与BFS遍历。
-
必须使用<h1>至<h6>标签按层级嵌套标题，配合<section><article><header>等语义元素构建结构，禁止跳级、滥用或CSS模拟，确保SEO与无障碍合规。
