/* 设置背景图片大小的示例代码 */
body {
/* 背景图片路径 */
background-image: url('example.jpg');
/* 设置背景图片大小为覆盖整个容器,保持比例 */
background-size: cover;
/* 设置背景图片位置为居中 */
background-position: center;
/* 确保背景图片不重复 */
background-repeat: no-repeat;
}
/* 另一个示例:设置背景图片为固定大小 */
div {
width: 300px;
height: 200px;
background-image: url('example.jpg');
/* 设置背景图片大小为固定宽度和高度 */
background-size: 150px 100px;
/* 设置背景图片位置为左上角 */
background-position: top left;
/* 确保背景图片不重复 */
background-repeat: no-repeat;
}
background-size: cover;:使背景图片覆盖整个容器,并保持图片的比例。图片可能会被裁剪以适应容器。background-size: 150px 100px;:将背景图片设置为固定的宽度和高度(150px 宽,100px 高),不会根据容器大小自动调整。background-position: center; 和 background-position: top left;:分别设置背景图片的位置为居中和左上角。background-repeat: no-repeat;:确保背景图片不会重复显示。上一篇:css背景图片大小自适应
下一篇:css 禁止点击
Laravel PHP 深圳智简公司。版权所有©2023-2043 LaravelPHP 粤ICP备2021048745号-3
Laravel 中文站