• ベストアンサー

アメーバみたいな上部のバーを作りたい

piguchan1の回答

  • ベストアンサー
回答No.2

こんにちは。 こちらのページは、上のバーの部分のみ横幅を「100%」にして、 それ以下を「950px」のセンター揃えにしているようです。 例えば css ---- *{ padding:0; margin:0; } #bar { width: 100%; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: #000000; float: left; } .right{float:right;} .left{float:left;} #main{ width:950px; height: 600px; margin-right: auto; margin-left: auto; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-right-color: #999999; border-bottom-color: #999999; border-left-color: #999999; } ---- HTML ---- <body> <div id="bar"> <div class="right">ホーム|メニュー</div> <div class="left">ロゴ</div> </div> <div id="main"> コンテンツが入ります。 </div> </body> ---- 一応サンプルまでに。

tikubiru
質問者

お礼

ありがとうございます。 作成できました。 今後とも宜しくお願いします。

関連するQ&A

  • アメーバーブログで背景画像の寸法変更が分かりません

    アメーバーブログで背景画像の寸法変更が分かりません アメーバーブログで 背景に好きな画像を入れたいんですが 寸法の調整方法が分かりません 寸法を調整したい理由は 予め入れたい画像に対して ある程度、背景画像に合わせた寸法で 編集した上で、背景画像としてアップしたいからです ここに、寸法変更の方法は載ってます http://helps.ameba.jp/qguide/blog/post_323.html#c しかし載ってるのは高さの変更方法だけで 横の方法が載ってません 更に、ここにスタイルシートが出てますが http://blog.ameba.jp/ucs/editcss/srvcssupdateinput.do 何処を見ても、横の寸法が載ってる場所が分かりません それと、まだ自分のブログは 出来上がってないんで、旗上げも、してませんが 試験的にアメーバーの スキンを入れたりで試したんですが それでもソースを見ても分かりませんでした もっとも…ソースの場合スタイルシートの事は 分からないのかも知れませんが… これは、何処を見れば分かるんでしょうか?

  • メニューバー

    HTMLでHPを作成しています。 いろいろなサイトなどのソースをみて、HPっぽくなったのですが、メニューバーだけがどうしてもうまくできません。 ソースを見ても、右にメニューバーと左にメインページといった感じで分かれていて どこでくっついて同じページ上にあるのかわかりません。 どうやってメニューバーを作ればいいか教えてください。

    • ベストアンサー
    • HTML
  • FC2ブログのページ上部にフリースペースを入れたいのですが、

    FC2ブログのページ上部にフリースペースを入れたいのですが、 HTML,スタイルシート両方書き換えなければならないのでしょうか? どのようなタグをどこに入れたらよいでしょうか?あと、こういうカスタマイズをすると検索にかかりにくくなるというのは本当でしょうか?

  • 画面下にバーをいっぱいに表示する

    画面の上部については、余白なく <body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0> で表示できたのですが、 以下のサイトのように http://www.aimix.jp/bodymag.html 画面一番下も色塗りバーでいっぱい表示する場合にはどのようにすれば宜しいのでしょうか?

    • ベストアンサー
    • HTML
  • スクロールバーの位置指定

    HTMLでリストを作成し、表示した時に、スクロールバーの位置を一番下に表示したいのですが、スタイルシートかJavaScriptでスクロールバーの位置を指定できないでしょうか? いろいろ探してみたのですが、見つからず、質問しましたので、よろしくお願いします。

  • CSSで背景の2カ所に位置を指定してボーダーを入れるにはどうしたらいいでしょうか?

    http://www.thefujiyagohonjin.com/ このサイトのようにページの最上部と、ページの下から100pxの位置に、画面いっぱいに伸縮するボーダーを入れたいと思っています。上部のボーダーは指定できたのですが、下部の方をどうやって位置を設定していいのかわからず困っています。ナビゲーションもこのサイトのように画面サイズによって伸縮するデザインなので、このサイトの背景部分のCSSを教えていただけたら非常に助かります。 かなり低レベルな質問かもしれませんが、どなたか宜しくお願いします。

  • アメーバブログの本文入力につきまして

    アメーバブログを書いてます。 いつもスマホで書いてたのであまり気にしてなかったのですが、PCから見たら本文がズレてて・・・ 恥ずかし~ってなりました。 私は本文の上部にテキストを入れてます。 スマホ画面ではあまり気にならなかったのですが、PCでは左揃えになってるためテキストからズレてて違和感があります。 しかしながら中央揃えにすると、文の先頭がバラバラになるので、何かなぁ・・ってなってます。 インデントがあれば、真ん中辺りまで移動させたらいい具合になるかのかとと思ったりもするのですが・・ 上部にテキストを使用されてる方のブログを見たらPC画面もスマホ画面もちゃんとテキスト下の中央に、そして文の先頭も揃っていて、とても読みやすいです。 どうすれば、そのようになるのでしょうか? HTMLに<senter>'を入れるなども試しましたが出来ませんでした。 またスマホで入力したフォントの大きさかが「中」の場合、PCでは「M」になるのでしょうか? 何かバランスがイマイチでして・・・ 色々と申し訳ございませんがよろしくお願いします。

  • ホームページビルダー8でスタイルシートを使いたい。

    HTML初心者です。ホームページビルダーは簡単ですが何度か経験があります。ホームページビルダー8で他のサイトからのスタイルシートというものを使って簡単に作成したいのですが・・ http://wbakibaki.id25.com/ こちらのサイトでテンプレートをダウンロードさせて頂きました。 ですがその先が分かりません^^; 解凍はできたのですが開けると何個もフォルダがでてきてしまってその中のcssというフォルダの中のstyleという所を開けるとカスケードスタイルシートドキュメント(cssファイル)であるのですがそれを全部コピーしてHPBのHTMLソースに張り付けるのでしょうか? ちなみにHPBの白紙のページのHTMLソースが <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 8.0.0.0 for Windows"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE></TITLE> </HEAD> <BODY></BODY> </HTML> とあるのですがどこの部分にいれるのですか? 色々自分なりに調べましたがイマイチ分かりません・・ それでいれられたとしたらテンプレートで見た物とまったく同じような画面がでてきてそれを編集するのでしょうか?どなたか初心者でもわかるように教えていただけませんでしょうか? なにか間違っていたり、補足が必要ならいたしますので宜しくお願いします!

    • ベストアンサー
    • HTML
  • ブラウザ上に固定させるメニュー

    http://www.430.jp/rak2/user/samp1/ ↑サンプル掲示板ではページ上部にメニューを固定させていますが、これと同じようなものを探しています。これはJavaScriptで実現させるのでしょうか? 以前にスタイルシートで試したことがあるのですが、低スペックマシンで高速スクロールするとメニューがぶれてしまいました。 サンプルソースを紹介しているサイト、または、書き方をお教え頂けると助かります。どうぞよろしくお願いいたします。

  • 背景画像をブラウザ上部に隙間なく張る

    HTML タグだと思うのですが、たとえば88×38 の画像を ブラウザ画面上部に隙間をあかないように貼るにはどうしたらいいのでしょうか。 例えば以下のように、 <TABLE border="0" cellspacing="0" cellpadding="0" width="100%" bgcolor="#63cf63" background="gif/line.gif"> とかやると、いっけん、きっちり貼れているように 見えるのですが、リロードしたり、リンクからページを たどったりすると、時々画面右側が丁度スクロールバー ぶんくらいのスペースが空いてしまい、白く抜けて しまいます。 非常に見苦しいので、なんとかしたいです。。。

    • ベストアンサー
    • HTML