芜青-CSDN博客

原创 JavaScript手录02-变量与数据类型

本文介绍了JavaScript中的内存机制、变量和数据类型三个核心概念。在内存部分，解释了RAM的特性及变量与内存地址的关系，展示了变量声明和函数调用时的内存操作。变量部分详细说明了var、let、const三种声明方式的区别，并提供了变量命名规则与最佳实践。数据类型部分区分了7种基本数据类型和引用数据类型，介绍了typeof、instanceof和Object.prototype.toString.call()三种类型检测方法。文章通过代码示例直观展示了各知识点的实际应用，帮助读者理解JavaScript

2025-06-25 21:25:57 664

原创 JavaScript手录01-概念篇

摘要计算机语言是人机交互的核心工具，JavaScript作为浏览器唯一原生语言，在网页开发中占据关键地位。本文系统阐述了计算机语言基础概念、软硬件区别及程序本质，重点介绍了JavaScript的特性、发展历程和四种引入方式（行内事件、内部脚本、外部引入和动态加载），并对比了各方式的适用场景。同时提供了常见编程语言应用领域表，以及脚本加载顺序控制技巧（defer/async属性），为开发者提供了全面的技术参考。

2025-06-23 13:48:00 599

原创 HTML+CSS：如何解决margin塌陷问题

摘要：margin塌陷指相邻元素或父子元素的垂直外边距合并现象。5种解决方案：1) 触发BFC（推荐display: flow-root或overflow: hidden）；2) 添加透明边框/内边距；3) 改用Flex/Grid布局；4) 伪元素隔离法；5) 首尾子元素改用padding。建议优先使用BFC或现代布局方案，既无副作用又能保持代码整洁。特殊场景需注意兼容性，如旧浏览器可用边框/内边距替代。

2025-06-12 15:53:03 184

原创 HTML+CSS：清除浮动的6种方案

摘要：清除浮动常用6种方法：1)空元素+clear属性（需添加空标签）；2)伪元素法（推荐，通过::after伪元素清除）；3)overflow法（触发BFC，可能影响溢出内容）；4)display:flow-root（现代方案，兼容IE11+）；5)父元素浮动（影响文档流）；6)邻近元素设置clear（通用性差）。推荐优先使用伪元素法或现代flow-root方案，需根据兼容性和布局需求选择合适方法。

2025-06-12 15:01:55 361

原创 HTML ：Table元素与表格布局详解

本文系统介绍了HTML表格的构建与优化技巧。主要内容包括：1）基础表格元素（table、tr、th/td等）和结构化标签（caption、thead等）；2）布局技巧如边框控制、斑马纹效果和表头固定；3）响应式设计方案（水平滚动/堆叠布局）；4）高级特性包括列样式、排序指示和单元格合并。

2025-06-11 08:30:00 721

原创 HTML+CSS 元素居中全解

CSS居中布局方法总结：水平居中可通过text-align、margin auto、Flexbox、Grid和绝对定位实现；垂直居中可用line-height、Flexbox、Grid、绝对定位和表格布局。水平垂直居中推荐使用Flexbox（justify-content+align-items）或Grid（place-items），未知尺寸时用绝对定位+transform。现代项目首选Flexbox/Grid，旧浏览器可用表格布局或负边距。注意解决文本换行、多行文本等特殊场景，响应式设计可结合媒体查询。

2025-06-10 20:42:44 431

原创 CSS文字排版全指南

CSS文本排版核心属性摘要：控制文本呈现的关键属性包括：1)字间距(letter-spacing)调节字符间距，数值可正可负；2)行高(line-height)建议使用1.5-1.8无单位值优化可读性；3)换行属性(overflow-wrap/word-break)处理长文本断行；4)对齐方式(text-align/vertical-align)实现水平和垂直对齐。响应式排版推荐使用clamp()函数，印刷体优化建议搭配Garamond字体与1.5行高。多语言排版需特殊处理，如英文启用hyphens:aut

2025-06-10 20:32:35 266

原创 CSS半透明效果实现方案详解

HTML/CSS半透明效果实现指南本文介绍了五种实现网页半透明效果的CSS技术：1) RGBA/HSLA颜色模式，通过alpha通道设置背景透明度；2) opacity属性，调整整个元素的透明度；3) 伪元素覆盖，在不添加HTML元素的情况下创建透明层；4) 毛玻璃效果，结合透明度和模糊滤镜；5) 渐变背景，创建平滑的透明过渡。每种方法都附有代码示例和可视化演示，并对比了它们的适用场景和浏览器兼容性。文章还提供了综合应用示例和最佳实践建议，如确保内容可读性、性能优化等。最后包含一个可直接运行的完整代码示例

2025-06-05 14:25:19 436

原创 CSS 伪元素详解

CSS伪元素是创建装饰性内容的高效工具，通过双冒号语法（如::before）选择元素特定部分。核心伪元素包括内容生成（::before/::after）、文本修饰（::first-letter/::first-line）和交互效果（::selection/::placeholder）。使用时需注意：必须配合content属性、默认行内特性以及对替换元素的限制。典型应用包括清除浮动、自定义列表符号、文本特效和表单美化，但要注意不可替代关键HTML内容。伪元素与伪类的本质区别在于前者创建虚拟节点，后者选择元素状

2025-06-03 18:07:07 254

原创 CSS中伪类详解

CSS伪类是特殊选择器，用于选择元素的特定状态或位置，无需修改HTML结构。主要分为用户交互伪类（如:hover、:active）、链接状态伪类（:link、:visited）、表单状态伪类（:checked、:valid）、结构位置伪类（:first-child、:nth-child）等类型。伪类可组合使用，支持参数化选择，在交互反馈、数据表格优化、导航菜单等场景有广泛应用。与伪元素不同，伪类不创建新元素而是选择元素状态。使用时需注意性能影响、浏览器兼容性和可访问性要求。合理运用伪类能提升界面交互体验和视

2025-06-03 18:05:53 514

原创 CSS中的选择器

CSS选择器是用来定位HTML元素并为其添加样式的工具。常见类型包括：基础选择器（元素、类、ID、通配符）、属性选择器（匹配特定属性）、组合选择器（后代、子元素、兄弟关系）、伪类（元素状态）和伪元素（内容部分）。选择器优先级由权重决定，ID选择器优先级最高。合理使用这些选择器可以实现精准的样式控制。

2025-06-03 12:16:52 254