• ベストアンサー

テーブルのボーダーを下線のみ表示

Dreamweaber8を使っています。 タイトル通り、テーブルのボーダーを 下線のみ色を付けて表示する方法はありますか? 過去の質問等も見ましたが、解決しませんでした。 わかる方いらっしゃいましたらお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

テーブルは基本的には枠全体の指示しかできなかったと思います。 下のみ上のみというのはなかったと思うので、 この場合はCSSを組み合わせてboreder-bottom:1px solid #colorなんかで下線が表示されるようにするのが 一番簡単かもしれません。

kii_123
質問者

お礼

早速の回答ありがとうございます。 簡単にできました。 もうひとつ質問なのですが、 たとえば5行あるテーブルのそれぞれ1行づつの下線 (5本線を引く)というのはできないでしょうか? table tr でcssやってみましたができませんでした。 テーブルを1行づつにするしかないでしょうか?

その他の回答 (2)

  • vista2446
  • ベストアンサー率46% (131/279)
回答No.3

CSSで指定しましょう。 border-bottomをtdに指定すればよろしいかと。。。 1行のセルが複数であった場合、セルの下線が境界で切れていまいますので、tableに「境界線を重ねる」指定をしてください。

回答No.2

Dreamweaber8を使っているのですから thのCSS定義ルールの ボーダー カテゴリで指示したらどうでしょう スタイル 幅 カラー の全てのチェックを外して 上だけを設定すれば出来ると思います

