画像周りの線を消す

HTMLを使用した記述方法

記述方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
</head>
<body>
<p><a href="https://www.7key.jp/">
<img src="../img/samp.gif" width="150" height="150" alt="" border="0">
</a></p>
</body>
</html>

表示サンプル

サンプル画像

解説

画像にリンクを設定した際に、普通に記述をした場合画像の周りに縁取りが表示されます。「<img>」に「border="0"」と指定することによりこの縁取りを消すことが出来ます。

リンクについての詳細は「リンクってなに?」を参照下さい。

画像へリンクを設定する方法は「画像をクリックでジャンプ」を参照下さい。

CSSを使用した記述方法

記述方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
<!--
img.noborder { border-width: 0px; }
-->
</style>
</head>
<body>
<p><a href="https://www.7key.jp/">
<img src="../img/samp.gif" width="150" height="150" alt="" class="noborder">
</a></p>
</body>
</html>

表示サンプル

サンプル

解説

スタイルシートを使用して上記のように記述することもできます。参考までに。