recherche

Maison  >  Questions et réponses  >  le corps du texte

css3 - 如何实现 CSS 背景图片相对右边或者下边定位

我们用 right 使背景图片右对齐,当背景所在节点的宽度高度不是固定时,但我想让他距离右边 10px,距离下边 10px,有没有好的实现方法?
CSS

.loading {
background: url(loading.gif) right bottom no-repeat;
}

HTML

<p class="box loading">some text</p>
PHP中文网PHP中文网2782 Il y a quelques jours848

répondre à tous(3)je répondrai

  • PHP中文网

    PHP中文网2017-04-17 11:04:07

    这个应该是直接操作盒子就好了吧,如果有内容的话直接设置盒子的padding-rightpadding-bottom,然后让图片显示在右下角就好了0_0....总的思想都是通过盒子控制背景的位置。

    没想到你的盒子里头还有别的内容
    .loading { 
        /*box position*/
        position:fixed; 
        right:10px; 
        bottom:10px; 
        /*background*/
        width:30px;
        height:30px;
        background:url(loading.gif) no-repeat; 
    }

    répondre
    0
  • 怪我咯

    怪我咯2017-04-17 11:04:07

    background 好像解决不了你的问题, 不知道你是否要兼容ie6, position:fixed; 这属性ie6下是无效的。 如果需求不可更改的话我会给box加个相对定位,然后图片放进去再绝对定位,这样实现起来兼容性没问题,也解决了这个问题。

    répondre
    0
  • PHPz

    PHPz2017-04-17 11:04:07

    .loading {
        background-image: url(loading.gif);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: -10px -10px;
    }

    不过感觉这和图片大小有很大关系,供参考吧

    répondre
    0
  • Annulerrépondre