• 締切済み

css の「border」に関して

CSSの「枠線の幅」と「枠線の太さ」について教えてください。 「枠線の幅」も「枠線の太さ」とも、設定は『border:width』となるようですが、どのような使い分け方をするのでしょうか?

みんなの回答

  • appano
  • ベストアンサー率38% (87/225)
回答No.2

「枠線の幅」と「枠線の太さ」の違いがはっきりわかりませんが、 border-widthは「枠線の太さ」です。 「枠線の幅」はmarginやpaddingで調整します。 最近CSS書いてないので、うろ覚えですが^^;

newnewpc
質問者

お礼

ありがとうございました。 お礼が遅くなりましてすみません。 <border-width>は「枠線の太さ」であり、何らかのセレクタの幅を設定する場合は、単に<width>で設定するようですね。

  • salonpath
  • ベストアンサー率48% (194/399)
回答No.1

border:widthなんてありませんよ

関連するQ&A

  • cssを使った枠線の表示について

    css初心者です。宜しくお願いします。 タグ打ちしたHTMLファイルとcssファイルがあります。 cssファイルに「.waku {BORDER-WIDTH:5px;BORDER-COLOR:#FFFFFF;BORDER-STYLE:SOLID}」と記述し、 HTMLに「<P CLASS=waku>適当な文字列</P>」としました。 この、「適当な文字列」の周りに5pxの白い枠線が表示されたところまではうまくいったのですが、画面の左右いっぱいまで枠線が延びています。 (1)文字列の幅に合わせて、自動的に枠の幅を変えるにはどうすればいいのでしょうか? (2)この枠の幅を「画面の50%」あるいは「500px」などと指定することは可能でしょうか? (3)文字列と枠線との間隔を調整することは可能でしょうか? 余談ですが、cssの記述の際、スペースを多様している例をよく見かけます。 冒頭での私の書き方でも正常に動作しているようですが、「.waku { BORDER-WIDTH : 5px ; BORDER-COLOR : #FFFFFF ; BORDER-STYLE : SOLID }」このように (4)各文字列や値の前後にスペースを入れる理由を教えてください。

  • CSSでテーブルボーダーを一発指定出来ません!

    現在テーブルに対してのCSSを設定しているのですが、私の勘違いなのかうまく出来ません・・・。 例えば縦5×横5列の表が有ったとします。 そこにCSSで四方1pxのボーダーを指定します。 でも、これだけだと表の一番外枠部分にしかボーダーが表示されません・・・。(当然なのかもしれませんが) そこで、CSSを使い中のブロック?部分、<td>全てにボーダーを表示させたいのですが、そのようなことは可能なのでしょうか? ようは、表の枠線全てをcssで表示させたいのですが、この様な事は可能でしょうか?? ご存知の方がいましたら、アドバイスいただけますでしょうか? 宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • CSSでボックスにborderをつけたが、画面からずらすと線が消える?

    CSSで border-style:solid; のように、ボックスの枠線をつけたのですが、スクロールして、出来た枠線を一度画面から見えないようにして、すぐ戻す(枠線が見える部分にスクロールする)と、枠線が消えてしまうのですが、何か解決策はあるでしょうか? よろしくお願いします。

  • CSSで枠線の太さを変えるとき

    CSSでlistタグを使ってナビゲーションを作る練習をしています。 CSSで以下のように書いた場合、a:hover時の動作として、上の枠線のみが1pxから5pxに変わります。しかし、この方法だと、【上の枠線の下】が5pxとなり、その分、入力してある文字が下にずれます。 そこで、ずれないように、【上の枠線の上】に5px増やすにはどうすればいいでしょうか。 あるいは、そのように見せるための方法がありますか。画像は使用しないで作りたいです。 よろしくお願いします(CSSは初心者程度のレベルです)。 ================================================== ul{ list-style-type:none; } a{ text-decoration:none; } li a{ border-top-style:solid; border-right-style:solid; border-bottom-style:solid; border-left-style:solid; border-top-width:1px; border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-top-color:red; border-right-color:green; border-bottom-color:green; border-left-color:green; width:8em; } li a:hover{ border-top-style:solid; border-right-style:solid; border-bottom-style:solid; border-left-style:solid; border-top-width:5px; border-right-width:1px; border-bottom-width:1px; border-left-width:1px; border-top-color:red; border-right-color:green; border-bottom-color:green; border-left-color:green; width:8em; } ==================================================

    • ベストアンサー
    • CSS
  • テキストをボーダーで囲むCSS

    CSSを本を見ながらやっていますが、 下記の例文でテキストをボーダーで囲むものをやってみました。 この中で、 margin-left:100px; margin-right:100px; というころですが、これはブラウザに対しての両サイド空きを意味していると思うのですが、逆に囲んでいる幅のほうを指定するにはどうしたらよいのでしょうか。 または、そのようなことはできないのでしょうか。 <STYLE TYPE="text/css"> <!-- P.text {text-align:justify; text-justify:distribute; line-height:154%; margin-left:100px; margin-right:100px; border-style:solid; border-width:2px; border-color:#dd8888; padding:10px} --></STYLE> *****HTML <P CLASS="text"> テーブルみたいになるテキスト</P>

    • ベストアンサー
    • HTML
  • ホームページ 点線の入った表の書き方(CSSを使って)

    表を作っています。 何度もチャレンジしながらやりましたが・・ギブアップ・・・分かりません。。わかる方がいらっしゃったら教えてください。 http://hw001.gate01.com/with-flower/tesuto/article04.html (1)1つの枠の中(物件)で区切りに点線を入れたいのですが、どのようにしたらいいでしょうか? (2)上下に重なった枠線を片方だけにできないでしょうか? または改行を入れようと思ったのですが、間隔が広すぎておかしくなります。改行幅の指定はできるのでしょうか? ↓CSS .solid {border-width:1px; border-style:solid; border-color:#330000;} .dashed {border-width:1px; border-style:dashed; border-color:#cccccc;}

  • FireFoxでCSSのボーダーが反映されません

    FireFoxでのCSS表示について教えて下さい。 現在、IEでは見れるものがFireFoxで反映されておりません。 どこかに原因があるとは思うのですが、見つからないのです。。。涙 Bodyとページ全体のCSS、及び問題箇所のCSSを記述します。 #body { margin: 0px;  width: 100%;  padding: 0px;  border: 0px;  height: auto;} #page { background-color: #ffffff;  width: 746px;  height: auto;  margin: 0px;  padding: 0px;  border-collapse:collapse;  border: 0px;  border-spacing:0px;} #page td {line-height: 120%;  font-size: 12px;  color: #000000;} #contents1 {width: 746px;  border-collapse:collapse;  border-spacing:0px;  margin:0px 0px 5px 0px;}  border: 1px solid #666633; #contents td {font-size: 12px;  line-height: 120%;  color: #000000;  padding-top: 2px;  padding-bottom: 2px;} #contents2 {width: 350px;  height: 45px;} #contents2 td { border: 1px solid #999999;  font-size: 12px;} ※contents1は外枠のみボーダーカラーをつけたいと思います。 contents2では、tdのみ枠をつけて、外枠は表示させたくありません。 (大枠の中にいくつか枠付きの行が表示される状態にしたいです) idではなくclassにする方が良いのでしょうか? CSSについては独学なので、記述もほとんどDW頼りです。 参考サイトなどご存知でしたら教えて下さい。。。 以上、よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • NN使用でのCSSでのBORDERについて

    IEで TD.TD1{BORDER-STYLE:SOLID; BORDER-COLOR:CORNFLOWERBLUE; BORDER-WIDTH:1; BACKGROUND-COLOR:ALICEBLUE;} のように指定すれば、細い線で囲まれたものをかくことができますが、NNでは、背景色は有効になっても線が出てきません。 これを有効にするにはどのようにしたらいいのでしょうか? また、IE・NNで表示結果が違うCSSの一覧などが載ってるような便利なサイトがもしあったら教えてください。

    • ベストアンサー
    • CSS
  • テーブルのボーダー(枠線)は何で指定したらいいですか?

    テーブルの枠線の指定の仕方について質問です。 HTMLだけで指定するのであれば、 <table border="1"> ~~ </table> といった感じなのでしょうが、CSSも併用している場合、CSSで td{border:solid;] とし、HTMLでは <table> ~~ </table> という風に簡単(?)に書いたほうがいいんでしょうか? なんでも見た目はCSSで定義しろとのことですし、テーブルの枠線ってHTMLとCSSとどっちで定義するのがいいんでしょうか? 分かりにくい質問で申し訳ありません。初心者のため書き足りないところあるかもしれませんが、よろしくお願いします。

    • ベストアンサー
    • HTML
  • cssでボーダーを消したい

    こんにちは。 CSSのことで質問させてください。 リンクした文字色、ボーダーなどが出ないようにしたいのですが、 一部分、Firefoxで見ると、 文字色が紫で、ボーダーがでます。 *{ margin: 0; padding: 0; font-size: 100%; list-style: none; } と、リセットしています。 一部分の<ul>だけに効いていません。 どのようなことが原因として考えられるでしょうか。 どなたかよろしくお願いいたします。

    • ベストアンサー
    • HTML

専門家に質問してみよう