• 技术文章 >web前端 >css教程

    css怎么设置背景图片自适应居中

    王林王林2021-03-09 16:30:05原创1663

    css设置背景图片自适应居中的方法:可以借助于background-position属性来进行设置,如【background-positiion:center;】,属性值center表示居中。

    本文操作环境:windows10系统、css 3、thinkpad t480电脑。

    属性介绍:

    在css中,如果我们要让一张图片垂直居中显示,那么我们可以使用background-position属性来实现。

    属性介绍:

    background-position属性设置背景图像的起始位置。

    例如我们要将本地图片作为背景,并让它居中显示,那么我们可以这样做:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"> 
    <title>php中文网(php.cn)</title> 
    <style>
    body
    { 
    	background-image:url('smiley.gif');
    	background-repeat:no-repeat;
    	background-attachment:fixed;
    	background-position:center; 
    }
    </style>
    </head>
    
    <body>
    <p><b>注意:</b>该属性工作在 Firefox 和 Opera, background-attachment 属性会被设置为 "fixed"。</p>
    </body>
    </html>

    相关推荐:CSS教程

    以上就是css怎么设置背景图片自适应居中的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css 背景图片
    上一篇:css怎么改变图片颜色 下一篇:css怎么去掉下划线
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【腾讯云】年中优惠,「专享618元」优惠券!• 怎么让CSS文件里图片居中• css li怎么水平居中对齐• css中怎么将div居中显示图片• css盒子中的图如何居中
    1/1

    PHP中文网