Close
iconプロパティは、要素のアイコンを指定する際に使用します。
文書内のテキストなどが多すぎて閲覧の邪魔になる場合、
iconプロパティで任意の要素にアイコンを割り当てることで閲覧しやすくなるかもしれません。
iconプロパティの値には、URIでアイコンファイルを指定します。
アイコンファイルはカンマ区切りで複数指定することができますが、異なるフォーマットのアイコンを指定しておくことで、
様々なプラットフォームやメディアに合わせて、アイコンを使い分けることができます。
ユーザーエージェントは、カンマ区切りで指定されたURIを1つずつ参照して、描画可能なアイコンを表示します。
描画可能なアイコンが無い場合には、autoと同じ表示となります。
iconプロパティで指定する要素のアイコンは、contentプロパティの値がiconに設定されているときに有効となります。
※メモ：iconプロパティについては、動作を確認中です。上記の説明は大体合っていると思いますが、以下のサンプルはイマイチ自信がありません。
img.sample, embed.sample {content:icon;}
img.sample {icon:url(../images/icon_image.png);}
embed.sample {icon:url(../images/icon_embed.png);}
<html>
<head>
<link rel=”stylesheet” href=”sample.css”
type=”text/css”>
</head>
<body>
<h4>iconプロパティを適用しない場合</h4>
<p>
<embed src=”https://www.htmq.com/wp-content/uploads/2024/07/htmq.swf” width=”88″ height=”31″>
<img src=”https://www.htmq.com/wp-content/uploads/2024/07/img002.gif” alt=”イラスト”>
</p>
<h4>iconプロパティを適用した場合</h4>
<p>
<embed class=”sample” src=”https://www.htmq.com/wp-content/uploads/2024/07/htmq.swf” width=”88″ height=”31″>
<img class=”sample” src=”https://www.htmq.com/wp-content/uploads/2024/07/img002.gif” width=”128″ height=”128″ alt=”イラスト”>
</p>
</body>
</html>
img.prefix_sample, embed.prefix_sample {
content:icon;
content:-moz-icon;
content:-webkit-icon;
content:-o-icon;
content:-ms-icon;
}
img.prefix_sample {
-moz-icon:url(../images/icon_image.png);
-webkit-icon:url(../images/icon_image.png);
-o-icon:url(../images/icon_image.png);
-ms-icon:url(../images/icon_image.png);
}
embed.prefix_sample {
-moz-icon:url(../images/icon_embed.png);
-webkit-icon:url(../images/icon_embed.png);
-o-icon:url(../images/icon_embed.png);
-ms-icon:url(../images/icon_embed.png);
}
<html>
<head>
<link rel=”stylesheet” href=”sample.css”
type=”text/css”>
</head>
<body>
<h4>iconプロパティを適用しない場合</h4>
<p>
<embed src=”https://www.htmq.com/wp-content/uploads/2024/07/htmq.swf” width=”88″ height=”31″>
<img src=”https://www.htmq.com/wp-content/uploads/2024/07/img002.gif” alt=”イラスト”>
</p>
<h4>iconプロパティを適用した場合</h4>
<p>
<embed class=”prefix_sample” src=”https://www.htmq.com/wp-content/uploads/2024/07/htmq.swf” width=”88″ height=”31″>
<img class=”prefix_sample” src=”https://www.htmq.com/wp-content/uploads/2024/07/img002.gif” width=”128″ height=”128″ alt=”イラスト”>
</p>
</body>
</html>
どのカジノが自分に最適か分からないですか?
