属性优先级、图片属性设置、内联标签设置大小 

 <style>
        /*优先级：# 1000 .100 div 10*/
        /*块级标签有长宽，内联标签没有*/
.div1{
    border: 1px solid red;
     width: 800px;/*div的大小*/
    height: 800px;
    background-image: url("123.jpg");
    background-repeat:no-repeat;/*确保只有一张图显示*/
    background-position: center;/*居中*/
}
        span{
            display: inline-block;/*原本span不能设置长宽，但是因为这句话可以设置了*/
            /*inline-block既有内联标签优势能在一行显示又可以设置长宽*/
            height: 18px;
            width: 20px;
            background-image: url("http://dig.chouti.com/images/icon_18_118.png?v=2.13");
            background-position: 0-100px;
        }
    </style>
</head>
<body>
<div class="div1" id="id1">

    </div>
<span></span>/*内联标签*/
</body>
</html>

 

posted @ 2018-06-08 16:51  未来的技术  阅读(168)  评论(0)    收藏  举报