divの固定背景を配置する方法は？

-1

アンドロイド用のコードバプロジェクトを作成しています。パフォーマンス向上のために、すべてのHTMLファイルを1つのファイルに変換するので、クラスを適用したり、背景画像を設定することができません。< >タグ。また、<div>タグの背景画像を設定する必要があります。
私は次のコードを試しましたが、背景、上、下、左と右の側面に完全にセットされていないイメージはいくらかのスペースを持ち、バックグラウンドイメージはほとんどスクロールしません。画像がストレッチの場合は問題ありません。

下の出力から、私の全問題を理解することができないので、コード全体をコピーし、システムに新しいhtmlファイルを作成し、モバイルビューでチェックインしてください。divの固定背景を配置する方法は？

<html> 
 
<head> 
 
<title>Test</title> 
 
<style> 
 
.fxdback 
 
{ 
 
    height: 100vh; 
 
    overflow: scroll; 
 
    background: url(https://s4.postimg.org/rfdxbny59/menus-min.jpg); 
 
    background-repeat: no-repeat; 
 
    background-size: 100% 100%; 
 
} \t 
 
</style> 
 
</head> 
 

 
<body> 
 

 
<div class="fxdback"> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
This ist he test<br/> 
 
</div> 
 
</body> 
 
</html>

出典

2017-06-21 Merbin Joe

この方法で試してみてください。

<div id="mytext" style="background: center cover fixed no-repeat url('https://s4.postimg.org/rfdxbny59/menus-min.jpg');"> 
 

 
<!-- Your content here --> 
 

 
</div>

それが動作するはずです願っています。

出典

2017-06-21 09:18:36

このように、画像全体がスクロールしています –

私が理解している視差効果を作成しようとしています。

あなたはこれを試すことができます：あなたは複数のhtmlを持つと同じすべてのファイルを保持したい場合

.bgimg-1 {        // this is the most important code 
    background-attachment: fixed; 
    background-position: center; 
    background-repeat: no-repeat; 
    background-size: cover; 
} 

//this one for image (Logo. Full height) 
.bgimg-1 { 
    background-image: url('image path'); 
    min-height: 100%; 
}

あなたは別のcssファイルにそれを置くことができます。

出典

2017-06-21 09:20:05

画像全体がスクロールしていますが、これは背景画像を修正しませんでした。 –

@MerbinJoe それは私のために働いた。このリンクを確認してください –

' を'使用して、これを試してみてください '

divの固定背景を配置する方法は？

答えて

関連する問題