CSSの質問です。
ol liのセレクタに、プロパティ、display:inlineを設定設定すると、
olにつくはずの先頭の数字が消えてしまいます
解決方法はありますか?

A 回答 (1件)

そりゃdisplayは表示形式を定義しているんですから


inlineを指定した時点でリスト形式を放棄しています
横並びにしたいだけならたとえばfloatをつかうとか

<style>
ol li{float:left;padding-right:1.5em;}
</style>
<ol>
<li>aaa</li>
<li>bbb</li>
<li>ccc</li>
</ol>

(これでも古いIEだと数字がきえますが・・・)
    • good
    • 0

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

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

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

Qhtmlでjpg画像をアップロードして、相手のパソコンかスマホにダウンロードさせたい。

お疲れ様です。
写真(同窓会)を郵送するには費用がかかります。
そこで、ホームページをから、相手がダウンロードできるようなに
プログラムを組みたいのですが!忘れてしまいました。
 現在作成中のホームページは、写真の閲覧のみです。
どんなプログラムを組めば相手のパソコン、スマホへダウンロード
できようになりますか?

Aベストアンサー

ダウンロードさせる?

無理ですよ、相手の人にダウンロードしてもらうようにしましょう

https://30d.jp/
写真共有サービスを利用して、画像をアップロード
参加した人にしか見えないようにパスワードを設定して、URLとパスワードをメールで送ってダウンロードしてもらいましょう


既にHPを持ってるのなら、そこにアップロードして、その画像のURLを教えて右クリックで保存してもらえばいいですよ

Q変数にドットをいれることはかのうでしょうか?

変数にドットをいれることはかのうでしょうか?
var text = '.......';
alert(text);

Aベストアンサー

#1さんの提示されたとおり「変数名」にドットは入れられませんが
命題の変数内にドットを入れる=ドットを含む文字列は
提示されているソースがそのまま動きますよね?

<script>
var text = '.......';
alert(text);
</script>

Qh1タグのパンくずリストへの設置

SEO対策としてh1タグの設置を検討していますが、各ページに設置するため、パンくずリストへの設置を考えています。

[HTML]
<ol>
<li>
<a href="ホーム.html">
<span>ホーム</span></a>
</li>
<li>
<span>このサイトのご利用案内</span>
</li>
</ol>

[CSS]
ol {
float: left;
margin: 12px 0 0 20px;
}
ol li {
display: inline; /* 横並び */
}
ol li a {
padding-right: 15px;
background: url(/images/path.gif) no-repeat right; /* 矢印 */
}

「このサイトのご利用案内」をh1にしたいので、
<span>このサイトのご利用案内</span> を
<span><h1>このサイトのご利用案内</h1></span> にしたり
<h1><span>このサイトのご利用案内</span></h1> にしたり
しましたが、「ホーム」と「このサイトのご利用案内」の文字が重なってしまいます。
<span style="margin-left: ○○px; "><h1>このサイトのご利用案内</h1></span> や
<span style="padding-left: ○○px; "><h1>このサイトのご利用案内</h1></span> 
にすると重ならずに表示できますが、さらに下の階層のページなどでの汎用性が低くなり一般的でないと思います。

文字が重ならないようにする方法を教えて下さい。

宜しくお願いいたします。

SEO対策としてh1タグの設置を検討していますが、各ページに設置するため、パンくずリストへの設置を考えています。

[HTML]
<ol>
<li>
<a href="ホーム.html">
<span>ホーム</span></a>
</li>
<li>
<span>このサイトのご利用案内</span>
</li>
</ol>

[CSS]
ol {
float: left;
margin: 12px 0 0 20px;
}
ol li {
display: inline; /* 横並び */
}
ol li a {
padding-right: 15px;
background: url(/images/path.gif) no-repeat right; /* 矢印 */
}

...続きを読む

Aベストアンサー

>>やはり左端に寄ってしまいます。
改行しないで横へ並べるなら、そう書けば良いだけです。

前のh1に追加するだけ。
h1 {font-size:16px; font-weight:normal; line-height:1;}

h1 {font-size:16px; font-weight:normal; line-height:1;display: inline;}

Q自作のデータを配布したい

自作のデータを配布したいと思っています。

自作のデータというのはエクセルのひな形がメインですが、
PDFのライトノベル、イラストもちょっとあります。

ライトノベルやイラストはそれぞれ投稿サイトがあるので
そちらを利用してもいいと思っています。
※今はブログで公開してます

ですが問題はEXCELのひな形で、ブログで公開出来ませんし、
ライトノベルやイラストみたいに投稿サイトも見つかりませんでした。

