-
HTML预定义颜色名称包括基础色如black、white、red、green、blue、yellow、cyan、magenta，灰度色如gray、darkgray、lightgray、silver，以及扩展色如orange、purple、pink、brown、lime、navy、olive、teal、maroon、aqua、fuchsia，可直接用于CSS中提升开发效率。
-
首先用文本编辑器编写HTML代码并保存为.html文件，然后通过双击用浏览器直接打开即可查看效果；推荐使用VSCode等专业编辑器提升效率，对于需要服务器环境的功能可借助Node.js或Python启动本地服务器运行。
-
清除浮动是确保多列布局稳定的关键，因浮动元素脱离文档流会导致父容器高度塌陷。常用方法包括：使用伪元素::after添加clear:both，通过overflow:hidden触发BFC，或在HTML中插入clear:both的空元素。其中伪元素法最推荐。现代布局建议采用Flexbox或Grid，可天然包含子元素，避免浮动问题，但在兼容旧项目时仍需掌握清除浮动技巧。
-
使用::selection伪元素可自定义文本选中时的颜色和背景色，如::selection{color:white;background-color:blue;}，并需添加::-moz-selection以兼容旧版Firefox。2.::selection仅支持color和background-color属性，其他如font-size等无效。3.为确保兼容性，应同时定义::selection和::-moz-selection。4.虽然::selection功能有限，但可通过JavaScript监听sele
-
HTML属性通过提供额外信息提升网页可访问性和用户体验：1.alt属性为图片提供替代文本，帮助视障用户理解内容；2.title属性显示工具提示，补充上下文信息；3.aria-开头的WAI-ARIA属性如aria-label、role等增强复杂组件的语义，支持屏幕阅读器；4.全局属性如lang和dir明确语言与文本方向，优化多语言支持；5.tabindex确保键盘导航的可达性，使所有用户均可操作页面元素。这些属性共同构建了包容性强、体验良好的网页环境。
-
优化表单体验的核心是降低用户负担。1.精简字段，仅保留必要项，拆分长表单为多步骤；2.使用明确标签、合理顺序和占位符辅助；3.设置合适input类型、自动聚焦与填充，适配移动端；4.实时验证并用颜色图标提示错误，提供具体反馈；5.提交按钮使用行为动词，防重复提交，失败保留数据，成功给予引导。细节决定流畅度。
-
使用Flexbox布局可实现底部固定页脚，通过设置容器min-height:100vh和display:flex，主内容区flex:1自动撑开，页脚自然置于底部，兼容性好且简洁高效。
-
JavaScript实现全屏功能的核心是调用DOM元素的requestFullscreen()方法并配合document.exitFullscreen()退出全屏，1.首先通过用户手势触发全屏操作，调用目标元素的requestFullscreen()方法，并兼容不同浏览器前缀如webkitRequestFullscreen、mozRequestFullScreen、msRequestFullscreen；2.退出全屏时调用document.exitFullscreen()及其对应前缀方法；3.监听full
-
text-shadow和box-shadow分别用于文字和元素阴影，提升视觉层次；前者通过水平、垂直偏移及模糊半径增强文本可读性，如标题发光或描边效果；后者为按钮、卡片等添加外阴影或内阴影，营造立体感；两者结合使用可强化整体设计表现，但需控制透明度与模糊度以避免页面过重。
-
不应混合使用Flex与Float，因Flex子项会忽略float属性，导致冗余代码和维护困难；应选择Flexbox或Grid作为现代布局方案，保持样式清晰可维护。
-
JavaScript模块循环依赖不会语法报错但会导致undefined或不完整对象，因ESM静态求值和CommonJS执行时机问题；修复首选重构拆分、次选延迟获取、三选CommonJS动态赋值。
-
使用rem单位并重置默认样式可解决字体大小不一问题。首先在html根元素设置font-size:16px，统一基准；其次用rem替代em避免嵌套放大；再通过CSSReset消除h1-h6等标签的浏览器默认样式差异；最后利用开发者工具检查继承后的计算值，确保样式一致性。掌握单位特性与继承机制是关键。
-
标准HTML文件需以<!DOCTYPEhtml>声明开头，嵌套<htmllang="zh-CN">根元素，内含<head>（含<metacharset="UTF-8">、<title>等）和<body>（含<h1>、<p>等），保存为.html后缀并用浏览器打开验证。
-
使用flex-grow:1可让子元素填满父容器剩余空间。需确保父容器设为display:flex，目标元素设置flex-grow:1，配合flex-basis与flex-shrink精确控制；常见于侧边栏固定、主内容区自适应布局，解决因未启用伸缩或缺失min-width等导致的填充失败问题。
-
JavaScript工厂模式是通过普通函数封装对象创建逻辑并返回新对象，不依赖new和构造函数，适合创建结构相似但属性不同的多个对象。
