web前端入门到实战:Css背景定位-创新互联

同一个标签可以同时设置背景颜色和背景图片,如果颜色和图片同时存在,那么图片会覆盖颜色。

成都创新互联是一家专注于成都网站设计、成都网站建设与策划设计,蓝山网站建设哪家好?成都创新互联做网站,专注于网站建设十载,网设计领域的专业建站公司;建站业务涵盖:蓝山等地区。蓝山做网站价格咨询:028-86922220

1.在CSS中有一个叫做background-position:属性,就是专门用来控制背景图片的位置

2.格式:background-position:值1 值2;

值1的取值范围:left center right

值1代表背景图片的水平位置

值2的取值范围:top center bottom

值2代表背景图片的垂直位置

值1和值2也可以设置像素值,来分别表示距离最左边和最上边的像素值(注意可以接受负值,也就是左上角就是坐标的原点,图片的左上角就是坐标值的大小),记住一定要带单位。默认值为:left top

例子:

<style>
        .box{
            height: 1000px;
            width: 1000px;
            background-image: url("image/snow.jpg");
            background-repeat: no-repeat;
            background-position: center center;
        }
</style>

<div class="box">
</div>
专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①②  分享学习方法和需要注意的小细节,互相交流学习,不停更新最新的教程和学习技巧(从零基础开始到WEB前端项目实战教程,学习工具,全栈开发学习路线以及规划)

3.使用方式:

我们使用背景图片,而不是使用img标签,这是因为,当我们使用img标签的时候,如果图片很大那么下面就会有滚动条,但是这种网页是很垃圾的,因为展示出来首页,就是让大家看的,加一个滚动条很不舒服。那我们用小图片不就得了,这其实也不行,因为我们每个人的屏幕分辨率大小都不同,因此需要一张较大的背景图片来解决上面的问题。

本文标题:web前端入门到实战:Css背景定位-创新互联
转载来源:https://www.cdcxhl.com/article24/dhjoce.html

成都网站建设公司_创新互联,为您提供服务器托管品牌网站建设网站维护定制网站企业网站制作关键词优化

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

外贸网站制作