『ボヘミアン・ラプソディ』はなぜ人々を魅了したのか >>

仕事でそのような注文を受けたのですが、方法を知りません。調べてみても見当たらず。

<ol>タグはあきらめて、全体を表組みに直すしかないのでしょうか? 何ページにも渡る大きなリストで何階層もあるため大変な作業になりそうで厄介です。なんとかなるとよいのですが。アドバイスください。お願いします。

このQ&Aに関連する最新のQ&A

A 回答 (4件)

ちょっと面倒かも知れませんが。



頭の数字だけ、ボールドになって、内容はノーマルになります。


<html>
<head>
<title></title>
<style type="text/css">
<!--
ol { font-weight: bold; }
.lic { font-weight: normal; }
-->
</style>
</head>
<body>
<ol>
<li><font class="lic">項目</font></li>
<li><font class="lic">項目</font></li>
<li><font class="lic">項目</font></li>
<li><font class="lic">項目</font></li>
</ol>
</body>
</html>
    • good
    • 0
この回答へのお礼

できました! ありがとうございました。classを毎回指定するのが面倒そうだったので、いただいた回答の中で最後にトライしたのですが(失礼しました。。)、思うようにできたのはDpopさんのだけでした。感謝です!

お礼日時:2004/06/02 20:14

#2様と同じなんですが<FONT>タグを使うより<SPAN>タグを使う方がより良いのではないでしょうか。


<FONT>タグでは通常<FONT size=2>などの使い方をするのはご存知でしょう しかしW3C HTNL4.01仕様書ではFONTの属性は推奨しないとなっており、CSSで指定が望ましいとなっております。
今回の場合<FONT>タグのみなので?なのです。
<SPAN>タグの場合、本来何もしないタグなのでこれを用いプレゼンテーションするのが望ましいとなっています。
ですから
<li><SPAN class="lic">項目</SPAN></li>
とするか、ほかに<SPAN>をつかわなければ
<li><SPAN>項目</SPAN></li>とし、
SPANに対してスタイルシートを適用すれば、後々の問題が発生しないと思います。
#2様 本当に余計な事を書いてしまいました。
申し訳ございません。

参考URL:http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401 …
    • good
    • 0
この回答へのお礼

お返事が遅くなりました。ありがとうございます! 実は既に対応済みでした。仕事でやっているのですが、fontタグの使用が一切禁止されているのです。他の職場の人に話すと「なんで?」などと言われるのですが、ほんとにそういうものなのですねー。自分でやっていることも無駄ではなかったのか!と再確認。ありがとうございました!!

お礼日時:2004/06/08 15:08

 どこまでを太字にするかによります。


 本文を含めた全体を大きくしたい場合は、CCS(カスケーディングスタイルシート)を使って<head>内に、

<style type="text/css">
<!--
ol {font-weight: bold }
-->
</style>

を入れてみてください。
 行頭の数字だけを変えたいというときは、この<!--
と-->の間に、

li {font-weight: normal}

を追加してください。また、何かあれば補足しておいてください。
    • good
    • 0
この回答へのお礼

ありがとうございます。

実はやってみたんですが、変わらないのです。
太くしたいのは数字のみです。数字の後文章中には所々太字の指定などがはいっていますが、これがいけないのでしょうか?

<style type="text/css">
<!--
ol{font-weight:bold;}
li{font-weight:normal;}
-->
</style>

でよいのですよね?

まったく変化がありません。

お礼日時:2004/06/02 19:19

スタイルシートで可能です。


<head>内に、
<style type="text/css">
<!--
ol{font-weight:bold;}
-->
</style>
と、記入し
<BODY>内に
<Ol>
<li>a
<li>b
</ol>
とすると、頭の数字も、aもbも太字になります。
即効性ではこれでいいと思いますが、
このタグを貼り付けるだけでは応用が利かないでしょうから、
スタイルシートを勉強してみたほうがいいかもですよ。
    • good
    • 0
