CSS中flex和inline-flex的区别详解
inline-flex 和 inline-block 一样，对内部元素来说是个 display:flex 的容器，对外部元素来说是个 inline 的块。两者的区别描述： flex： 将对象作为弹性伸缩盒显示 inline-flex：将对象作为内联块级弹性伸缩盒显示一句话来描述就是 当F
2026-03-30
利用纯css做一个下拉菜单功能的示例代码
导语：这几天看面试题目的时候，经常能够看到用css去实现一个下拉菜单，但是我发现很多人却没能够做出来，最后只能勉强用js做出来。实话实说，我很震惊，这个功能实现起来很简单，甚至可以说是入门题目，怎么这么多人不会呢？所以今天来个面试干货，带大家直接手撸css做下拉菜单。还是一样，话不多说，直接上效果图
2026-03-30
CSS子元素跟父元素的高度一致的实现方法
绝对定位方法：（1）将父元素设置为相对定位，不写父元素的高度时，会随着左边的子元素高度变化而变化.parent {/*关键代码*/position: relative;/*其他样式*/width: 800px;color: #fff;font-family: "Microsoft Yahei";te
2026-03-30
CSS实现子元素div水平垂直居中的示例
div基本布局 css样式1. 配合定位与margin：auto父元素加相对定位，子元素加绝对定位 .main{ width: 300px; height: 300px; b
2026-03-30
CSS3 RGBA色彩模式使用实例讲解
RGBA色彩模式是RGB色彩模式的扩展，在红，蓝，绿三原色的基础上增加了不透明度参数。语法如下：rgba（r,g,b,）其中r,g,b表示红色，蓝色，绿色三种原色所占的比重。其值可以使整数或者百分数，正整数值的取值范围为0~255，百分数值的取值范围为0.0%~100.0%,超出范围
2026-03-30
CSS实现文字环绕图片效果
CSS实现文字环绕图片效果文字环绕图片，在Word里只要click一下右键，调一下属性就可以了。但在HTML文档里就没有直接属性了。因此我们可以借助CSS来实现这一效果。我们先设定float的参数，如果图片需要左对齐设为left，若右对齐则为：right。此外，我们还可以根据需要设置图片和文字间隔的
2026-03-30
