HTML标签主要分为三类：块级标签、行内标签和空元素标签。以下是每类的实例演示：块级标签（Block-level Tags） 举例：
HTML标签分为三类：1.结构标签，如<html>、<head>、<body>，定义网页基本框架；2.内容标签，如<h1>、<p>、<img>、<a>，用于显示实际内容；3.格式化标签，如<b>、<i>、<u>、<pre>，控制内容外观和排版。
设置HTML弹窗需结合HTML结构、CSS样式与JavaScript脚本。1.创建隐藏的HTML容器，通常使用<div>元素包含内容；2.通过CSS控制样式及显示/隐藏状态，设置position、z-index等属性确保弹窗覆盖页面；3.使用JavaScript监听用户事件（如点击）触发弹窗显示或关闭，并支持异步加载内容；4.避免浏览器拦截需确保弹窗由用户交互触发、避免页面加载自动弹出、使用标准API及减少频繁弹窗；5.实现无障碍访问需采用语义化标签、键盘导航、焦点管理及ARIA属性增强可访问
CSSID选择器适用于页面唯一元素、JavaScript交互和锚点链接，但应避免在可复用样式、复杂结构和团队协作中使用；1.用于唯一元素如页眉页脚确保精准样式；2.配合JavaScript操作DOM保持一致性；3.创建锚点链接跳转页面位置；4.避免复用场景改用类选择器；5.复杂结构优先后代或子选择器组合；6.团队协作减少命名冲突；7.命名规范采用清晰描述性ID；8.降低优先级结合类选择器或谨慎用!important；9.模块化CSS分解代码减少ID范围；10.使用BEM或预处理器提升组织管理能力。
i标签在CSS中主要用于展示斜体文本和图标。1)它是内联元素，适合文本流中使用。2)在HTML5中，i标签可表示“替代语音或声音”，常用于图标展示。3)结合FontAwesome等库，可以展示社交媒体图标。4)样式化简单，但需注意转换为块级或内联块级元素。5)推荐使用<em>标签表示强调。6)使用图标字体比图像文件更高效，但需考虑设备兼容性，SVG图标是备选方案。
CSS的cursor属性用于定义鼠标指针在元素上的样式，以提供直观反馈或增强体验。1.使用预定义值如pointer、text、wait等可快速设置指针样式；2.通过url()函数可使用自定义图像作为指针，并指定热点位置；3.可结合JavaScript动态改变指针样式；4.自定义指针不显示时需检查路径、格式、权限、缓存及优先级问题；5.优化用户体验应保持一致性、提供反馈、确保清晰度与性能、兼顾可访问性并避免滥用。
最靠谱的HTML标签资源是MDNWebDocs，其次是W3Schools。1.<html>、<head>、<body>是HTML文档的基础结构标签；2.<h1>到<h6>用于定义标题层级，提升SEO和可访问性；3.<p>是段落标签，用于包裹独立文本内容；4.<a>实现超链接功能，依赖href属性；5.<img>展示图片，src和alt属性至关重要；6.<ul>、<ol>、<li&g
CSS层叠通过重要性、特殊性、来源和顺序解决样式冲突，继承允许某些属性传递给后代元素。1.重要性：!important声明优先级最高；2.特殊性：选择器越精确优先级越高，如内联样式>ID选择器>类选择器；3.来源：作者样式覆盖用户和浏览器默认样式；4.顺序：相同条件下后定义的规则生效。并非所有属性默认可继承，如color等文本属性可继承，而margin等盒模型属性不可继承，可通过inherit关键字强制继承。合理利用层叠和继承可简化代码，例如设置全局样式、使用CSS变量、避免过度使用!impo
在CSS中，双冒号（::）用于选择伪元素。1.伪元素是HTML中不存在的元素部分，如::first-line选择段落的第一行。2.双冒号区分伪类和伪元素，使代码更清晰。3.伪元素如::before和::after可插入内容，增强视觉效果。4.需兼容旧版浏览器时，可同时使用单双冒号。5.伪元素不能选择已存在的元素，需谨慎使用以免影响可访问性。6.使用伪元素比创建额外HTML更高效，但需考虑对布局和性能的影响。
在JavaScript中查看字符串长度的方法是使用字符串的length属性。1)基本用法：letstr="hello";console.log(str.length);输出5。2)字符串操作会生成新字符串，影响长度：str=str+"world";长度变为11。3)Unicode字符可能占两个代码单元，导致length属性返回的不是实际字符数：letemoji="?";console.log(emoji.length);输出2。4)获取实际字符数的方法：functiongetCharacterCount(
实现图片懒加载的方法是使用JavaScript，通过IntersectionObserverAPI或回退到scroll事件监听。1）使用IntersectionObserverAPI检测图片进入视口时加载。2）如果不支持IntersectionObserver，使用scroll、resize和orientationchange事件手动检测。
HTML表格数据同步需依赖额外技术实现。解决方案包括：1.AJAX轮询，通过定时请求更新数据，适合非实时场景；2.WebSocket，提供全双工通信，适合高实时性需求；3.Server-SentEvents(SSE)，适用于服务器向客户端单向推送；4.前端框架如React、Vue利用数据绑定简化更新；5.GraphQLSubscriptions用于GraphQL后端的实时更新；6.数据库触发器结合消息队列实现解耦和可靠同步。选择技术时应考虑实时性需求、服务器支持、开发难度和性能，并可结合多种技术使用。前端
JavaScript的Array.prototype.slice方法用于从现有数组中提取指定索引范围的元素并生成新数组，且不会修改原数组。1.它接受两个可选参数begin和end，begin指定开始索引（默认为0，负数表示从末尾倒数），end指定结束索引（不包含该索引元素，默认为数组末尾）；2.返回一个包含提取元素的新数组，原数组保持不变；3.常用于数组复制、子集提取、类数组对象转换等场景；4.在处理稀疏数组时保留空槽，在处理非数组对象时可通过call或apply将其转换为数组。
自定义单选按钮的核心思路是隐藏原生按钮并用自定义元素模拟其外观与交互。首先，HTML结构中使用input[type="radio"]搭配label标签包裹自定义的span元素，确保点击label可触发选中状态。其次，CSS通过设置position:absolute或opacity:0隐藏原生按钮，同时保持其可聚焦。接着，为自定义元素添加基础样式如圆形边框、背景色等，并利用:checked伪类和兄弟选择器控制选中状态下的视觉变化，例如改变边框颜色或添加内部选中点。此外，还需优化:hover和:focus状态
动态添加或删除HTML表格行的核心在于DOM操作。1.添加行：通过document.getElementById()获取表格元素，使用insertRow()在指定位置（如末尾或特定索引）插入新行，再用insertCell()依次创建单元格并填充内容；若表格无tbody需先创建。2.删除行：通过按钮点击事件定位到对应行元素，利用confirm提升用户体验后调用removeChild()移除该行。3.插入位置控制：insertRow()接受index参数，0表示最前，省略或超过行数则插入末尾。4.事件监听优化
要获取和修改文档标题，可通过document.title属性操作。获取方式为constcurrentTitle=document.title;修改则直接赋值新字符串。应用场景包括单页应用导航更新、实时状态提示、A/B测试及监控页面指标展示。技术挑战涉及与浏览器历史同步、SEO优化配合、避免频繁修改影响体验，以及兼容性考量。最佳实践是结合HistoryAPI同步更新URL与标题，确保初始标题利于SEO，并保持标题简洁准确。
