-
使用CSS伪元素::before和::after可为元素添加提示图标或文字，无需额外HTML标签。1.::before和::after通过content属性在元素前后插入内容，常用于添加装饰性图标或提示信息；2.必须设置content属性，否则伪元素不显示；3.利用::before可创建圆形问号图标，样式由CSS控制，保持HTML语义清晰；4.使用::after结合:hover可实现悬停显示提示框，需配合position定位；5.可引入字体图标如FontAwesome，通过Unicode字符显示专业图标，
-
super关键字用于子类调用父类的构造函数和方法。1.子类constructor中必须先调用super()才能使用this；2.可通过super.method()调用父类实例方法；3.在静态方法中可用super调用父类静态方法，实现逻辑复用与继承。
-
使用CSStransform:translate()配合@keyframes可实现流畅卡片滑动动画。通过translateX()实现水平滑入，如从右侧滑入视图；结合opacity用translateY()实现垂直滑下；同时使用X、Y轴位移实现斜向移动；设置关键帧百分比与steps()函数可创建无限轮播效果；利用GPU硬件加速提升性能，添加will-change优化渲染，避免重排重绘，确保动画高效流畅。
-
<aside>是语义标签而非视觉侧边栏，需配合CSS实现布局；Flex推荐main{flex:1}+aside{width:300px;flex-shrink:0}；Grid推荐grid-template-columns:1fr300px并用gap控制间距。
-
使用:nth-child选择器可精准设置列表前几项样式。1.li:nth-child(-n+3){color:red}将前3项设为红色；2.分别定义li:nth-child(1)、li:nth-child(2)等可实现前三项不同颜色；3.li:not(:nth-child(-n+3)){color:#999}使第4项起变为灰色，突出前几项。该方法兼容性好，适用于ul、ol等列表结构，需注意HTML结构清晰以确保选择器准确匹配。
-
Atom本身不运行HTML，它只是文本编辑器；真正“运行”需通过浏览器打开（如拖入Chrome）、起本地服务器（如atom-live-server或python-mhttp.server），否则file://协议会导致CORS、路径解析等错误。
-
统一使用box-sizing:border-box可解决卡片尺寸不一致问题，需全局设置并显式声明于卡片组件，配合图片约束、字体控制及flex/grid布局确保对齐稳定。
-
Markdown原生不支持==text==高亮语法，因CommonMark未定义该语法，多数工具默认忽略或原样输出；最兼容方案是直接使用<mark>标签，GitHub除外，Jekyll等静态站支持。
-
断点应基于真实设备分布和内容容器需求选择，优先用min-width实现移动优先渐进增强，通过DevTools观察内容挤压宽度确定具体值，避免硬套设备分类或过时数值，注意JS与CSS媒体查询同步问题。
-
HTML自动补全由编辑器（如VSCode）提供，依赖Emmet、语言模式为HTML、设置项html.autoClosingTag和html.suggest.html5启用，且需排除runonsave等插件干扰；非标准标签需通过html.customData引入自定义Schema。
-
JavaScript正则关键在写对用稳：字面量适合静态，newRegExp适合动态但需双写反斜杠；match/exec/test/replace行为差异大；常见失败因转义、标志、边界处理不当；应平衡性能与可读性，复杂场景优先用专用解析器。
-
<p>Autoprefixer能自动为CSS属性添加浏览器厂商前缀，基于CanIUse数据和目标浏览器配置，通过npm安装并集成到PostCSS、Webpack等构建工具中，在package.json或.browserslistrc中设置浏览器规则（如>1%、IE>=10），再于postcss.config.js引入插件，处理后可将现代CSS转为兼容性代码，例如为flex、transition等属性补全-webkit-、-moz-等前缀，一次配置即可自动维护。</p>
-
v-html不自动转义，直接插入HTML存在XSS风险；它绕过Vue编译，不解析插值、指令，也不响应数据变化；安全使用须前置清洗（如DOMPurify），禁用裸传用户输入。
-
linear-gradient()是background-image的值，需配合颜色停止点使用；方向可写toright或45deg等，不写默认tobottom；颜色透明度表达方式须统一；简写background会清空渐变，应单独设background-image或将渐变置于background值最前。
-
本文详解如何用BeautifulSoup定位HTML中的<ol>列表，逐项解析每个<li>子元素，并安全提取标题、链接、描述和时间戳等字段，生成结构化字典列表。
