@charset "utf-8"; /* 设置背景颜色 */ body { display: flex; height: 100vh; justify-content: center; align-items: center; background-image: linear-gradient(125deg, #e06464, #a5da9a, #3b75e9, #e44bff); } /* 设置背景效果*/ .myheart { display:
时间: 2024-03-26 22:37:51 浏览: 76
flex布局 父元素属性之 justify-content 主轴上子元素的排列方式
5星 · 资源好评率100%
这是一个CSS样式表的片段,其中定义了一些样式规则来设置网页的背景颜色和背景效果。
首先,@charset "utf-8"; 声明了字符集为UTF-8,确保网页中的文本可以正确显示。
接下来,body选择器用来设置整个文档的样式。display: flex; 表示将body元素设置为一个弹性容器,可以使用flex布局。height: 100vh; 表示设置body元素的高度为视口的高度,即将整个页面垂直铺满。justify-content: center; 和 align-items: center; 分别表示将内容水平和垂直居中。
background-image: linear-gradient(125deg, #e06464, #a5da9a, #3b75e9, #e44bff); 则是设置一个渐变背景。linear-gradient()函数可以用来生成一个线性渐变,其中125deg表示渐变的角度,后面的四个参数分别表示四个颜色值,从左至右依次渐变。
最后,.myheart选择器则是一个空的选择器,没有任何样式规则。如果这个选择器后面还有其他的规则,那么它们将应用于所有具有class="myheart"的元素。
阅读全文