EXCELのひな形を登録して配布出来るサイトってないのでしょうか?
もしあれば利用したいと思っています。 ※1
---------------------------------
それぞれ分けてアクセスするのも面倒なので、
登録制のダウンロードサイトみたいなものがあって、
前述のようなデータをアップロードして、

「使ってみたい」と思ってくれた人が無料でダウンロードできるような
サービスと提供しているサイトがあったら教えて下さい。 ※2

※1、※2のどちらでもOKです。
ご存じの方、よろしくお願いします。

カテゴリー違いでしたら、教えて下さい。
そちらのカテゴリーにアップしなおしますので。

自作のデータを配布したいと思っています。

自作のデータというのはエクセルのひな形がメインですが、
PDFのライトノベル、イラストもちょっとあります。

ライトノベルやイラストはそれぞれ投稿サイトがあるので
そちらを利用してもいいと思っています。
※今はブログで公開してます

ですが問題はEXCELのひな形で、ブログで公開出来ませんし、
ライトノベルやイラストみたいに投稿サイトも見つかりませんでした。

EXCELのひな形を登録して配布出来るサイトってないのでしょうか?
もしあれば利用...続きを読む

Aベストアンサー

ヤフードライブなどのオンラインストレージを使えば出来ると思います。

オンラインストレージにデーターをアップロードする。→ 公開用のURLを取得する。→ URLをブログで公開する。

詳しくはヤフーなどで検索して下さい。

QHTML,CSSで自分のブログ、ホームページのWebページに今見ているWebページのURLをボタンで

HTML,CSSで自分のブログ、ホームページのWebページに今見ているWebページのURLをボタンで取得出来るボタンを付けたいと思います。

どうやれば、いまWebブラウザで見ているURLを取得できますか?javascriptを使わないと無理ですか?

やり方を教えてください。

Aベストアンサー

<script type="text/javascript" language="javascript">
var urlInfo = location.href;
</script>

urlInfoの中にurlが格納されている。これを表示したいなら、

<script type="text/javascript" language="javascript">
document.write("<p>今日は" + urlInfo + "です。</p>");
</script>

と書いた位置に、<p>今日は○○○です。</p>が生成される。
○○○は取得したurlになる。

Qfor文の部分を日本語で教えてください

for文の部分を日本語で教えてください

Aベストアンサー

> これだと2が素数として表示されなくないですか?

数 i が素数なのか判定する数 j は、1 より大きく自分自身より小さい数の全てです
→ i = 2 の場合、数 j は 1 より大きく 2 より小さい数の全て
→ つまり自然数の j は存在しません

数 i の約数に、数 j が含まれていたら、それは素数ではありません
→ i = 2 の場合、自然数 j が存在しないので、含まれているわけがない
→ ゆえに 2 は素数です

QHTMLタグ、文章の装飾やサイズなど

現在、テンプレートを元にwebサイトを制作中です。
そこで、どうしても分からないことがありますので知識をお貸し下さいませんでしょうか。

<li>内です。
例文
ここから
ーーーーーーーーーーー
こんにちは。初めまして。それは凄い事になりましたね。ではこの辺で失礼いたします。
ーーーーーーーーーーー
ここまで

現在、この文章の「初めまして」が赤色、「凄い事」の背景に黄を指定している状態です。

ソースです。


ここから
ーーーーーーーー
<ul class="post"><h3>×××</h3>

<li><p>こんにちは。<span style="background-color:#FFFF00;">初めまして。</span>それは<span style="background-color:#FFFF00;">凄い事</span>になりましたね。ではこの辺で失礼いたします。</p>
ーーーーーーーー
ここまで

この赤と黄色を維持しつつ、全体の文字を例えば16にしたいのです。

もう少し言うと、上記のような設定をした文章が何行か有ります。

そして</li>で締められています。良くをいえば、<li> ~~</li>の中の文字全てに適応したいです。

色々試してみたのですが、一部しか指定できなかったりで全くいうことを聞いてくれません。
よろしくお願い致します。

現在、テンプレートを元にwebサイトを制作中です。
そこで、どうしても分からないことがありますので知識をお貸し下さいませんでしょうか。

<li>内です。
例文
ここから
ーーーーーーーーーーー
こんにちは。初めまして。それは凄い事になりましたね。ではこの辺で失礼いたします。
ーーーーーーーーーーー
ここまで

現在、この文章の「初めまして」が赤色、「凄い事」の背景に黄を指定している状態です。

ソースです。


ここから
ーーーーーーーー
<ul class="post"><h3>×××</h3>

<li><...続きを読む

Aベストアンサー

この説明文を見る限りHTML構文も気になりますが、まずHTMLのマークアップが間違っています。
HTMLのマークアップが間違っていると、ブラウザでの表示の際に正しく表示してくれない可能性があります。

