0

私は使用しています

ファイアーバグから

element {
position: absolute;
top: 0px;
left: 0px;
display: block;
z-index: 5;
opacity: 1;
width: 300px;
height: 18px;
 }

Google コンソールから:

  element.style {
 position: absolute;
 top: 0px;
 left: 0px;
 display: none;
 z-index: 4;
 opacity: 0;
 width: 300px;
 height: 260px;
 }

問題のスクリーンショットは次のとおりです。

Railsヘルパーによって生成されたコードは次のとおりです。

    <img alt="Home_page_4" height="260" src="http://127.0.0.1:3000/assets/home_page_4.jpeg" width="300" style="position: absolute; top: 0px; left: 0px; display: none; z-index: 4; opacity: 0; width: 300px; height: 260px; ">

誰かが私が間違っていることを教えてもらえますか?

4

1 に答える 1

2

"260"と の代わりにと を"300"使用"260px"して、常に寸法を指定してください"300px"。また、0値はpx次元なしで指定する必要があります。<img/>また、次のようにタグを閉じてください。

<img alt="Home_page_4" height="260px" src="http://127.0.0.1:3000/assets/home_page_4.jpeg" width="300px" style="position: absolute; top: 0; left: 0; display: none; z-index: 4; opacity: 0; width: 300px; height: 260px; " />

実際には、widthandheight属性を使用する必要はありません。これらは非推奨です。したがって、このマークアップは正常に機能するはずです。

<img alt="Home_page_4" src="http://127.0.0.1:3000/assets/home_page_4.jpeg" style="position: absolute; top: 0; left: 0; display: none; z-index: 4; opacity: 0; width: 300px; height: 260px; " />
于 2012-10-11T07:59:49.283 に答える