图片宽是1920px,高度100px
在大屏幕下显示为这样:
横向不拉伸,两边就会留白
background-position: center;
background-repeat: no-repeat;
background-size: auto 100%;
如果铺满屏幕,那么图片会被裁剪
background-position: center;
background-repeat: no-repeat;
background-size: cover;
想要实现的效果是图片高度不变,仅横向拉伸铺满屏幕,请问要使用什么属性设置,或者对于这种标题背景使用什么方式解决?
那就试试 background-size: 100% auto;
横向100%的宽度,纵向auto
当然,如果容器的高度本来就不够显示的话,那么还是会有被裁切的感觉。