- ベストアンサー
ボーダーが反映されません
スタイルシートです。一部略しています。 table.kiji_table { background-image: url("/img/kabe/beach.jpg"); border-top-width: 5px; border-top-color: brown; ] これでテーブルに画像は現れますが、ボーダーが出てきません。 何故かおわかりでしょうか？
- ame-sanc
- お礼率83% (1229/1475)
- その他（プログラミング・開発）
- 回答数3
- ありがとう数3
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style type="text/css"> table.kiji_table { background-image: url("/img/kabe/beach.jpg"); border-top-width: 5px; border-top-color: brown; border-style:solid; /* ここを追加した */ } /* 括弧の種類が違う */ /* 念のために言っておくが，tr,th,tdに対しては指定していないので 各セルの罫線は表示されない */ </style> <title>実験</title> </head> <body> <!--個人的にはtableってのがクラス名に入るのって隙じゃないんだよね --> <table class="kiji_table"> <caption></caption> <thead> <tr><th>項目名</th><th>値</th></tr> </thead> <tbody> <tr><td>名前</td><td>キジ</td></tr> <tr><td>種別</td><td>鳥</td></tr> </tbody> </table> </body> </html>
その他の回答 (2)
- himajin100000
- ベストアンサー率54% (1660/3060)
>ちなみに「tableってのがクラス名に入るのって・・」というのは、何かあるのですか？ 個人的な好みの問題ではあるんだけど、(うぁ、「隙」って書いているorz) http://www.asahi-net.or.jp/~jy3k-sm/css1/2003maki/2.html#h223 >クラス名は「文章中での意味」に基づいて付けることが重要です。もし，期待するスタイル効果に基づいたクラス名「RED」「BIG」などを採用すると，文書構成にとっては何の意味も無いばかりか，最終的にはHTML内にスタイルを埋め込んだのと同じようにマークアップが混乱してしまいます。“大きくしたい”などの見栄え指定はスタイルシートに任せましょう。HTML文書には，見栄えを変える根拠（人名だから，など）を記述しましょう。 で例えば HTMLにはhr要素ってのがある horizontal rule(水平区切り) んだけど、 これが【horizontalでなければならない理由なんかこれっぽっちもない】んだよね。まだseparator(区切り)って名称の方が好感が持てる。 同じように、navigation-barとかいうクラスにも反感を持っている。 【bar】である必要性なんかどこにもないから、navigationであるべき、って思うの。 今回のケース考えたときにtableである必要性は本当にあるだろうか？ table要素でマークアップするところまではいいんだけど table.kijiで十分じゃないの？って思ったんだよ。 ってコト。まぁこの辺は宗教的な話になるから気にならないなら気にしなくても仕方ないかな、とは思うんだけどね #それにしてもxmlns属性の指定なしにW3C Markup Validatorが通ってしまうとは思わなかった。マジでびびった。(XHTML 1.0ではある方が正しい。HTMLでは存在しない。)
お礼
あ！クラス名に・・ってことですね。 読み間違いで table に class を使うことが・・と思ってました。 とあるレンタル掲示板がこういう風に使っていたので、その癖でこう使ってました。 言われてみればそうですね。再度のご回答に感謝いたします。ありがとうございました。
- himajin100000
- ベストアンサー率54% (1660/3060)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <!-- 間違えたんで修正。名前空間接頭辞の宣言を追加。W3C Markup Validatorの野郎が通しやがったので大丈夫だと思ってた --> <head> <style type="text/css"> table.kiji_table { background-image: url("/img/kabe/beach.jpg"); border-top-width: 5px; border-top-color: brown; border-style:solid; /* ここを追加した */ } /* 括弧の種類が違う */ /* 念のために言っておくが，tr,th,tdに対しては指定していないので 各セルの罫線は表示されない */ </style> <title>実験</title> </head> <body> <!--個人的にはtableってのがクラス名に入るのって隙じゃないんだよね --> <table class="kiji_table"> <caption></caption> <thead> <tr><th>項目名</th><th>値</th></tr> </thead> <tbody> <tr><td>名前</td><td>キジ</td></tr> <tr><td>種別</td><td>鳥</td></tr> </tbody> </table> </body> </html>
お礼
style がないとダメなのですね。たしかに出てきました。 勉強不足でした、申し訳ありません。 ちなみに「tableってのがクラス名に入るのって・・」というのは、何かあるのですか？ これはお暇な時でかまいません。ありがとうございました。