2016-08-30 11 views
0

これが可能かどうかわかりません。CSSの背景画像。テキスト上の位置

私はいくつかのテキストの星の背景イメージを持っています、それはコンテナの左下にあります。

enter image description here

はテキストの左下の領域への上に配置する方法があります。.. enter image description here

しかし、それは携帯で見たときに星はまだ左下です:下の画像を参照してください。同じ折り返し効果を作成しますか?このように:コメントのような

enter image description here

+1

確かに、 '位置を使用します。absolute'を、メディアクエリを使用して位置を調整します。 –

+0

'@ media'を使うと、小さなウィンドウ(モバイルデバイス)に特殊なスタイルを指定するのに適しています。メディアに指定されたスタイルは、ウィンドウが指定されたしきい値内にある場合にのみ適用されます。 – leigero

+0

あなたのコードを共有できますか? – Aravind

答えて

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 */ 
    } 
} 
+0

これは、テキストのさまざまな部分に使用されるスタイルです。50%の位置に配置すると、異なる領域に多くのテキストが存在する可能性があるため、必ずしも機能しないことがあります。可能であれば、左下の文字との相対的な位置に配置する必要があります。 – lbollu

+0

はい、これらの画像を使用しているため、位置を特定する必要があります。コンテナに対して50%ですので、好きなようにプレイできます。 –