源本科技 | 码上会

学习目标 理解 text-shadow 和 box-shadow 属性的基本语法及其参数含义 学会控制阴影的偏移量、模糊半径、扩散半径及颜色 掌握利用阴影创建立体按钮、悬浮卡片及艺术字效果的方法 能够通过 JavaScript 动态修改阴影属性，实现交互反馈 理解阴影在提升用户界面（UI）层次感和视

学习目标 理解 overflow 属性如何处理超出容器边界的内容 掌握 visible、hidden、scroll、auto 四个核心值的区别与应用场景 学会使用 overflow-x 和 overflow-y 分别控制水平和垂直方向的溢出行为 能够利用溢出属性创建整洁的卡片布局、模态框及自定义滚动

学习目标 理解 height 和 width 属性如何定义元素的基本尺寸 掌握像素（px）、百分比（%）等不同单位在尺寸设置中的应用场景 学会使用 max-width、min-width、max-height、min-height 创建弹性布局 理解限制属性在响应式设计中的关键作用，确保内容在不同屏

学习目标 理解 white-space 属性如何控制元素内的空白字符和文本换行行为 掌握 normal、nowrap、pre、pre-line、pre-wrap、break-spaces 等关键值的区别与应用场景 学会处理代码展示、诗歌排版、长单词不换行等特定布局需求 理解 initial 和 in

学习目标 理解 CSS position 属性的五种主要取值及其应用场景 掌握静态（static）、相对（relative）、绝对（absolute）、固定（fixed）和粘性（sticky）定位的区别 学会使用 top、right、bottom、left 属性精确控制元素位置 能够构建包含重叠层、

学习目标 理解 CSS 内边距（Padding）的概念及其在盒模型中与外边距（Margin）的区别。 掌握 padding-top、padding-right、padding-bottom、padding-left 四个独立属性的用法。 熟练运用 padding 简写属性的四种取值规则（1 值、2

学习目标 理解 CSS 外边距（Margin）的概念及其在盒模型中的位置与作用。 掌握 margin 简写属性的四种取值规则（1 值、2 值、3 值、4 值）。 学会使用 margin: auto 实现块级元素的水平居中。 了解负外边距的用途及 inherit 关键字的继承机制。 能够灵活运用像素（

学习目标 掌握 CSS 中六种主要颜色表示法：颜色名称、HEX、RGB、RGBA、HSL 和 HSLA。 理解透明度（Alpha 通道）在 RGBA 和 HSLA 中的应用场景。 学会使用颜色属性美化文本、背景、边框，并创建交互式的 Hover 效果。 掌握 box-shadow 和 text-sh

学习目标 掌握 CSS 字体的五大核心属性：font-family、font-size、font-weight、font-style 和 line-height。 理解“Web 安全字体”与“自定义字体（Web Fonts）”的区别及应用场景。 学会使用相对单位（em, rem, vw）实现响应式排

学习目标 掌握 CSS 边框的核心三要素：宽度（Width）、样式（Style）和颜色（Color）。 理解并能够独立设置元素四个方向（上、右、下、左）的边框属性。 熟练运用 border-radius 属性创建圆角效果，提升界面美观度。 了解常见边框样式（如虚线、点线、双线及 3D 效果）的应用场