CSS过渡学习笔记
CSS过渡学习笔记什么是CSS过渡？CSS过渡（CSS Transitions）用于控制CSS属性变化的速率，使属性变化平滑进行，而不是瞬间完成。使用场景：鼠标悬停按钮颜色渐变图片放大效果菜单滑动展开示例：.box { width: 100px; height: 100px; background-color: orangered; transition:...
Category
CSS
该分类下共有 5 篇文章。
CSS背景学习笔记
CSS背景学习笔记CSS背景属性概述CSS背景属性用于定义HTML元素的背景效果，提供了颜色、图像、渐变等多种方式，以实现更丰富的视觉表现。常用背景属性background-color：设置背景颜色。background-image：设置背景图像。background-repeat：设置背景图像的重复方式。background-position：设置背景图像...
# CSS浮动学习笔记
CSS浮动学习笔记什么是CSS浮动？CSS浮动（float）最初用于实现“文字环绕图片”的效果。可用于实现基本的网页布局，但需要配合清除浮动技术。浮动的特性float 属性：使元素脱离标准文档流，向左或向右浮动。属性值：left：元素向左浮动。right：元素向右浮动。none：元素不浮动（默认值）。示例代码：img { float: left; margi...
# CSS盒子模型学习笔记
CSS盒子模型学习笔记什么是CSS盒子模型？CSS盒子模型是网页布局的核心概念之一，每个HTML元素都被看作一个矩形盒子，由以下几个部分组成：内容区域 (content)：元素的实际内容。内边距 (padding)：内容与边框之间的间隔。边框 (border)：环绕内边距和内容的边框。外边距 (margin)：元素与其他元素之间的距离。盒子模型的结构盒子的宽...
CSS弹性盒子学习笔记
CSS弹性盒子学习笔记什么是Flexbox？Flexbox (Flexible Box) 是CSS3引入的一种用于布局的模式。提供了一种简便且强大的方式，用于在网页中进行一维布局。Flexbox特点：适用于一维布局（水平或垂直）。由父容器（flex容器）和子元素（flex项目）组成。自动适应不同屏幕尺寸，常用于响应式设计。Flex容器激活Flex容器使用di...