- ベストアンサー
ＨＴＭＬとＣＳＳ 左右の端にカラーを入れたい
naokitaの回答
- naokita
- ベストアンサー率57% (1008/1745)
画像は、 http://tempnate.com/sozai_aroma/aroma_brown_txt/img/back.gif この画像をbodyに横リピートで表示させています。 つまり、 body { background: url(back.gif) repeat-x;} 何も難しい事はやっていません。初歩の方法ですよ。
関連するQ&A
- HP作成 HTML CSS 背景 重ね合わせ
HPを作成していて、わからないことがあります。 HP全体の背景を画像にし、bodyの部分の背景をさらに画像にして、画像を重ねた形でHPを作りたいと考えました。 htmlファイルを作成し、自分のPCからhtmlファイルをブラウザに開いたところ背景がしっかりと表示されました。 しかし、htmlファイルをアップロードし、HPを開いたところ、一番奥の背景の画像が反映されませんでした。 どうすれば反映されるのか教えていただきたいです。 CSSです。 html{ background-image:url(http://pomo.vis.ne.jp/bg/corkboard/bg_corkboard200_04.jpg); } * { padding : 0px ; margin : 0px ;} #my_body { margin: 5px auto; width : 900px ; background-image:url(http://hide.kanari.info/sozai/ico/memo001/kabe.gif); } #my_header { width : 100% ; height : 110px ; border-bottom : 2px solid #000000 ; padding-top:10px; } #my_navigation { float : left ; width :188px; height:1500px; border-left : 1px solid #000000; border-right : 1px solid #000000; } #my_contents { float : right ; width :709px; height:1500px; border-right : 1px solid #000000; } #my_footer { width : 100% ; clear : both ; border-top : 1px solid #000000; } html要素の中で、一番奥の背景を設定しています。 body要素の中に、二番目の背景を設定しています。 HTML要素の中に背景を設定すると適応されないのでしょうか？ アップロードして、背景を正しく表示される方法を教えてください。 HPのURLです。 http://10t4047f.web.fc2.com/ よろしくお願いいたします。
- 締切済み
- CSS
- ３カラム→２カラムになるhtml・cssの書き方
３カラム→２カラムになる、html・cssの書き方について、ご教授お願いします。 ブログで、左サイド（サブ）、センター（メイン）、右サイド（サブ）を制作しています。 トップページは３カラム校正。 詳細記事（２階層目）に入ると、右サイドはなくして、その分センターを右に伸ばしたいと思っています。 ※文章だとわかりづらいので、図にしてみました。 http://kiyu0228.web.fc2.com/sample.gif このように制作したい場合、html・cssをどのように書くのが最適でしょうか？ ちなみに、SEO対策のため、htmlでのdivの書き順は、 センター（メイン）→左サイド（サブ）→右サイド（サブ）で書き表したいです。 また、なるたけ右サイドをコメントオフ、または削除するだけで、反映される書き方が望ましいです。 いろいろと条件が多くて申し訳ござません…。 ご教授いただけると、幸いです。 どうぞよろしくお願いいたします。
- 締切済み
- CSS
- cssの幅の調整方法について
サンプルとして下のサイトを参考にしてるのですがサンプルの場合、左右の全面のグレーの幅が広いため、もう少し狭くしたいのですが どうしても左右に振り分けて幅を大きくする方法がわかりません？ イメージとしては全面のグレーの幅を両サイド共に２センチほどにしたいのです。 また、全面のグレーの幅を調整することで、それぞれの幅の微調整が必要な場合についても、よろしくお願いします。 http://www.htmq.com/csskihon/401.shtml cssに詳しい方、ご教授願います。
- 締切済み
- CSS
- フラッシュで作る地図
すみませんが、下記のアドレスのような地図をフラッシュで作りたいと思いますが、初心者でも分かりやすい、解説の載った本やサイトをご存知でしたら紹介していただけないでしょうか。 http://flash.xtaro.com/sozai/shops/sample1/map.htm
- ベストアンサー
- Flash
- ＣＳＳの編集の仕方がわかりません。
http://sozai.wdcro.com/sample/047/を元にしてホームページを作っていこうと思うのですが、書き方がよくわかりません。 ----------------------------------------------- １．下記の意味を教えてください。 ここにおすすめ情報などを書くと良いでしょう。 書き方は、 <p class="l_f1">ここに内容</p> それと上のメニューの書き方は <div><a href="#" class="side">メニュー6</a></div> そのほかの書き方 <p class="l_f2">ここに内容</p> <p class="l_f3">ここに内容</p> <p class="l_f4">ここに内容</p> <p class="l_f5">ここに内容</p> っとあるのですが、<p class="l_f1">ここに内容</p>や<div><a href="#" class="side">メニュー6</a></div>の意味がまったくわかりません。 ２．文字のサイズ、フォント、色を変えるにはどうしたらいいのかも分かりません。 ３．リンクを張るにはどうしたらいいのですか？ ４．ソースを見ると <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta name="author" content="katsu"> <meta name="copyright" content="Copyright © sozai.wdcro"> <link rel="copyright" href="http://sozai.wdcro.com/"> <link href="style/wdstyle.css" rel="stylesheet" type="text/css"> <!-- ここまで変更不可 --> になってました。http://www.w3.org/TR/html4/loose.dtdってなんですか？
- ベストアンサー
- HTML
- CSSの表示の違い（IEとFirefox）
背景を固定するために、CSSを使いました。 IEで見ると、指定したとおり右下で固定されているのですが、Firefoxで見ると、全体に表示されて固定されません。 ネット上を探して見ると、Firefoxでも固定されているサイトはかなりあります。 そうすればいいのでしょうか？ <style type="text/css"> <!--body {background-color:"white"; background-image:url("http://www.******-labo.com/sozai_mami/clip_arts/moon/05/white/blue.jpg"); background-repeat:"no-repeat"; background-position:"bottom right"; background-attachment:"fixed";}--> </style>
- ベストアンサー
- CSS
- サイドバーの背景画像(CSS)
以下のＣＳＳのソースなのですがサイドバーに http://www.01kaisha.com/img/main/main01_r2_c3.jpg を背景として使いたいのですがメインのほうに背景がいってしまい サイドバーで表示する事が出来ません。 どのようにすればサイドバーにhttp://www.01kaisha.com/img/main/main01_r2_c3.jpg を使用することが出来るのでしょうか？ どなたか分かる方いらっしゃいましたら教えてください、お願いします<(_ _)> body{ margin: 0px; padding: 0px; background-image: url(http://www.01kaisha.com/img/main/main01_r2_c3.jpg); background-repeat: repeat-y; } .main{ width: 642px; position: absolute; left: 0px; } .side{ margin-left: 642px; }
- ベストアンサー
- HTML
- CSSで左右の高さを調整できてる手法
次のＣＳＳ(外部)を作成しました *{margin: 0px; padding: 0px;} body{background: #FFFFCC; line-height: 150%; margin-left: 10px;} /* メインのフレームpage 色は水色とする，枠線は灰色*/ .page{background: #00FFFF; border: 1px solid #CCCCCC; width: 815px; margin: 5px auto;} /*上の２行のヘッダー*/ .header1{padding: 10px 5px 10px 5px; margin: 0px; background: #FFFFFF;} .header2{padding: 5px; background: #99FFCC; height: 25px;} /*左右の指定、左はpageの色を使用*/ .main{border-left: 1px solid #FF00FF; margin: 0px; padding: 10px 5px; background: #66FF00; float: right; width: 620px;} .menu{margin: 0px; padding: 10px 5px; float: right; width: 193px;} /*最下のフッター指定(通常コピーライトなどの領域)*/ .footer{border-top: 1px solid #CCCCCC; margin: 0px; padding: 0px 5px; clear: both; background: #CC99FF;} －－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－ htmlの方はPageをDIVで囲みその中に他のDIV要素入れてあります。 ＣＳＳを作成するにあたって参考にしたのが http://www.shoshinsha.com/hp/template/layout/simpe02.zip です。 このサイト右側をいくら長くなっても左側もついて行くのは Pageの色にしているのはわかりました。 余計なものは不要ですので最低限を残して改良して資料を見たりして コメント入れたりと勉強しながら作成したのが上です。 しかしＩＥ６で見ると左がフッダーの色に浸食された感じになります。 また改良したのは多少名前を変えてはいますがそれは問題なさそうなのも確認しています。 右より回り込ませています。 理由はリンクが下にあった方が追加の時に楽だからです。 またこのサンプルは、ブロックレベル要素の高さを揃えるために overflow: hidden;や、padding-bottomプロパティとmargin-bottomプロパティの32768px;や-32768px;を使っていないしＪＡＶＡも使ってないようです http://www.google.co.jp/search?sourceid=navclient&aq=t&hl=ja&ie=UTF-8&rlz=1T4GZAZ_jaJP265JP285&q=%e3%83%96%e3%83%ad%e3%83%83%e3%82%af%e8%a6%81%e7%b4%a0%e3%81%ae%e9%ab%98%e3%81%95%e3%82%92%e6%8f%83%e3%81%88%e3%82%8b%e3%80%80CSS (参考に検索したもの、上位の数ページを見たのですが。) このサンプルはどういうテクニックを使っているのかと、 上のＣＳＳのどこを直せばよいでしょうか。 右側が長くなり左が余った分の所になぜかフッターの背景色が 入ってきているのです。 文字の大きさや文字色は必要ありません 左右もそうですが左のラインから10pxくらいとって文字が入力できれば いいです。 よろしくお願いします。 http://oshiete1.goo.ne.jp/qa3992750.html 上も見ましたがちょっと違う(サンプルは同じもの使ってますが)ので 質問させて頂きます。 どなたかお願いします。
- 締切済み
- CSS
- 動画をビデオスタジオX7で重ねたい
動画編集の初心者です。 http://www.nonnofilm.com/self/tutorials_html/other/sozai_knowledge.html ↑上記のリンク先のように、動画を重ねて背景が黒い動画素材の背景を透明にし、キラキラと光る演出がしたいのです。黒い背景のまま重なってしまい、１つ目の動画が黒くなってしまいます。 使っているソフトはビデオスタジオX7です。 使いたいと思っている動画素材は以下の２つです↓ http://commons.nicovideo.jp/material/nc47743 http://commons.nicovideo.jp/material/nc93037 ご助言宜しくお願いします。
- ベストアンサー
- 画像・動画・音楽編集