ベストアンサー

文字の先頭につけるアイコン

2009/02/12 01:18

文字先頭につけるアイコン文字先頭表示するアイコンの表示方法がわかりません。アイコンの選択基準もどのような規格（サイズ、拡張子）選択したらよいか、わかりません。よろしくお願いします。

4o3a6g6e
お礼率10% (7/64)

HTML
回答数4
ありがとう数2

みんなの回答 （4）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

ORUKA1951
ベストアンサー率45% (5062/11036)

2009/02/17 18:34 回答No.4

No.2 ORUKA1951です。＞回答のように★ではなく、何か、★の部分をヤフーの動くスマイルマークのようなアイコンにしたいとかです。　それだけでは、情報不足なのです。　あくまで表示したいということは、プレゼンテーションの問題であって、そのテキストがHTMLの文書構造の中で何なのかが示されてないからです。　たとえば、<body>内の本文文章<div class="main">で、見出しがある。例： <div class="main"> 　<h2>見出し</h2> 　<p>段落</p> 　<p>段落</p> 　<h2>見出し</h2> 　<p>段落</p> 　<p>段落</p> </div> のようなHTMLで、本文中の<h2>の先頭にアイコンをつけたい場合も、　あるいは、リンクのリストの先頭につけたいのなら例: <ol id="navigation"> 　<li><a href=""></a></li> 　<li><a href=""></a></li> 　<li><a href=""></a></li> </ol> 　リストの先頭に画像を表示するようにスタイルシートで指定すればよい。　たぶん、ここまでの説明はちんぷんかんぷんだと思います。画面でどのように表示するかは、スタイルシートで指定しますが、その前提として、上記の例のようにきちんとHTMLでマークアップされていることが前提です。＞どちらになるのかはよくわからないのですが、　の時点では、アドバイスはこれ以上のことは出来ません。適切なマークアップはどのようにしたらよいかは、はじめてのWebドキュメントづくり　 http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ 　などで、しっかり正しい方法を身につけてください。仕様書翻訳メンバーの主筆の内田さんがお子さんのために書かれたものと聞いています。ですから、下手なマニュアル本よりも、はるかに役立つかと・・　マークアップが完了したら、改めて上記のようなHTMLをお示しの上、訪ねられたらよいと思います。

ログインすると、全ての回答が全文表示されます。

その他の回答 (3)

noname#100277

2009/02/12 22:44 回答No.3

CSSを使う。 li{list-style-image: url('ファイルへのパス')} <ul> <li>文字列</li> </ul> 画像の縦横の大きさは32px程度が限界でしょう。

ログインすると、全ての回答が全文表示されます。

ORUKA1951
ベストアンサー率45% (5062/11036)

2009/02/12 08:39 回答No.2

＞文字先頭につけるアイコン文字先頭ではなく、テキスト先頭ですよね。これはまったく異なります。文字(font)先頭と言うと、「★文★字★先★頭」のように文字一つ一つになります。また、テキスト先頭として、それは段落ですか、それともリストですか？　・一行目　　　　　→　　　★一行目　・二行目　　　　　→　　　★二行目としたいのか、 ★文字先頭ではなく、テキスト先頭ですよね。これはまったく異なります。としたいのか、

質問者

補足 2009/02/12 14:07

どちらになるのかはよくわからないのですが、回答のとおりだとするとテキスト先頭に、というようになるのでしょうが、回答のように★ではなく、何か、★の部分をヤフーの動くスマイルマークのようなアイコンにしたいとかです。

ログインすると、全ての回答が全文表示されます。

Hardking
ベストアンサー率45% (73/160)

2009/02/12 02:05 回答No.1

HTMLの<IMG>タグ、またはCSSで画像ファイルを表示します。画像ファイルの種別は、bmp, gif, jpg, pngなどで画像サイズは、画像の伸縮ソフト、width, heightアトリビュートで調整します。例１ <div><img src="xxx.png" width="128" height="128">あいうえお</div> 例２ .myimg { width:128px; height:29px; background:url(xxx.png) no-repeat left bottom; } <div class="myimg"></div><div>あいうえお</div>

質問者

補足 2009/02/12 02:34

回答ありがとうございます。アイコンの表示はできましたが思ったより大きかったのでもう少し小さいものにしようと思うのですが、text設定コードのような、何かもっと小さいアイコン表示コードのようなものはないでしょうか？調べてみたのですが、どれがどのコードなのかわからないものが多かったので、よろしくお願いします。

ログインすると、全ての回答が全文表示されます。