ホームページ＆ブログ作成tips ＞ [tips]tips ＞ 画像枠線を変える
画像枠線を変える
2008年01月28日
画像の枠線を変えてみたい、そんなリクエストにお応えします♪
先週画像の枠線を消し方をご紹介したんですが、今回はその枠線の色を変える
方法を説明します。
・htmlで書く場合
<img src="（ファイル名）" border="1" border-color="#FF0000" />
1は線の太さです。
太くしたい場合は整数値で調整します。
#FF0000はカラーコードです。
スタイルシートで全ての画像に設定されてると反映されません。
・スタイルシートで書く場合（<head>内で処理）
<style type="text/css">
<!--
img { border: 2px #FF0000 solid; }
-->
</style>
上のソースを<head>〜</head>内にコピー＆ペーストします。
全部のimgタグに有効です。
線の太さを変える場合は2pxの数字を変えます。
solidは枠線の種類です。
他にgroove・ridge・inset・outsetがあります。
プレビューしながらどんなカンヂなのか見てみてください。
・スタイルシートで書く場合（別ファイルスタイルシートで処理）
img { border: 2px #FF0000 solid; }
上記のソースをスタイルシートのファイル（ファイル名.css）にコピー＆
ペーストします。
全部のimgタグに有効です。
線の太さを変える場合は数字を変えます。
本来imgタグを使う場合は、altでその画像の説明、widthで画像幅、heightで
画像の高さを指定するのが正式な設定方法です。
全部設定するのはメンドーですが、文法チェックでは判定されます。
・HTMLの文法チェック ther HTML-lint gateway
先週画像の枠線を消し方をご紹介したんですが、今回はその枠線の色を変える
方法を説明します。
・htmlで書く場合
<img src="（ファイル名）" border="1" border-color="#FF0000" />
1は線の太さです。
太くしたい場合は整数値で調整します。
#FF0000はカラーコードです。
スタイルシートで全ての画像に設定されてると反映されません。
・スタイルシートで書く場合（<head>内で処理）
<style type="text/css">
<!--
img { border: 2px #FF0000 solid; }
-->
</style>
上のソースを<head>〜</head>内にコピー＆ペーストします。
全部のimgタグに有効です。
線の太さを変える場合は2pxの数字を変えます。
solidは枠線の種類です。
他にgroove・ridge・inset・outsetがあります。
プレビューしながらどんなカンヂなのか見てみてください。
・スタイルシートで書く場合（別ファイルスタイルシートで処理）
img { border: 2px #FF0000 solid; }
上記のソースをスタイルシートのファイル（ファイル名.css）にコピー＆
ペーストします。
全部のimgタグに有効です。
線の太さを変える場合は数字を変えます。
本来imgタグを使う場合は、altでその画像の説明、widthで画像幅、heightで
画像の高さを指定するのが正式な設定方法です。
全部設定するのはメンドーですが、文法チェックでは判定されます。
・HTMLの文法チェック ther HTML-lint gateway
Posted by Webサイトデザイナー★えあ at
2008年01月28日│[tips]tips
│Edit
