关于background-image调整大小和位置的方法笔记

本文转载自查看原文 2018-12-01 22:33 22709 CSS/ web前端学习

遇到background-image的问题有点多，直接上网搜资料自己整理一下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #divtest{
            width:400px;
            height:400px;
            background-color: aqua;
            background-image: url("img/2.jpg");
            /*background: url("img/2.jpg") 10% 20% no-repeat;!*图片从左往右移动的百分比大小，从上往下百分比大小，重复方式
                                                            换成数值同样如此，在这里没有调整大小的方法*!*/
            background-position: 10% 40%;/*这个是按从左往右，从上往下的百分比位置进行调整*/
            background-size: 50% 50%;/*按比例缩放*/
            /*background-size: 100px 100px;!*这个是按数值缩放*!*/
            background-repeat: no-repeat;/*还有repeat-x,y等*/
        }
    </style>
</head>
<body>
    <div id="divtest"></div>
</body>
</html>

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 关于background-image调整大小和位置的方法笔记 background-image大小和位置的设置 background-image属性 background-image 和 img background-image详细属性 background-color和background-image问题 background复合属性详解（上）：background-image background-image背景图片 background-image使用svg如何改变颜色 jquery 去除 css 的 background-image 样式