この回答へのお礼

ありがとうございました。
言葉が足りませんでしたが、実は太字にしたいのは箇条書きの数字の部分のみなんです。本文中には所々太字の指定などがはいっています。教えていただいた方法を試したら、全部太字になってしまいました。。

お礼日時:2004/06/02 19:20

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qリストの数字のフォントサイズを変えたい

リストを使ったときに頭につく数字のフォントサイズを小さくすることは
できるのでしょうか?
文章のフォントは<li>の後にフォントタグをつければ小さくなるのですが
リストの数字が小さく出来ません。
これを小さくすることは可能でしょうか?
<ol>
<li>
<li>
</ol>

Aベストアンサー

スタイルシートを使えばできます。
たとえば、

<ol style="font-size:80%;">
<li>サンプル</li>
</ol>

のように記述すると元のサイズの 80% になります。

QCSSでborderの長さを指定、または可変にしたい。

下記のように指定していますが、これだと横幅いっぱいに下の線が表示されてしまいます。

文字なりの長さ、または指定のピクセル数にしたいのですが、どのようにしたらよいでしょうか。

h3{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

Aベストアンサー

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよければ

<h3><span>××○○</span></h3>
のようにspanで囲い、スタイルをspanに対して指定する方法もあります。

h3 span{
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

borderの長さはそのボックスの大きさですから、ボックスの大きさを指定する事になります。
h3{
width:???px;
border-width : 0px 0px 1px 5px;
border-style : solid ;
border-color : #FF3333;
padding-left : 5px;
}

また、文字数(ボックスの内容)に合わせたい場合は、ボックスを浮動化(float)する等の方法もありますが・・・そのボックスの周りへ影響が出たり、ブラウザ毎にバグや実装の違いなどが比較的多く、扱いが面倒になるのであまりおすすめできません。

HTMLの方も修正する方法でもよけ...続きを読む

Qリストの左余白の削除方法

<li>リストを作成した再に表示されてしまう、左余白部分を削除して、画面左に詰めたいのですが、上手く出来ません。
どなたかご教授頂けませんでしょうか?

=>CSS記述<=
ul li {
list-style: none;
margin: 0px;
padding: 0px;}

=>HTML記述<=
<ul>
<li><a href="#">サンプル</a></li>
<li><a href="#">サンプル</a></li>
<li><a href="#">サンプル</a></li>
<li><a href="#">サンプル</a></li>
</ul>

Aベストアンサー

ul li {

の箇所を

ul {

にするだけ

Qlist-style-type部分だけ大きくしたい

list-style-typeでdiscを選択して黒丸を表示しているのですが、
そもそもこの黒丸のサイズが小さすぎていけません。
かといって、黒丸に続くリストの文章の文字サイズは大きくしたくはありませんから、
list-style-typeのサイズだけを大きくするにはどう記述指定すればいいでしょうか?

Aベストアンサー

他に1台あるパソコンのブラウザも最新版に近いので、試す環境がないのですが…
こちらに対応ブラウザ・バージョンがずらっと並んでいるので、
list-style-image は、結構使えるように思います。
(参考URLとおなじものです)

http://www.htmq.com/style/list-style-image.shtml

参考URL:http://www.htmq.com/style/list-style-image.shtml

Qul 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;
}

表示が上手くいかないのでお助け下さい。
ul liのliにclass指定をして、それぞれのclassに異なる背景画像を表示させようとしているのですが、
なぜかclass指定をすると画像が消えてしまいます。
class指定をしない状態ですと普通に表示されるのですが、別々の画像を表示させたいと思っているので困っています。
どなたか教えて頂けないでしょうか?

また、申し訳ありませんがとりあえず表示されれば良いだけなので
htmlやcssの記述に対する細かいツッこみは勘弁して下さい。

宜しくお願いします!


【html】

...続きを読む

Aベストアンサー

>class指定をしない状態ですと普通に表示されるのですが、
このスタイルシートの書き方はどうなってますか?

>div#side ul#sidenav li.a {
このセレクタの、background-positionを消してみるとどうなりますか?

Qスペースを使わず文字位置を揃える方法

素人な者で大変申し訳ありません
以下のように、複数行の文字位置を揃えるタグはどうなるのでしょうか?
(下の例は揃っていませんが・・・)

1.あ        :ABC
2.abc       :ABC
3.あいう      :ABC
4、えお       :ABC

のように、空白部にスペースを使わずに文字位置を揃える方法です
ワードなどの「tabキー」の役割をするタグなんてありますか?

ご教示の程、宜しくお願い致します

以上

Aベストアンサー

 これは、No.がある序列リストですか?あるいは、用語とその説明のようなものでしょうか?
 HTMLは、その文書構造を記述するだけですので、それにしたがってマークアップすれば良いです。
[例][用語とその説明のようなもの]のようですから定義リストでマークアップしてみましょう。
<h3>元素</h3>
<dl class="periodic table">
<dt>水素</dt>
<dd>元素記号(H)、原子量1.008、酸素と共に水をくつる。</dd>
<dt>ヘリウム</dt>
<dd>元素記号(He)、原子量4.003、不活性ガス</dd>
<dt>リチウム</dt>
<dd>元素記号(Li)、原子量6.941、リチウムイオン電池</dd>
</dl>

<h3>元素</h3>
<ol class="periodic table">
<li><span class="element">水素</span>元素記号(H)、原子量1.008、酸素と共に水をくつる。</li>
<li><span class="element">ヘリウム</span>元素記号(He)、原子量4.003、不活性ガス</li>
<li><span class="element">リチウム</span>元素記号(Li)、原子量6.941、リチウムイオン電池</li>
</ol>

これに対して、スタイルシートを次のように書いたりします。
dl.periodic.table{counter-reset: atomicNum 0;padding-left:2em;}
dl.periodic.table dt{float:left;font-weight:bold;}
dl.periodic.table dt:before{
content: counter(atomicNum) ". ";
counter-increment: atomicNum;
}
dl.periodic.table dd{margin-left:7em;}
dl.periodic.table dd:before{content:": ";}

ol.periodic.table span.element{float:left;width:7em;position:relative;font-weight:bold;}
ol.periodic.table span.element:before{content:": ";position:absolute;right:0.5em;}

★他にどのようにマークアップされていても、用語とその説明がが区別できるようにマークアップされていれば、デザインはできます。
★デザインのためにDIVやSAPNを追加しているわけではありません。
『DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )』ものです。デザインのために書いてしまうと、デザインのためにtableを使ったのと大差ありません。
 HTML5では、
※DIVやSPANは他に適した要素がないときのための最後の手段
※文書構造を示すため
 となります。

 これは、No.がある序列リストですか?あるいは、用語とその説明のようなものでしょうか?
 HTMLは、その文書構造を記述するだけですので、それにしたがってマークアップすれば良いです。
[例][用語とその説明のようなもの]のようですから定義リストでマークアップしてみましょう。
<h3>元素</h3>
<dl class="periodic table">
<dt>水素</dt>
<dd>元素記号(H)、原子量1.008、酸素と共に水をくつる。</dd>
<dt>ヘリウム</dt>
<dd>元素記号(He)、原子量4.003、不活性ガス</dd>
<dt>リチウム</dt>
<dd>元素記号(L...続きを読む

Q「CSS」リストの2段組どのように組まれていますか?(同一カテゴリの場合)

リストの2段組ですが、皆さんどのように組まれていますか?

リストの項目が同一カテゴリーだった場合です。
例えば下記のような同一カテゴリー(花)の場合
・チューリップ
・あじさい
・たんぽぽ
・ひまわり
・すみれ
・パンジー

これを
=============
・チューリップ  ・ひまわり
・あじさい     ・すみれ
・たんぽぽ    ・パンジー
=============
のように表示させたい場合です。
投稿した後に表示がズレるかもしれませんが、
・ひまわり ・すみれ ・パンジー の頭は揃えたいです。

苦肉の策で下記のようなマークアップをしています。
<ul class="left">
<li>チューリップ</li>
<li>あじさい</li>
<li>たんぽぽ</li>
</ul>
<ul class="right">
<li>ひまわり</li>
<li>すみれ</li>
<li>パンジー</li>
</ul>
そして左右にfloatさせています。
ただ、これだとリストが途中で分断されてしまって
正しいマークアップとは言えないですよね・・・。

こういうケースって結構あるのでは、と思い、
色んなサイトを巡りましたが見つからず。

皆さんこういったケースの場合どのように組まれてますか?
いっそテーブルの方が良いのでしょうか?
項目は後から追加するものと想定してください。
(縦に可変していきます)

どうぞ宜しくお願いいたします。

リストの2段組ですが、皆さんどのように組まれていますか?

リストの項目が同一カテゴリーだった場合です。
例えば下記のような同一カテゴリー(花)の場合
・チューリップ
・あじさい
・たんぽぽ
・ひまわり
・すみれ
・パンジー

これを
=============
・チューリップ  ・ひまわり
・あじさい     ・すみれ
・たんぽぽ    ・パンジー
=============
のように表示させたい場合です。
投稿した後に表示がズレるかもしれませんが、
・ひまわり ・すみれ...続きを読む

Aベストアンサー

確かに下のソースだとIEで駄目でした・・・
以下の部分を追加してください。


.left {
width:251px;
float:left;
clear:left; /* ←追加する場所 */
}

Qtableにul,または,olを入れられますか?

<table>
 <tbody>
  <th>くだもの</th>
   <td><ul><li>りんご</li><li>みかん</li><li>すいか</li></td>
   …etcとして
くだもの
・りんご
・みかん
・すいか
としたいのですが、
<table>の<tbody>の<td>の中に<ul>の<li>を入れる方法は
HTMLの仕様に反していますでしょうか?

Aベストアンサー

きちんとネストされていれば構いません。
ただ、書かれた例だと
・テーブルを構成する<THEAD>, <TR>タグが無い
・<UL>が閉じていない
というエラーがあるので、それを直せばいいでしょう。

<table>
 <thead>
  <tr><th>くだもの</th></tr>
 </thead>
 <tbody>
   <tr><td><ul><li>りんご</li><li>みかん</li><li>すいか</li></ul></td></tr>
   :
   :
 </tbody>
</table>

Qテーブル内の文字サイズを変更したい。

HTMLのテーブル内の文字サイズを変更したいのですが。
イマイチ上手くいかずに悩んでいます。
出来れば全体的に<TABLE></TABLE>のほうでいじれますか?
<TD>タグや<TR>タグのところでいじくるのですか?

Aベストアンサー

いろいろやり方はありますが
文字単位でサイズを変更するには
#2の方法ですね。

テーブルごとやセル(<TD>)ごとにサイズを変更するには
スタイルシート(CSS)を使用します。

テーブルごとにサイズを変更する場合
<TABLE style="font-size : 20px;">

セル(<TD>)ごとにサイズを変更する場合
<TD style="font-size : 20px;">あああ</TD>

#1の方法だとページ内の全てのセル(<TD>)に設定することになります。

スタイルシート(CSS)はこれら以外にも
いろいろな設定方法があります。

Qcssで「下よせ」ってどうやっていますか?

フロートのレフト、ライトはいいとして、

あるボックス要素内(A)に異なるボックス要素(B)をいれます。
この(B)を(A)の一番そこにはりつかせたい時にどうすれば
最もよいのでしょうか?

いいアイデアをご教授ください。

Aベストアンサー

こんなのはどうかな?

position: absolute;
bottom: 0px;


人気Q&Aランキング