css 背景图高怎么设置

CSS 背景图是网页设计中不可缺少的一部分，往往背景图的质量和大小会对页面性能和用户体验产生一定的影响。我们可以通过设置 CSS 属性来控制背景图的高度，下面介绍两种方法。

第一种是通过 background-size 属性，该属性可以设置背景图的高度和宽度比例。常用的取值有：auto、cover 和 contain。其中，auto 表示按照原图大小显示，可能会拉伸变形；cover 表示将背景图等比例拉伸，使其覆盖整个背景区域，可能会裁剪部分原图；contain 表示将背景图等比例缩放，使其完整显示在背景区域内。

.background {
    background-image: url("example.jpg");
    background-size: cover;
}
    

第二种是通过在 HTML 文框中设置背景图，使用 background-attachment 和 background-position 属性来控制背景图的高度。background-position 属性可以设置背景图的位置，如果只设置一个值，则表示左对齐，上对齐，如果设置两个值，则第一个表示水平方向的位置，第二个表示垂直方向的位置。而 background-attachment 属性则可以设置是否固定背景图，常用取值有：scroll 和 fixed。

div style="background-image:url(example.jpg);
     background-repeat:no-repeat;
     background-position:center 50%;
     background-attachment:fixed">
     p>
    这是一段示例文字。/p>
     /div>
    

以上就是两种控制 CSS 背景图高度的方法，根据需要选择合适的方法即可。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！