- ベストアンサー
CSSで左右の背景が異なる設定方法
添付している画像のように左右の背景が異なるCSSを作成したいのですが、 下記のサイト等を参考にしましたが、FFとOperaのみ表示され、 GoogleChromeやIEその他のブラウザでは表示されません。 http://www.webopixel.net/javascript/517.html お分かりになる方どうぞご教授ください。 よろしくお願いします。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (2)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
- play_with_you
- ベストアンサー率37% (112/301)
関連するQ&A
- CSSで左右の背景色を指定したい
CSSでページを作成しているのですが、左右の背景色をかえたページにしたいと思ってます。 そこでCSSで指定した範囲に左右に別々のIDを指定しているのですが、この場合要素の部分のみしかCSSでしていしたbackground-cplorが表示されません。 heightで指定してもいいのですが、 要素が延びる可能性もあるので表示幅に合わせて背景を表示させるのはどう指定したらよいでしょうか?
- 締切済み
- CSS
- CSSでよく作られる背景の作り方を教えてください。
お世話になります。CSS初心者の者です。 もしかしたら基本的な質問だと思いますが初心者の私には分からなかったのでどうか詳しい方教えてください。 現在ウェブサイトを作成しているのですがいろんなサイトでよく見るような中央揃えで伝えたい情報を載せて、左右には背景色なり背景画像なりが表示されるような背景はどうやって作るのですか? 調べたところCSSを使っているというのは分かったのですが肝心のCSSソースというものが分かりませんでした。 疑問になっているのは ・ブラウザサイズに関係なく中央にメインの情報ページを置くにはどうしたらいいのか? ・中央部分の両端にドロップシャドウのような効果を出すには? といったようなことです。 参考までにこういうような効果を出したいというサイトを載せておきます。正直困っています、どうかよろしくお願いします。 http://www.msgallery.jp/ http://www.uc-company.co.jp/ http://www.nkk-sys.com/index.html
- ベストアンサー
- その他(インターネット・Webサービス)
- cssの今、一番旬なブラウザごとに違うcssをかける方法
現在4つのブラウザでほぼ同じような動作・見栄えをするサイトを制作しております。 4つのブラウザとは(opera ie6 ie7 firefox)です。 そこで、現在、ie6だけで生じる表示崩れがあり、 そのcssの解決方法も発見したのですが、 それを解決すると今度は逆に、opera,ie7,firefoxでエラーが起きてしまいます。 読み込んでいるのは、一つの外部cssファイル、main.cssです。 現在考えられる解決方法としては、 1.ie6だけにcssを掛けるハック? この場合、どのようにハックをかければいいのでしょうか。 色々しらべましたが、スターハックなど、現在使って良いハックというのは何になるのでしょうか。 具体的なcssコードは、以下です。 #pull a:hover{ display:block; /*以下ie6だけに指示したい命令 現状コメントアウトしています*/ /*margin-bottom:-20px;*/ } 2.ie6だけ別の外部cssファイルを読み込ませる。 ブラウザ毎に違うcssファイルを読み込ませることってできるのでしょうか。 (javascriptで判別するのでしょうか?) ie6 なら、main_ie6.cssを読み込み、 それ以外のブラウザなら main.cssを読み込ませる 一番ベストな方法を教えていただければと思います。
- ベストアンサー
- HTML
- 背景画像を、flashを使わずウィンドウの可変に対して拡大縮小か、CSSなどでグラデーションを中央から外側にかける方法
作りたいと思っているサイトの背景設定に関していくつか質問です。 <作りたい背景画像について> 中央から四方外側に向かってグラデーションがかかっている背景画像 (添付画像参照) <サイトデザインに関して> ウィンドウいっぱいに背景画像を表示し、ユーザーの可変に対して背景画像が縮小拡大できる flashは使いたくない。 <わからなくて困っている事> (1) 背景画像をリサイズする方法として下記のサイト↓があり、 この方法で背景画像を設定してみました。 http://www.webbibo.com/stylesheet/image/bg_dimension.html しかし、IE6以上で見るとウィンドウの右側と下部に背景が足りておらず、 ウィンドウいっぱいに背景画像を見せる事ができません。 いろいろ調べてみたのですが、IE対策方法がわかりません。 IEではこのリサイズ方法で完全に背景画像をウィンドウいっぱいに表示させる事は不可能なんでしょうか? 可能ならば、設定方法はどうすればようのでしょうか? (2) (1)の解決案として、 IEの場合のみ背景画像のグラデーションを諦めて単色カラー表示し、 その他のブラウザで上記サイトの方法を使用して背景画像をみせると言う方法を考えています。 しかし、設定の仕方がわからず、途方に暮れています。 (3) (1)のリサイズ方法を使わなくても、添付した画像のような背景のグラデーションを背景として見せる事は可能でしょうか? 可能ならば、どういう方法があるんでしょうか? 背景のグラデーション表示方法に関してCSSなどでグラデーションを作る方法がありますが、上下や、左右方向などのグラデーション表示方法はありましたが、中央から四方外側の方向の設定方法がわかりませんでした。 自力で色々調べていたんですが力足らず、質問させていただきました。 宜しくお願いします。
- ベストアンサー
- HTML
- cssで背景画像が貼れない
background-image: url(××.gif) cssで背景画像を表示させたいのですがこのタグだとどうしても 表示されません。 画像は同じフォルダにあります。 どなたかご教授願えませんでしょうか お願いします。
- 締切済み
- HTML
- IE6でCSSに指定したpngの背景画像を表示する
こちらのサイトhttp://bokoro.com/は、背景画像の多くがpng画像となっていますが、 IE6でも同じように表示されています。 javascriptでIE6でもpng画像がうまく表示されるように制御しているのかと思いましたが、 そのような記述は見当たりませんでした。 いったいどうやってIE6でもきれいに表示させているのでしょうか? わかる方、ご教授ください。 宜しくお願いします。
- ベストアンサー
- HTML
- JavaScriptからCSSを呼び出す方法
現在、Noscript時とJavaScript稼働時の呼び出すCSSを分けるため、下記のような設定をしています。whole.cssからJavaScript稼働時のCSSをimportしています。 IE6エラー内容は「'framename' が宣言されていません」です。 記述 <link href="whole.css" rel="stylesheet" type="text/css" id="css"/> <script> framename.document.getElementById ('css').href = 'whole.css'; </script> JavaScript稼働時に呼び込む設定となっています。 IE6のエラー以外他ブラウザーは正常に表示されます。 よろしくお願いします。
- 締切済み
- JavaScript
- WindowsのFirefoxでの背景画像の表示(CSS)
WindowsのFirefox(Ver.2.0.0.12)での背景画像の表示について質問です。 下記の様なCSSで、下寄せでX方向に画像を並べ、グラデーションで背景色と馴染むようなデザインにしたいのですが、背景色しか表示されません。 他のブラウザでは上手くいくのですが、原因がわかりません。 Dreamweaverで作っております。 body { background-image: url(img/site/bg.jpg); background-repeat: repeat-x; background-position:bottom; background-color: #826243; } どなたかご教授いただけませんでしょうか。 宜しくお願いいたします。
- ベストアンサー
- CSS
- CSS dlタグの背景色についての質問です
cssで<dl>全体に背景色を指定しているのですが、firefoxとIE8は背景色がつきません。 IE6とIE7は背景色はつきましたが・・・ どうしたらどのブラウザでも<dl>全体に背景色をつけることができるのでしょうか? どなたか教えていただけますでしょうか? よろしくお願い致しますm(_ _)m
- ベストアンサー
- CSS
- 背景画像表示について
CSSでbodyの中にbackground-image で背景を設定したのですが IE以外ではうつっていませんでした。 なので <div style="width : 1300px; height : 1000px; top : 1px; left : 2px;position : absolute; background-image: url(****.gif); z-index: 1; visibility : visible; " id="pagebody"> としてみましたらIEとGooglechromeはうつるようになりました。が、 firefoxではうつりませんでした。ここで疑問に思ったのが 基本なはずの背景画像にブラウザによって表示が異なるのか、と。 本を読んでもインターネットで調べてもそんなことはないとかいてありました。 僕の記述が間違っているとしか考えられません。 正しい記述を教えてください。 ちなみにCSSは外部内部両方ためしました。 htmlでbodyに背景指定もやってみました。でもやっぱりIEしかうつりませんでした
- ベストアンサー
- HTML
- ROLAND SP-404 MK IIの購入を検討しています。外国の友人も使用するため、言語を英語に選択できるかどうか教えてください。
- ROLAND SP-404 MK IIは、外国の友人が使用することも考慮して購入を検討しています。言語の設定について詳細を教えてください。
- ROLAND SP-404 MK IIの購入を検討していますが、外国の友人も使用するため、英語の設定が可能かどうか気になっています。
お礼
HTML5バージョンまでご教授頂き本当にありがとうございます。 上記のソースを参考にサイトを作成させていただきます。 もっともっと勉強が必要だと痛感しました。 本当にありがとうございました!