- ベストアンサー
<LI>（リスト）をサイズ指定し、絶対値にすることは可能でしょうか
elttacの回答
No. 1～No. 3 の回答をつけた者です。 理屈では No. 3 で申し上げた方法でよいのですが，こちらで Windows 版の Internet Explorer 6，Netscape 6.2，Opera 6，Opera 7.2 で確認したところ，Opera 6 だけが期待どおりの出力になりました。なかなかに難しいものです。それ以外は，ul の行頭記号のサイズは，フォントサイズ指定には連動せず，ブラウザのフォントサイズ指定やズーム指定に連動するようです。 それで，掲げてくださった例ですが，これには決定的な誤りがあって，「li 要素は ul 要素または ol 要素の内側にしか現れられない」というものです。ですから，大前提として， <ul> <li>menu</li> </ul> と書かなければなりません。 それから，font 要素の扱いですが， <li><font ...>...</font></li> では理屈上どうやっても行頭記号の大きさは変わりません。というのは，行頭記号は li 要素がその中身とは別に作り出していることになっているので，その内側に働きかけても無駄ということになります。 さらに，font 要素は今後の HTML ではお役ご免の予定ですので，<font size="...">...</font> または <font color="...">...</font> 以外の記述では，より一般的な記述である <span style="...">...</span> を使用されることをおすすめします。
関連するQ&A
- CSSでリスト[li]の表示がズレる
HTMLの無料テンプレートを使おうとこちら http://simple.sub.jp/temp.htm からEタイプ（サイズ固定）をダウンロードしたのですが ローカルで見てみるとfirefoxでヘッダー下のリンク（liで記述）がずれます。 添付画像：firefoxでのスクリーンショット 修正しようと見てみましたがどこが悪いのか分かりません。 「.topnavi li」だと思うのですが、どこが悪いのでしょうか？ ご指摘お願いいたします。 HTMLの該当部分 <div id="banner"> <h1><a name="TopofPage">ここにサイトのタイトル</a></h1> </div> <div class="topnavi"> <ul> <li><a href="#">リンク</a></li> <li><a href="#">リンク</a></li> <li><a href="#">リンク</a></li> <li><a href="#">リンク</a></li> <li><a href="#">リンク</a></li> </ul> </div> cssの該当部分 .topnavi{ float:left; width:100%; background:#99ccff; border-width:1px 0 1px 0; border-style:solid #999; height:20px; } .topnavi li{ display:block; float:left; width:125px; text-align:center; font-size:1.2em%; list-style-type:none; }
- ベストアンサー
- HTML
- ul li を使ったリストを作りたいんですけど。。。
CSS初心者です。 ul liを使ってこんな感じのリストを作りたいんですけど うまくいきません。 ↓ ------------------------------------ ああああ いいいい うううう ええええ おおおお かかかか きききき くくくく けけけけ ここここ ささささ しししし すすすす せせせせ そそそそ ------------------------------------ なんとか作ってはみたんですが、IE7ではなんとかそれらしく 表示されますが、Opera9で確認すると うまく表示されません。 （「あ」の後に改行されずに「い」がきてしまったり・・・） すいません。 どなたか分かる方がいれば教えてください。 よろしくお願いします。
- ベストアンサー
- HTML
- ＣＳＳでulとliを指定し横に並べたいです。
ulとliを使っても横に表示できる方法わかる方教えてください。 例 <ul> <li>あああ</li> <li>いいい</li> <li>ううう</li> <li>えええ</li> </ul> 普通は ・あああ ・いいい ・ううう ・えええ となってしまいますがこんな感じで作りたいのですが。 ・あああ ・いいい ・ううう ・えええ みたいに横にしたのですがどうやってやればいいかわかりません（泣） たぶんＣＳＳで指定するのかと思ってますが、違うんでしたらそのやり方を教えてください。
- ベストアンサー
- HTML
- <li></li>の数を制限
下記のソースのように<li>タグが多数あるものを 上から3つのみを表示させるような形にしたいのですが （<li></li>を上から3つのみに制限） どのようなスクリプトを書けば良いでしょう？ <div id="box"> <ul> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </div> ご伝授いただけるととても助かります！
- ベストアンサー
- JavaScript
- ul liのclass指定について
表示が上手くいかないのでお助け下さい。 ul liのliにclass指定をして、それぞれのclassに異なる背景画像を表示させようとしているのですが、 なぜかclass指定をすると画像が消えてしまいます。 class指定をしない状態ですと普通に表示されるのですが、別々の画像を表示させたいと思っているので困っています。 どなたか教えて頂けないでしょうか？ また、申し訳ありませんがとりあえず表示されれば良いだけなので htmlやcssの記述に対する細かいツッこみは勘弁して下さい。 宜しくお願いします！ 【html】 <div id="side"> <ul id="sidenav"> <li class="a"><a href="test.html">test</a></li> </ul> </div> 【css】 div#side { display: inline; float: left; width: 178px; margin-top: 20px; text-align:center; background:#fff; } div#side ul#sidenav { list-style-type:none; border: none; } div#side ul#sidenav li.a { background:url(../common/side.gif) no-repeat left; background-position: 6px 11px; } div#side li { position:relative; width: 165px; height:40px; padding: 1px; margin: 5px; text-align:left; border: 1px solid #8c8c8c; }
- ベストアンサー
- CSS
- リストの数字のフォントサイズを変えたい
リストを使ったときに頭につく数字のフォントサイズを小さくすることは できるのでしょうか？ 文章のフォントは<li>の後にフォントタグをつければ小さくなるのですが リストの数字が小さく出来ません。 これを小さくすることは可能でしょうか？ <ol> <li> <li> </ol>
- ベストアンサー
- HTML
- ul・liについて
ul・liを使って <ul> <li>みかん</li> <li>りんご</li> <li>レモン</li> </ul> というリストをつくったのですが(リストマークなし)、FirefoxとIEでは表示がだいぶずれてしまいます。（各行のインデントが発生する） これって妥協するしかないんですかね？ ご回答よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- <li>の正しい使い方について
<li>の使い方についてなんですが、 <ul> <li class= "a"></li> <li class= "b"></li> <li class= "c"></li> </ul> みたいに、異なったコンテンツ(文章や画像、図表など)も<ul>で一括りにして、cssで<li>単位の整形するのって使い方として間違ってますか? 異なったコンテンツごとに<ul>か<div>など使うべきなのでしょうか?
- ベストアンサー
- HTML
お礼
複数のブラウザで表示確認までしていただいてありがとうございます。 ちなみに私はIE5.5を使っています。 <LI>要素の特質についても、要点は理解できました。 font要素がお役ご免になるなんて、知りませんでした…。 XHTMLなどとも関係してくるんですか？ それと、やはり自分のページのレイアウトから考え直すことにしました。 この質問は良いきっかけになりました。ありがとうございました。 今晩は夜遅い中つまらない質問におつきあいいただいてありがとうございました。