ITPub博客

首页 > 移动开发 > HTML5 > HTML连载79-背景图片定位区域属性、背景颜色

HTML连载79-背景图片定位区域属性、背景颜色

原创 HTML5 作者:soug 时间:2020-04-01 15:58:15 0 删除 编辑

一、这一节讲解的是背景图片开始的位置也是可以设置的:

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>


来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/69966782/viewspace-2683893/ ,如需转载,请注明出处,否则将追究法律责任。

上一篇: HTML与CSS基础day1
下一篇: Vue 常用指令
请登录后发表评论 登录
全部评论

注册时间:2020-03-17

  • 博文量
    10
  • 访问量
    4533