<ul>の中に<h3>はできません。やるならば、

A)
<h3>xxx</h3>
<ul class="post">
<li>リスト文</li>
</ul>

もしくは、「class="post"」に対して<h3>も引っ掛けたい場合は、

B)
<div class="post">
<h3>xxx</h3>
<ul>
<li>リスト文</li>
</ul>
</div>

になります。
説明文を見る限り<p>タグは必要?と思ったので省きました。

ちなみに、<li>の中に<p>は可能です。(<h3>も可能です)
あまり現実的ではありませんが、

<ul class="post">
<li>
<h3>xxx</h3>
<p>〜〜〜〜</p>
</li>
</ul>

でも可能です。が、説明文から察するに、この構文は理想ではない気がします。

おそらく説明文から察するに(B)だと思うので、やりたいことをふまえると、
例えば、

<div class="post">
<h3>×××</h3>
<ul>
<li>こんにちは。<span class="fbg01">初めまして。</span>それは<span class="fbg01">凄い事</span>になりましたね。ではこの辺で失礼いたします。</li>
</ul>
</div>

で、<head>〜</head>内のCSS(<style type="text/css">〜</style>)、もしくは外部読み込みCSSの記述に、

.post li { font-size:16px; }
.fbg01 { background-color:#FFFF00; }

特定文字箇所の<span class="background-color:#FFFF00;">XXX</span>も何度も指定するのは面倒ですし、
あとで、その部分の色を変えたい時に、全ての該当箇所を、ひとつひとつ修正するのもナンセンスなので、
例えば、「.fbg01 { background-color:#FFFF00; }」とすれば、色を変えたいとき、このCSSの指定色を変更すれば、
全ての該当箇所が変更された色に反映します。

なお、liとかh3とかその他マークアップに関係なく、全ての文字の大きさを16pxにしたい場合は、

* { font-size:16px; }

です。

この説明文を見る限りHTML構文も気になりますが、まずHTMLのマークアップが間違っています。
HTMLのマークアップが間違っていると、ブラウザでの表示の際に正しく表示してくれない可能性があります。

<ul>の中に<h3>はできません。やるならば、

A)
<h3>xxx</h3>
<ul class="post">
<li>リスト文</li>
</ul>

もしくは、「class="post"」に対して<h3>も引っ掛けたい場合は、

B)
<div class="post">
<h3>xxx</h3>
<ul>
<li>リスト文</li>
</ul>
</div>

になります。
説明文を見る限り<p>タグは必要?と思ったの...続きを読む

Qbodyのフォントを画面更新する度にランダムに変更したい

某Webフォントサービスを使っています。

そこで、bodyに指定するフォントを、閲覧者が画面を更新する度に、フォントA,フォントB,フォントC…と、予め@font-faceで読み込んだ複数のフォントのいずれかに(ランダムに)指定されるようにしたいと思っています。
JavaScriptで実現できるのはわかるのですが、恥ずかしながら、どのように記述したら良いかわかりません…。

ご教授頂けると幸いです。
よろしくお願いいたします。

Aベストアンサー

たとえばjavascriptでcssを読み込む処理をする
再読込時に読み込み済みのcssのlinkを削除し別のcssファイルを読み込む

Qcss hiddenとvisibleを組み合わせて、表示非表示を切り替える

通常時、文字が非表示。
マウスを乗せたとき文字を表示させるため、以下のようなcssを設定しました

.answer {
visibility: hidden;
}
.answer:hover {
visibility: visible ! important;
}

しかし常に非表示にされ、マウスを乗せても表示されません
なにがいけないのでしょうか?

Aベストアンサー

:hover 対象要素の子孫に対して、表示を切り替えましょう

<style>
.answer p { visibility:hidden; }
.answer:hover p { visibility:visible; }
</style>
<section class=answer>
<p>通常時は非表示の文字</p>
</section>

Qプログラムエラー

大学で情報システムの勉強をしているのですが、テスト工程におけるエラーは論理エラーが一番多いのですか?もしそうだとして、なぜ一番多いのでしょうか?人為的なミスが原因で起こると習いましたが、構文エラーも人為的な入力ミスで起こりますよね?

Aベストアンサー

>>テスト工程におけるエラーは論理エラーが一番多い

一番多いのはケアレスミス、つまりウッカリミスです。
1とiの間違い、0とoの間違い、;と:の間違い、.と,の間違い、変数の綴りミス、変数のクリアミスなど。

ロンリミスは直ぐに発見できるが、ケアレスミスは発見に時間がかかる。

特に当事者が発見するのは相当難しい(そう思い込んでいるから)。


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング