クリック可能なイメージをHTMLで浮かせる方法は？

Question

私は私のページをスクロールしている間でさえ、私のウェブサイトに "フロート"している写真を挿入したい。

次のコードでは、私のウェブサイト上にオブジェクトを浮かせることができます...しかし、どうやってハイパーリンクのように動作するイメージフロートを作ることができますか？

<div style="position: fixed; bottom: 10px; left: 0px"> </div> 
<a href="www.google.com"> <img src="pic.jpg" height: 32px; width:32px;> </img> </a> 

どのようにそれらをマージしますか？

Answer 1

これは、divの内側にアンカータグを置いておく必要があります。また、画像の高さと幅を指定するときは、width="25px"のような引用符を使用するか、CSSスタイルを使用する必要があります。

<div style="position: fixed; bottom: 10px; left: 0px"> 
 
    <a href="http://www.google.com"> <img src="https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-image-128.png" style="width:25px;height:25px;"/> </a> 
 
</div>

Answer 2

テリーコメントにsaydとして、あなたはただのdiv内のコードを上に移動することができます。リンクが位置が設定されているものを見つけます。あなたの部門の場合はどちらですか？

また、<img>タグは自己終了タグです。したがって</img>は必要ありません。また、あなたはそれが、これは動作しません

<img src="your/src.url.jpg" width="100px" height="100px" /> 

なく

<img src="your/src.url.jpg" width:100px; height:100px; /> 

にする必要があり<img>タグに直接heightおよびまたはwidthを書く場合は！

ここではあなたの実際の例です。

img { 
 
    width: 32px; 
 
    height: 32px; 
 
}

<div style="position: fixed; bottom: 10px; left: 0px"> 
 
    <a href="www.google.com"> 
 
     <img src="http://www.planwallpaper.com/static/images/adirondacks-sun-beams-640x300.jpg" /> 
 
    </a> 
 
</div>