怎么用HTML设置背景图片开始的位置

这篇文章主要介绍“怎么用HTML设置背景图片开始的位置”，在日常操作中，相信很多人在怎么用HTML设置背景图片开始的位置问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”怎么用HTML设置背景图片开始的位置”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！

background-orgin:数值值；

这里的属性值就是开始的位置，可分为：

padding-left（默认）；content-box；border-box    <style>
        *{
            margin:0;
            padding;0;        }
        ul li{
            list-style: none;
            float:left;
            width: 200px;
            height: 200px;
            text-align:center;
            line-height:100px;
            border:10px dashed black;
            margin-left: 20px;
            background:url("image/mountain.jpg") no-repeat;
        }
        ul li:nth-child(2){
            background-origin: padding-box;/*背景图片默认从什么区域开始显示,默认就是从padding区域开始显示*/
        }
        ul li:nth-child(3){
            background-origin: border-box;
        }
        ul li:nth-child(4){
            background-origin: content-box;
        }...............省略代码............
<ul>
    <li>默认</li>
    <li>padding</li>
    <li>border</li>
    <li>content</li>

到此，关于“怎么用HTML设置背景图片开始的位置”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注亿速云网站，小编会继续努力为大家带来更多实用的文章！