- ベストアンサー
スタイルシート（CSS）の質問です
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
ごちゃごちゃ説明するよりこのサイトのほうが参考になりそうなんでごらん下さい。
関連するQ&A
- スタイルシートテーブルの罫線を細くしたい
例えば以下のように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サービス）
- スタイルシートの適応のやり方
現在ドリームウェーバーでHPを作っていますが CSSを使いメニューボタンをへこむボタンにしたいのですが うまく反映されません。 ソフトが最近から使い始めたのでうまく理解できていないところです。 a.sample{ text-decoration:none; } a:hover.sample{ color:#CC0000; border-width:0px 1px 1px 0px; border-style:solid; border-color:#990000; position:relative; top:-2px; left:-2px; } a:active.sample {/*クリック中の色*/ color:#CC0000; border-width:1px 0px 0px 1px; border-style:solid; border-color:#990000; position:relative; top:2px; left:2px; padding-left:3px; } こちらです。 手順を教えて頂けないでしょうか？
- ベストアンサー
- HTML
- CSSで枠線の太さを変えるとき
CSSでlistタグを使ってナビゲーションを作る練習をしています。 CSSで以下のように書いた場合、a:hover時の動作として、上の枠線のみが１pxから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
- スタイルシートを使い<h1>で指定するには？
スタイルシートを活用して <p style="border-style: solid; border-color: green; border-width: 1px 4px; padding: 3px;"> ぼけぼけ </p> という枠を<h1>ぼけぼけ</h1>と指定しただけで表示させるにはどのようにスタイルシートを記述すればいいのでしょうか？
- ベストアンサー
- HTML
- スタイルシートのwidthについて
<style type="text/css"> #hoge{border:solid 1px black;width:100px;margin:0;} </style> <div id="hoge> </div> このようにdivタグにスタイルシートをつけるとなぜか縦の幅ができてしまいます。 width:100をなくせばただの線になるのですがwidthをつけるとどうして 縦幅ができてしまうのでしょうか？ hightをつけてるのはまだしもwidthをつけただけじゃ横の長さが決まるだけで縦は0だと思ったのですが違うのでしょうか？ ブラウザはIE6で見ました。
- ベストアンサー
- HTML
- 外部スタイルシートが読み込めない
こんにちは。 外部スタイルシートが読み込めず 困っています。 HTMLは、 <html> <head> <link rel="stylesheet" href="controlbox2.css" type="text/css"> </head> <body> <div class="modal">syun</div> </body> </html> controlbox2.cssは .modal{ background-color:#fff; padding:10px; border:1px solid #333; } だけです。 もちろん同じディレクトリで あり何度も確認しています。 ブラウザは、IE7です。 ヘッダー部分に スタイルシートを書くと 当然効果があります。 <head> <style type="text/css"> .modal{ background-color:#fff; padding:10px; border:1px solid #333; } </style> </head> 文字コードは、ともに SHIFT_JISで保存しています。 何が悪いのか、 全くわかりません。 何か分かる人がいましたら、 よろしくお願いします。
- ベストアンサー
- HTML
- スタイルシートのセレクターについて
御世話になります。 ネットからダウンロードした、オブジェクト指向PHPの教本の中に、下に挙げるスタイルの記述があります。これはGoogleなどで検索した時に使われているようなページナビゲイターを作ろうとしている部分でのスタイルの記述すが、最初の " .navigator a " というセレクターの意味がわかりません。 .navigator a, span.inactive{ margin-left:0px; border-top:1px solid #999999; border-left:1px solid #999999; border-right:1px solid #000000; border-bottom:1px solid #000000; padding: 0px 5px 2px 5px; } コンマの後の "span.inactive" は inactive というクラス名を持った<span> エレメントだとわかりますが、" .navigator a "は navigator というクラス名を持った<a> エレメントではないですよね？ W3School の CSS レファランスなども調べましたが, クラス名の後にスペースがあって、その後に<a> エレメントがあるような組み合わせはみつけられませんでした。 このセレクターの意味を教えていただきたく、よろしくお願いいたします。
- ベストアンサー
- HTML
- 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)各文字列や値の前後にスペースを入れる理由を教えてください。
- ベストアンサー
- ホームページ作成ソフト
- style.css 反映されない
WORDPRESSを使ってホームページを作成中です。 使っているPCはMAC OS 10.5.8です。 素人のためwordpressレッスンブックという本を読みながら進めています。 index.phpとstyle.cssでHPを作成しています。 index.phpで記入したものは、サイトを表示すると反映されているのですが、style.cssで指定、または記入したものが急に反映されなくなりました。 今まではそんなことはなく、順調にすすんでいたんですが、今日の作業中に突然style.cssで記入したものが反映されなくなりました。 （例１） *RSSフィードへのリンクの文字のデザインを指定する。 *画像の中央に文字をそろえて表示する。 *RSSフィードへのリンクを枠で囲んで表示する。 ↑ これらを実行したくて、 style.cssに下記のように入力しましました。 /* フィード */ p.feed {font-size: 0.75em; font-family: Verdana, Helvetica, sans-serif; border: solid 1px #8cc63f; padding: 5px; margin: 25px 0} p.feed a {color: #444444; text-decoration: none} p.feed img {vertical-align: middle; margin-right: 8px} しかし、全く反応しませんでした。 どうしたらよいですか？ 教えてください。
- 締切済み
- HTML
- cssの書き方について
始めましてpcckitと申します。cssには全くの初心者ですがよろしくお願いします。メモ帳でcssで構成したホームページを作成しようと考えております。そこでまずは下記のように記述をしました。 body {background-color: #87ceed; text-align: center} div#border {border-style: solid; border-width: 2px; padding: 20px; background-color: #ffffff; width: 700px} 上記のようにしたところ、画面に枠が出来て、その枠の中に740×458 の画像を入れて確認をしたところ、枠からはみ出してしまいました。 やはりこれは、width: 700px}にしているからでしょうか？ 上記の状態でＩＥでは正常に表示されるのですがFire foxで見ると やはり画像が枠からはみ出していたり、枠そのものが左に寄ったりしています。 また、枠の中に文字や画像を入れて中央ぞろえや、両端ぞろえなどしたいのですが、うまく行きません。ご指導の程よろしくお願いします。
- ベストアンサー
- その他（プログラミング・開発）
お礼
お礼が遅くなりまして申し訳ありませんでした。 参考サイトを見て参考にします。 ありがとうございました。