web-dev-qa-db-ja.com

HTMLでクリック可能な画像を作成する方法

ここにhtmlがあります

<div id="panelpic1">
    <a href="https://www.google.com/"style="display:block"target="_blank">
    </a>
</div>

CSS

  #panelpic1{
            content: url(file:///D:/MOHIT/HTML/images.jpg);
            float: left;
            width: 250px;
            height: 150px;
            vertical-align: middle;               
           }

これは私がやった方法ですが、動作していません。画像はクリックできません。助けてください

5
jack reacher
<!DOCTYPE html>
<html>
<body>

<span>Open image link in a new tab: 
 <a href="http://www.google.com" target="_blank">
  <img src="D:/MOHIT/HTML/images.jpg" />
 </a>
</span>

</body>
</html>

これは最良のアプローチではありません。以下は、画像をクリック可能にするための標準的なアプローチの1つです。

<a href="your landing page url">
 <img src="your image url" />
</a>

これで、この画像はクリック時に指定されたURLでリダイレクトされます。

S3/dropboxのアップロードからFSCollectionの使用(ノードユーザーのみ)に至るまで、多くの方法があります。

したがって、あなたの場合、スニペットは次のようになります。

<a href="http://www.google.com">
 <img src="D:/MOHIT/HTML/images.jpg" />
</a>
12
Mukul Jain