- ベストアンサー
divとspanの使い分け
cobolerの回答
- coboler
- ベストアンサー率57% (57/99)
<h1>はそのもの単体で意味を持つタグですが、 <div>、<span>は意味を持たないタグです。 また、<div>はブロック要素で<span>はインライン要素 なので、<div>を用いた場合には強制的に改行が入ります。 例) html <div>test11</div>test12 <span>test21</span>test22 表示 test11 test12test21test22 となります。なのでフォントサイズの指定も上記のことを 踏まえてタグの使い分けをしてはどうでしょうか。
関連するQ&A
- FC2ホームページで大見出しのフォントを変更したい
<div id="">で名付けてｃｓｓで指定し、孫要素<h1></h1>の文字サイズと書体を変えたいのですが、何か間違えているらしく反映されません。お助け下さい。 ---ｃｓｓ--- #id名 h1{ font-size: smaller; font-family:'メイリオ',"ヒラギノ丸ゴ Pro",sans-serif; } ---html--- <div id="id名"> <div> <h1>テスト</h1> <p>ほにゃらら</p> </div> </div> フォントサイズに関しては、正直FC2ファイルエディタで操作し、htmlの方に<span>で指定してもらえば解決するのですが、htmlとcssの勉強もかねているので、cssファイルで指定する方法についてご教授頂きたく存じます。
- ベストアンサー
- ホームページ作成ソフト
- CSS font-sizeのパーセンテージ指定「管理がややこしくないですか？」
色々実験しているのですが、、、 CSSでフォントサイズを「％」指定すると、サイズの基準になるのはひとつ前の親要素のフォントサイズになるみたいですね。 ＝＝＝＝＝＝＝＝＝＝＝＝ <div style="font-size:80%">あああ<span style="font-size:100%">いいいい</span>あああ</div> ＝＝＝＝＝＝＝＝＝＝＝＝ 上記の場合「いいい」のサイズは「あああ」に指定している「80％」を継承し、基準値となるので「いいい」と「あああ」のサイズは変わらない。 「いいい」をブラウザデフォルトの16px相当のサイズで表示しようとすると、「<span style="font-size:130%">いいいい</span>」にしなくてはいけないようです。（少なくとも自分が実験した限りでは・・・） 親要素どころか、先祖要素なんかも影響してくることを考えるとテキストサイズを「％」指定することはとてもややこしいことでは無いですか？どのように管理されていますか？ 最近は文字サイズはpx等の固定ではなく、相対指定するのが望ましいと言われているので「％」で指定していこうと思っているのですが。 基本的な質問ですみません。 ※質問しやすいように「style」直接記述をしていますが、普段はCSSファイルをhtmlに読み込みしています。
- ベストアンサー
- HTML
- divの中にspanを右寄せにするには？
画像のような要素構成をしたいと思うのですがうまくできません・・・ 詳しい方教えていただけませんでしょうか？ divの中にspanを何個か右寄せで配置したいと考えています。 最近のマイクロソフトのサイトのようにボタンをspanで作りたいと思っています。 divで右寄せをしようとするとdivの中にa hrefを含めることは出来ないといったエラーが出てしまい困っております・・・
- ベストアンサー
- CSS
- 【CSS】div や span でクラスやIDを使わない
簡潔に質問させていただきます。 div や span でスタイルを適用する際、 不要であればクラスやIDを省くことは文法として間違っていますか？ 要は、<div>テキスト</div> <span>テキスト</div> これだけです。 (スタイルは親要素＆セレクタで指定しています) 単なる要素として考えれば問題ないと思いますが、 そもそも単体では意味の無い要素なのでどうなのでしょうか。 尚、ブラウザ(IEとFireFox)では問題なく適用されてました。 色々情報を検索しましたが良い結果が得られませんでしたので、 ご存知の方、ご教授お願いいたします。
- ベストアンサー
- HTML
- IDをspanとdivに適用させると表示はそれぞれ違いますか？？
WEBを勉強中です。 spanとdivにそれぞれ外部ファイルで #header{height:100px;border-top:20px solid #99ff66;} と適用させたんですがspanだけborder-top:20px solid #000000の表示が出ませんでした。 spanはインライン要素だからIDは使えないということでしょうか？？ <span id="header"> と本文に記入したんですが、、、
- ベストアンサー
- HTML
- CSSでdivのheightを動的に
DIV要素を作り、その中にテキストを配置しています。これの高さ(height)をCSSで次のようにしたいのですが。どのようにすれば良いでしょうか。 1.文章量が多く、画面外まではみ出したらDIV要素の高さをそれに追従させる。 2.文章が画面内に収まる場合、余ったスペースをDIV要素ですべて埋める。 DIV要素のheightを動的に変化させたいのでpxによる絶対値指定はしません。パーセント指定で100%にしてもうまくいかず、調べてみたところこれは親要素の値に依存するとのことでした。そこで html, body { height: auto; } #main { height: auto; } としてみたところ、1.の「はみ出した場合のサイズ追従」は実現できましたが、2.の「余ったスペースを埋める」ことはできませんでした。逆に html, body { height: 100%; } #main { height: 100%; } にすると2.の「余ったスペースを埋める」ことはできますが1.の「はみ出した場合のサイズ追従」はできません。この両方を実現することってできませんか？
- 締切済み
- CSS
- span要素にのみwhite-space: nowrapを指定したい
CSSによる改行指定が思う様にできなくて困っています。 幅400pxのボックスの中で、<span>～</span>の間では改行せず、</span>と<span>の間で自動改行するようにしたいと考えています。 スタイルシートに div{width:400px;} span{white-space: nowrap;} HTMLに <div> <span>type1</span><span>type2</span><span>type3</span>... </div> のように表記したのですが、実際にはdivで指定した幅を無視してどこまでも改行なしで表示されてしまいます。 どのように指定すれば目指している形にできるでしょうか？
- ベストアンサー
- HTML
- CSSのDIVというモノがいまいち分かりません。
HTMLもおぼつかないまま、四苦八苦しながらCSSの勉強をしています。その中で出てくるDIVというセレクタはどの様な特性を持つのかが、よくわかりません。HTML文書の最初にCSSを定義しなくても、途中からいきなりCSSを定義できてしまう、というものなのでしょうか？色々なサイトや本を読んでみるものの理解できません。ついでにSPANとの違いも分かりません。 それからCSSについて説明されている文章を読むとたとれば“H1”や“P”等のセレクタの次に「属性」「値」を定義するとありますが、すべてセレクタを“class”にしてしまうのは良くないのでしょうか。なにぶん初心者の為、分かりづらい文章になっているかとは思いますが、何卒ご教授ください。
- ベストアンサー
- その他（プログラミング・開発）
- 子<DIV>で定義したのに、親<DIV>の定義が優先表示
CSS の 子<DIV>で定義したのに、親<DIV>の定義が優先表示されてしまう。 CSSファイルで #oya {font-size: 1em;} .kodomo {font-size: 20pt;} と定義。 HTMLファイルで <body> <div id="oya"> AAAAA <div class="kodomo"> BBBBB </div> </div> </body> としても、AAAAA と BBBBB は同じ文字サイズです。 BBBBBは、#kodomo 定義の文字サイズで表示したいのですが、 どうすればよいですか？
- 締切済み
- HTML
お礼
アドバイスありがとうございます＾＾ 使い分けを理解しつつ、そのもの自体の意味も理解できるよう勉強します。