• ベストアンサー

外部CSSファイルで未定義のclass指定時に適用される内容は?

HappyDaysRararaの回答

回答No.2

BLUEPIXYさんの追加になりますが、 CSSファイル内の初めに指定したものより、後に指定されたものの方が適用されます。 つまり上書きされることになります。 また、デフォルトの値は同じでも、OSやブラウザによって微妙に異なることがあります。 例えば同じfont-size:mediumでも大きさは異なります。 mediumが何pixelかはブラウザなどによります。 他にもmarginやpaddingも○○pixelとは決まっていません。 CSSを使用してレイアウトをどの環境でも全く同じにというのは、HTML以上に難しいですよね。 どのように表示されるか想像できるようになるまでは、それぞれのOS、ブラウザで確認しながら作成していくしかないように思われます…。

higklm
質問者

お礼

ありがとうございました!

関連するQ&A

  • かなり困ってます!CSSが適用されません…

    WindowsXPでDreamweaverMXを使っています。 body {font-size: 12px;} .px10 {font-size: 10px;} という内容の外部スタイル「css.css」を作り、テンプレートに「css.css」を適用しました テンプレートを元にページをつくり、部分的に <td class="px10">文字列</td> といった感じで適用しました。 Dreamweaver上ではちゃんと適用されているのですが、ブラウザでみてみると文字が小さくなっていません。 bodyの12pxはブラウザ上でもちゃんと適用されています。 何がいけないのか、わかりません。どなたか解かるかたがいたらお知恵をかしてください。

    • ベストアンサー
    • HTML
  • tdの中のtableの中のtd

    .box{~~} という具合にfont-sizeやline-heightを スタイルシートで定義しています。 あるtdの中に<td class="box">で そのスタイルを適用させるまではいいのですが、 そのtdの中にさらにtableを作った場合、 その中にはboxスタイルが適用されません。 入れ子になっている影響かな?とは思うのですが、 この場合、どう指定したらよいのでしょうか。 すべてのtdにclass指定するのは避けたいです。

    • ベストアンサー
    • HTML
  • 外部css定義したclassをhtmlで引き継ぎ別名で定義する方法

    いつもお世話になります。 外部cssで、例えば xyz.css div.abc{ font-size:13px; width:100px; height:120px; border:solid; border-width:2px; border-color:#460675; } などと定義し、 htmlで <link rel="stylesheet" href="xyz.css" type="text/css"> <style type="text/css"><!-- div.def{ ここで、class abc の内容の一部のみ変更、追加をしたいんですが、 その記載方法がわかりません。 } --></style> 次のようにしてもできますが、 <div class="abc" style="ここに記載" ・・・・ JavaScriptで、classを切り替えて使用したいので、 cssで定義したclassを基に新たなclassを新たな名前でそれぞれのページでできないものかと調べています。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • CSSで使う CLASSに関して

    こんにちは。CSSに関しての質問なのですが。 外部スタイルシートで登録していて <span class="c5"> 文字<br> </span> といった設定をしていて 外部スタイルシートで .c5 { color:#FF9934; font-weight: bold; } といった設定をしています。 しかしIEでは正常にカラーが変わって表示されるのですが、FireFoxでは表示されません……。 IEよりもFireFoxの方がタグ等に対して厳密な解釈をしていると思うのですが、この設定は何がおかしいのでしょうか? どなたかわかる方、回答をよろしくお願いします。

    • ベストアンサー
    • HTML
  • CSSを適用…させない!

    ちは! さてさて~スタイルシートで、たとえばページ内のtableすべてにスタイルシートを適用させるため書くのは TABLE{ うんぬん } ですが!この状態で、ページ内の数個のtableにはこの「うんぬん」を適用させたくない! だからって、適用させたいtableにclassを設定しテクノは面倒だ! そこで!、適用させたくない数個のtableに、「TABLE」に対してのstyleは適用させない!っていうclassを書く。 そんなCSSありますか?(わかりにく・・・い・・・) とりあえず、「ここは適用しなくていいよ」っていうCSSありませんかね?探してもないものはないんでしょうか・・・

    • ベストアンサー
    • CSS
  • cssにおけるフォントの大きさの制御と外部ファイルについて

    現在多くの方々に見ていただけるようなホームページをと思って自分のページを制作しているのですが、フォントの大きさのことで困っています。 通常のIEではデフォルトでフォントを表示すると非常に大きな文字になるので-1のフォントを使用しています。しかしNNだと(特にお年寄りには)見づらいページになってしまうような感があります。 そこでスタイルシートでIEでもNNでもMacでもWinでも10ptの文字にして、文字にふれたときに下線がつくなどの処理をしました。 <style type="text/css"> <!-- a:link {font-size: 10pt; text-decoration:none; color:#000000; } a:visited {font-size: 10pt; text-decoration:none; color:#000000; } a:active {font-size: 10pt; text-decoration:none; color:#000000; } a:hover {font-size: 10pt; text-decoration:none; color:#FF0000; } --> </style> しかし、全く見られないなど(おそらくブラウザのバージョンにも依存するのだと思いますが)の意見もあり、困っています。 個人的には一番いい形で見てほしいし、多くの人にも見てもらいたいのでどうすればいいだろうと悩んでいます。 そこでご存じの方に教えていただきたいのですが (1)あまり負担にならない程度にそれぞれのマシンごとの識別させたい、もしくは、対応できないブラウザの場合は、通常のデフォルトサイズのフォントで見てもらうようにする方法はないでしょうか? (2)cssやjavascriptなどは外部ファイルとしてhtmlファイルからリンクさせることが可能かと思いますが、実際の場合、htmlに埋め込む場合とリンクする場合で何か変わってくることはあるのでしょうか?(ひょっとして、複数のファイルにスタイルやスクリプトを適応させることができるというぐらいのメリットなのでしょうか?) お手数おかけしますがよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • <img>タグにCSSのclass設定可能?

    <img>タグにスタイルシートのclassは、直接設定できるのでしょうか? 例えば,以下のようにテーブルの中にexample.jpgという画像があるとします。 <table border="4" width="250"> <tr> <td align="left"> <img src="example.jpg" width="100" height="100" borde="0"> </td> </tr> </table> この場合、<td align="left">とあるのでexample.jpgはセルの中で左揃えになって表示されます。 質問1: ここで、スタイルシート使用して、<td align="left">のまま、example.jpgをセルの中で中央揃えにして表示したいとします。また、スタイルシートを使用して、example.jpgの上下には10pxのマージンを設定します(ここでは、スタイルシートに関する質問のため、あえてhspaceは<img>タグに使用しません。)。スタイルシートの指定は、<head></head>内で行なうことにします。 この場合、以下のように<img>タグの中に直接classを設定できますか?できない場合は、その理由、正しいやり方等をお教え下さい。 <head> <style type="text/css"> .abc{ text-align:center; margin-top:10px; margin-bottom:10px: } </style> </head> <table border="4" width="250"> <tr> <td align="left"> <img class="abc" src="example.jpg" width="100" height="100" borde="0"> </td> </tr> </table> やはり、<div></div>で<img>タグを囲んで、 <head> <style type="text/css"> .abc{ text-align:center; margin-top:10px; margin-bottom:10px: } </style> </head> <table border="4" width="250"> <tr> <td align="left"> <div class="abc"> <img src="example.jpg" width="100" height="100" borde="0"> </div> </td> </tr> </table> などとするしか方法がないのでしょうか? 質問2: また、スタイルシートを使用せずに、上記のテーブルで<td align="left">のままexample.jpgを中央揃えにする方法はあるのでしょうか? よろしくお願いします。

    • ベストアンサー
    • HTML
  • CSSファイルが見当らないclass名があり、しかもCSSが効いています。どこにあるんでしょうか?

    tableのtdやthの背景にうまく画像が入っていてうまいつくりがあったので、方法を調べようとしてソースを見て、CSSファイルを調べるのですが、該当のclass名が検索しても存在しないのです。こんなこと初めてです。 なのにちゃんとCSSは効いています。HTMLソースには記述という記述がないので、どう考えても外部スタイルシートとしか思えないのですが・・・ JavaScriptで操作しているのか?と思ってそのあたりも見はしたのですがわかりませんでした。 以下のURLです。 ※ちなみに「比べてください!圧倒的なコストパフォーマンス」というところの表のように、背景画像や2ピクセルでの区切り線、tdやthによって背景画像や色を変更している手法などを知りたいものです。 http://www.rensaba.com/campaign/ocssl/ とりあえず、tableタグにある「class="comparison"」が見当たらないのです。 このソースにかかれてあるCSSファイルは複数ありますが、全て検索かけてみたのですがひとつも出てきませんでした・・・・ この表の作り方だけでなく、いったいどうやって効かせているのかも知りたいです。 宜しくお願い致します。

    • ベストアンサー
    • HTML
  • 外部CSSを使ったテーブルが作りたいのですが・・・。

    以前こちらで質問させて頂いて、「スタイル作りはCSSで」、と教えて頂き、CSSの勉強を始めました。 早速壁に当たっていまして、お知恵を拝借したいです。 外部CSSファイルに、ul.gaibu{color:ff0000}と記すと、 HTMLファイルに<ul class="gaibu">ここは赤で表示</ul> となる事は出来たのですが、 テーブルの場合、 外部CSSファイルにdiv#table{設定値}を記し、 HTMLに<div id=table>とすると、外部CSSの設定値が反映されましたが、 <tr>や<td>の内容をどう設定して、HTMLにどう記載すれば反映するかが分かりません。 因みに外部CSSに tr.table1 {border:1px #333333 solid; line-height:25px; padding-left:10px; paddting-right:10px; text-align:left; vertical-align:middle} と記載し、HTMLの方に <tr><td class="table1">表1</td><tr>としましたが、 CSSの内容は反映されていません。 宜しくお願い致します。

  • [Dreamweaver8]テンプレートに外部CSSを適用→HTMLドキュメントにCSSが適用されないのは何故?

    Dreamweaver8初心者で、現在勉強中の者です。 Dreamweaverのテンプレート機能を使った、外部CSSの設定方法についてお尋ねします。 ディレクトリは現在、以下のような状態です。 [サイト -SampleWebSiteFolder-]    |―[Templates]    |   |―[style.css]    |    L―[template.dwt]    |     L[index.html] ※拡張子の無いものはフォルダを表します。 index.htmlファイルへCSSを適用させたいのですが、適用されないで困っています。 cssは、外部スタイルシートファイルを用意(style.css)し、テンプレート(template.dwt)に対して、CSSスタイルパネルの[スタイルシートを添付]ボタンより設定しています。 結果、テンプレート(template.dwt)に対してはCSSが適用されるのですが、HTMLドキュメント(index.html)にはCSSが適用されていない状態です。 テンプレートを用いて外部スタイルシートにてサイトを管理する場合、上記のケースにおける問題の原因は何でしょうか。 ちなみに、テンプレート[template.dwt]及び、HTMLドキュメント[index.html]の<head></head>内には、以下のソースが記述されています。 <link href="style.css" rel="stylesheet" type="text/css" />