- ベストアンサー
borderの太さを１px以下に見せる方法ありますか？
kyofu-chanの回答
- kyofu-chan
- ベストアンサー率23% (109/464)
> １px以下 これには 1 画素も含まれるので、1 画素にはできます。しかし、1 画素よりも小さくすることはできません。 例に出されたページにも 1 画素未満のオブジェクトは存在しません。
関連するQ&A
- 特定のテーブルにだけ任意の書式を適用するHTMLかCSS
特定のテーブルにだけ任意の書式を適用するHTMLかCSS 以下のHTMLテーブルで、入れ子テーブル（区画１～区画４）には罫線なし、 外枠（田の字）だけ、1pxの黒い罫線を引くにはどういうのが効率いいですか？ 【解決案１】こうすると、入れ子テーブル（区画１～区画４）まで罫線が現れてしまいます。 table,td,th {border-collapse: collapse; border: 1px solid #000;} 【解決案２】こうすると、該当する全ての<td>タグを<td class="tdstyle">と仕込むのも面倒です。 table {border-collapse: collapse; border: 1px solid #000;} .tdstyle {border: 1px solid #000;} 【解決案３】外枠（田の字）だけ、以下のようにしたいですが、bordercolorってIEのみ有効なタグですよね？ <table border="1" style="border-collapse: collapse" bordercolor="#111111"> 外枠（田の字）だけに、IDをつけたり識別して、効率よく処理できませんか？ <html> <head> <style TYPE="text/css"> <!-- --> </style> </head> <body> <table cellpadding=10> <tr> <td> <table cellpadding=10><tr><td>区画１</td></tr></table> </td> <td> <table cellpadding=10><tr><td>区画２</td></tr></table> </td> </tr> <tr> <td> <table cellpadding=10><tr><td>区画３</td></tr></table> </td> <td> <table cellpadding=10><tr><td>区画４</td></tr></table> </td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
- テーブルの枠線（外内両方）をすべて同じ太さ(1px)にしたい
はじめまして。 cssから初めて、いま初めてテーブルタグを触っているのですが・・・ おそらくとても初心者なことだと思うのですが、tableタグの枠線の太さを揃える方法がわかりません・・・ <table ～>で直接HTMLで指定すると重なり合う2つのborderのおかげで2px分のテーブルが表示されます。 これを1px分だけの細い（ここのサイトもそうだと思います。）テーブルを作りたいのですが、こちらはCSSでそれぞれのセルに対してこのセルはbottomだけ、このセルはleftだけ、というように指定していかなければいけないのでしょうか？ テーブル自体ほとんど触ったことはないのですが、なぜか余計にややこしいことをしているような気がして質問させていただきました。 どうかよろしくお願致します。
- ベストアンサー
- HTML
- スタイルシートテーブルの罫線を細くしたい
例えば以下のようにHTMLを書いた場合、 tableとtdのスタイルシート指定により、 外枠と内枠で罫線がかさなり、 若干太くなってしまいます。 細くしたいのですが、どうすれば出来るのでしょうか？ <table style="{border:1px solid #000000;border-spacing:0px}"> <tr> <td style="{border:1px solid #000000;padding:0px}">あああ </td> <td style="{border:1px solid #000000;padding:0px}">いいい </td> </tr> </table>
- ベストアンサー
- その他（インターネット・Webサービス）
- CSS スタイルを子要素の子要素に継承させたくない
スタイルシートについてまだ初心者なため質問させてください。 以下のようにテーブルのボーダーのスタイルを子要素（<table><td>）にスタイルを継承（？）させているのですが、この方法だと子要素の子要素（<table><td><table><td>）に対しても継承されてしまいます。 table.border { border-style:solid; border-width: 1px 1px 1px 1px; border-collapse: collapse; } table.border td { border-style:solid; border-width: 1px 1px 1px 1px; } table.border > td {…} という指定の方法もあるようですが、こちらは対応しているブラウザが乏しいようで事実上使用できません。 子要素の子要素に対して以下のクラスを指定しても継承が優先されるためか反映されませんでした。 table.none { border-style:none; } table.none td { border-style:none; } HTMLタグに直接以下のように指定しても同様でした。 <table style="border-style:solid;"> どこかのサイトでは継承をリセットする必要があるような事が書いてあったような気がします。 もちろん継承を利用せず<table>および<td>個々にクラスを指定すれば（不必要なタグには指定しなければ）可能だと思いますが、これだと大きなテーブルの場合に非効率で悩んでいます。 どのようにすれば子要素の子要素にスタイルを継承させないようにできるでしょうか？
- ベストアンサー
- CSS
- CSSの入力方法について教えてください
CSSの入力方法について教えてください 私はプラグインを使用してtableを制作したのですがHTMLコードの最上段に下記のような表示がされてありました。 全体の指示がされてあると思うのですが、自分なりにCSSで入力してもうまく表示できないでいます。すみませんがおわかりの方がおられましたら教えていただければと思います。どうぞよろしくお願いいたします。 <table class="aligncenter" style="border-color: #2d89ef; background-color: #ffffff;" border="2px" cellpadding="10px"> 補足補足させていただきます 私はHTMLに CSSを直接記述する方法で<style type="text/css">の下に下記のように入力しました。 ■ここから下が自分が入力してみたCSSの記入ヶ所です .whole{ align: center; border-color: #2d89ef; background-color: #ffffff; border: 2px; cellpadding: 10px; } ■HTMLの一番上に下記のように入力しました <table class="whole"> ■結果 自分が入力すると外枠の罫線の色と幅が反映されていません。 ■元のHTMLのcode <table class="aligncenter" style="border-color: #2d89ef; background-color: #ffffff;" border="2px" cellpadding="10px"> の時は希望通りに表示されていました 以上の点を参考にしていただければと思います。長い文章ですみませんがよろしくお願いいたします。
- ベストアンサー
- CSS
- CSSの設定方法について
CSSは外部ファイルにし、十数枚あるHTMLに「div id=contents内にあるTableは全て共通のレイアウト」 となるよう下記のCSSを設定しました。 --------CSS----------------------------------------- #contents{margin-left: 70px;} #contents table{width: 650px; border: solid 1px #B1B2B2; border-collapse: collapse; margin: 15px 0px;} #contents tr, td ,th{padding: 4px; border: solid 1px #B1B2B2; border-collapse: collapse;} --------HTML----------------------------------------- <div id="contents"> <table> <tr> <th>項目</th> </tr> <tr> <td>項目1</td> </tr> </table> </div> ------------------------------------------------------- しかし、どうしても違うレイアウトにしたいTableが出てきた為、下記CSSを追加、 HTMLは<div id="contents">の部分を<div id="login">に変更したのですが 追加CSSが反映されず、id=contentsの設定が残ったままになってしまいます。 色々いじってみたのですが、どこが間違っているのやら皆目見当がつきません。 --------追加CSS----------------------------------------- #login{text-align: center; } #login table{width: 450px; border: solid 2px #666666; border-collapse: collapse;} #login tr, td ,th{border: solid 1px #666666; border-collapse: collapse;} --------HTML----------------------------------------- <div id="login"> <table> <tr> <th>項目</th> </tr> <tr> <td>項目1</td> </tr> </table> </div> 拙い文章で恐縮ですが、ご助言いただけると大変助かります。 説明不足や意味不明箇所は補足させていただきますので、どうぞよろしくお願い致します。
- ベストアンサー
- HTML
- FireFoxとIEでの「border」の表示について
いつもお世話になっています。 HTMLタグの<TABLE>で表を作りborder=0を指定したところIEとFireFoxでは違う表示がされ困っています。 【IEの場合】 罫線が表示されなくなる 【FireFoxの場合】 外枠線は表示されず内側の線だけが表示される 上記の問題をFireFoxでも非表示にしたいのですがなにか良い方法はないでしょうか？ よろしくお願い致します。
- ベストアンサー
- ブラウザ
- ボーダーが反映されません
スタイルシートです。一部略しています。 table.kiji_table { background-image: url("/img/kabe/beach.jpg"); border-top-width: 5px; border-top-color: brown; ] これでテーブルに画像は現れますが、ボーダーが出てきません。 何故かおわかりでしょうか？
- ベストアンサー
- その他（プログラミング・開発）
- 記事本文のtableタグのみCSSを適用させる方法
基本的なことだと思うのですがブログ初心者のため質問させてください。 記事に表を入れたいのですが、デフォルトのままですと枠線(border)を最小の1にしても1pxの細い線になりません。そこでネットで調べて以下のものをCSSに追加しました。 table { border-collapse:collapse; } table td{ border:solid 1px; } 上記をCSSに追加すると表のborderが1本の細い線になりました。しかし記事本文以外のサイドバーやfooterなどのデザインまで影響を与えてしまいました。 そこでタイトルの通り、記事本文のtableタグのみ上記のCSSを適用させるにはどのように記載すればよいでしょうか? よくわかっていませんが、記事本文を表すHTMLはmain-bodyかmain-containerあたりだと思っています。 使用しているブログサービスはFC2ブログになります。 恐れ入りますが、よろしくお願いします。
- ベストアンサー
- HTML
- テーブルのボーダー（枠線）は何で指定したらいいですか？
テーブルの枠線の指定の仕方について質問です。 HTMLだけで指定するのであれば、 <table border="1"> ～～ </table> といった感じなのでしょうが、CSSも併用している場合、CSSで td{border:solid;] とし、HTMLでは <table> ～～ </table> という風に簡単（？）に書いたほうがいいんでしょうか？ なんでも見た目はCSSで定義しろとのことですし、テーブルの枠線ってHTMLとCSSとどっちで定義するのがいいんでしょうか？ 分かりにくい質問で申し訳ありません。初心者のため書き足りないところあるかもしれませんが、よろしくお願いします。
- ベストアンサー
- HTML
お礼
なるほど。。。 １画素とはピクセルより小さい単位なのでしょうか？ 無知で恥ずかしい限りです、 画素の事調べてみます！