码迷,mamicode.com
首页 > 其他好文 > 详细

span文字在左背景图片在右

时间:2014-05-24 04:55:58      阅读:267      评论:0      收藏:0      [点我收藏+]

标签:style   class   blog   c   code   java   

bubuko.com,布布扣
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
span {
    background-image:url(http://a3.qpic.cn/psb?/V11OXL2y3vDNOK/BLjgWL6kfs*3sZIUVjubWPHQWxn3Ox2.13qxCeT058s!/b/dKY.3OoMEwAA&bo=GwAbAAAAAAADACU!&rf=0-18);
    background-repeat:no-repeat;
    background-position:100% 50%;/*这是一句神奇的语句*/
    /*如果只提供一个百分数值,所提供的这个值将用作水平值,垂直值将假设为 50%。这一点与关键字类似。

    background-position 的默认值是 0% 0%,在功能上相当于 top left。这就解释了背景图像为什么总是从元素内边距区的左上角开始平铺,除非您设置了不同的位置值。

    参考网站:http://www.w3school.com.cn/css/css_background.asp
    */
    border: 1px solid #E6E6E6;
    color: #999999;
    display: inline-block;
    font-size: 12px;
    line-height: 25px;
    margin-right: 5px;
    text-align: right;
    padding-right: 28px;
}
<style>
</style>
</head>
<body>
<span>hello world!</span>
</body>
</html>

bubuko.com,布布扣

 

span文字在左背景图片在右,布布扣,bubuko.com

span文字在左背景图片在右

标签:style   class   blog   c   code   java   

原文地址:http://www.cnblogs.com/wiming/p/3736423.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!