css在中元素添加元素 |网页动画htmlcss

在 CSS 中，大家可以通过添加子元素的方式来改变 HTML 元素的样式和布局。添加子元素的方法主要有两种：

方法一：使用伪元素
父元素::before {
content: "";  //添加空内容
display: block; //转换为块级元素
height: 30px; //设置高度
width: 30px; //设置宽度
background-color: red; //设置背景颜色
}

上面的代码中，大家通过添加 ::before 伪元素来给父元素添加一个红色的方块。

方法二：使用绝对定位
父元素 {
position: relative; //设置相对位置
}
子元素 {
position: absolute; //设置绝对位置
top: 50%; //设置上侧距离为父元素一半高度
left: 50%; //设置左侧距离为父元素一半宽度
transform: translate(-50%, -50%); //用于调整子元素位置
height: 30px; //设置高度
width: 30px; //设置宽度
background-color: red; //设置背景颜色
}

上面的代码中，大家通过添加一个绝对定位的子元素来给父元素添加一个红色的方块。大家使用 transform 属性来定位子元素的位置，使其水平和垂直居中。

通过上述两种方法的其中一种或结合使用，大家可以很容易地给 HTML 元素添加一些有趣的效果。