関連するQ&A

  • Table のボーダーを非表示にしたいのですが。。。

    Table のボーダーを非表示にしたいのですが、 上手くいきません。 <Table border="0"> or <table> 上記の条件でも、 ボーダーが表示されてしまいます。 IEでの表示を想定しています。 ご存知の方いらっしゃいましたら、よろしくお願い致します。

    • ベストアンサー
    • HTML
  • CSSでテーブルボーダーを表示させたいのですが・・

    スタイルシートを使用したテーブルのボーダー表示について質問です。 スタイルシートで下記テーブルボーダー表示設定をしたところ、 IEでは表示されるのですが、Netscape7.0ではボーダーが全く表示されません。 table.01 {FONT-SIZE: 12px; border-collapse : collapse ; border-width : 1px 0 0 1px ; border-style : solid ; border-color : #37503D ; background-color:#FAFFFB;} table.01 td {border-width : 0 1px 1px 0 ; border-style : solid ; padding : 5px ; line-height:120%;} 現在調べているところですが、お解りになるかたがいらっしゃれば是非教えていただけないでしょうか。 どうぞ宜しくお願い致します。

    • ベストアンサー
    • HTML
  • borderでa:hover下線表示させるとズレる

    underline では雰囲気に合わないため、border-bottomでホバー時のリンク下線を表示させています。具体的には以下のような感じです。 a {color: 青; text-decoration: none;} a:hover {color: 赤; text-decoration: none; border-bottom: dotted 1px 赤;} これでほとんど問題ないのですが、まれにホバー時にガタッと表示がズレることがあります。よく分からないのですが、ちいさなdiv要素を連続させている部分で起こるような気がします。リンクにマウスオーバーすると、続くdiv部分が下線分?下に動く感じです。 説明がうまくできているか分かりませんが、解決策があったら教えてください。ちいさなことですが、結構気になってしまいます。

    • ベストアンサー
    • HTML
  • borderの下線が表示されない

    手元にソースがないので、正確かわかりませんが・・・ 以下のように記述したとします。 <pre class="box"> hoge </pre> pre{ margin:10px; overflow:auto; } pre.box{ border:1px #000000 solid; backgroud-color:#eeeeee; } ・Firefoxにおいて この場合、枠線の下線だけが表示されない場合があります。 必ず発生するわけではなく、稀に発生します。 overflow:auto;の影響であることはわかっています。 これを設定しない場合はちゃんと表示されます。 このような現象は何が原因なのでしょうか? 正確なソースがないと何とも言えないでしょうが、何か情報はありませんか?

  • IE8・Firefoxで「border:dotted」を使って下線をひ

    IE8・Firefoxで「border:dotted」を使って下線をひくとうまく表示されません。 IE7では正常に下線がひかれるのですが、IE8やFirefoxでは「間隔の広いドット線で」対象が「上下左右囲われて」しまいます。 CSSの記述は以下のようにし、htmlで下線をひきたい対象を<div>で囲っています。  border-width:0px 0px 1px 0px;  border: dotted gray; できればどのブラウザでも極力同じ見え方にしたいのですが、可能でしょうか? ご存知の方、ご教授の程よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • ワードで下線を引き、下線の右端下に(1)を表示する方法

    こんばんは。 質問があり投稿させて頂きました。 タイトル通りなのですが、方法をご存知の方がいらっしゃいましたら、ご指導願います。 ルビ利用して文字の(1)を入れることは出来たのですが、文字に下線を引くとルビの文字にも下線が入ってしまい思うように出来ないのが現状です。 尚、Word2002を利用しております。 恐れ入りますが、宜しくお願い致します。

  • TBテーブルの表示位置

    テーブルを作成し、テーブル自体は思い通り表示されたのですが、テーブルが表示されるのがページのかなり下のほうなのです。 文字列のすぐ下に表示したいのですが、どうしても表示できません。 文字列のすぐ下に表示する方法をご教授下さい。 <HTML> <HEAD> <TITLE>タイトル</TITLE> </HEAD> <BODY>  <CENTER>  <H1>文字列</H1>  <TABLE BORDER>   <TR>・・・・・(テーブルの中身)</TR>  </TABLE>  </CENTER> </BODY> </HTML>

    • ベストアンサー
    • HTML
  • html上でのtableのborder指定

    htmlにstyleを用いてtableのborderを適用させる方法を教えて下さい。 cssが使えないのでhtmlに指定させたときに、各セルごとだけにボーダーを適用させる方法はありませんか? 各セルの個数がバラバラなので、tableに指定すると、大きい外枠にborderが付いてしまいます。 画像のような形にしたいのですが、教えて下さい。

    • ベストアンサー
    • HTML
  • (dreamweaver) テーブルのボーダーについて

    読みずらい文かもしれませんが、よろしくお願いします。 windowsとmacでのブラウザ表示の違いに困っています。 アルバムのようなページを作っていますが、テーブルのボーダーを2p、色を白(背景も白)にしてボックス内には画像を入れています。 windowsでは横に並んだ画像達の間が2pずつ余白になっていて、自分の作りたい様に表示されるのですが、macのsafari等では白ではなく灰色ちなみにか黒の線が入ってしまっています。 CSSやプロパティで調整しても解消されずに困っています。 macでもwindowsのような表示にするためにはどのようにしたらよろしいのでしょうか? ※dreamweaverCS3を使っています。 CSSで調整といってもボーダーのカテゴリを調整することしか浮かびませんでした。 どうぞよろしくお願いいたします。

  • borderが1のテーブル

    ボーダーが1ピクセルくらいの表を作りたいので、tableの入れ子で作ったのですが「tableの入れ子は良くない」ととあるサイトで読んだので、入れ子にしないでtableを作りたいのですが何か良い方法はありますでしょうか? 私が書いたのはこんなかんじです。 <table width="400" border="0" cellpadding="0" cellspacing="0"> <tr> <td bgcolor="#000000"><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="1"> <tr bgcolor="#999999"> <th><div align="center"><font size="2">名称</font></div></th> <th><div align="center"><font size="2">模型材質</font></div></th> <th><div align="center"><font size="2">生産材質</font></div></th> </tr> <tr bgcolor="#FFFFFF"> <td bgcolor="#999999"><div align="center"><font size="2">本体</font></div></td> <td><div align="center"><font size="2">発泡塩ビ板</font></div></td> <td><div align="center"><font size="2">プラスチック</font></div></td> </tr> </table></td> </tr> </table> CSSで「style="border-width :1px 1px 1px 1px;border-style : solid solid solid solid ;border-color :#000000 #000000 #000000 #000000 ;"」というのを入れてやってみたのですが、これだと外側にしかラインが表示されませんでした。 よろしくおねがいします。

専門家に質問してみよう