CSS背景图片。文字上的位置

时间:2016-08-30 15:37:24

标签: html css css3

我不确定这是否可行。

我有一个明星的背景图片,用于某些文字,它位于容器的左下角。见下图: enter image description here

但是当它在移动设备上观看时,明星仍然是左下角..

enter image description here

有没有办法将它放在文本的左下区域以创建相同的包装效果?像这样:

enter image description here

1 个答案:

答案 0 :(得分:0)

与评论一样,媒体查询和位置是一个可行的解决方案:

.container{
    position: relative;
}
.star {
    position: absolute;
}

@media (max-width: 480px) {
    .star {
        left: 50%;
        transform: translateX(-50%);
        /* bottom: 0; */ /* if it goes at the bottom, up to you homie */
    }
}