木更津SEO対策・君津SEO対策 きさらずSEO対策 きみつSEO対策 ホームページSEO対策 作成・制作、Xoops SEO対策・Geek SEO対策・CMS SEO対策の構築・管理・運営とSEO対策、木更津でSEO対策・君津でホームページ作成・制作・富津でSEO対策・袖ヶ浦でホームページ制作・作成・かずさでSEO対策・上総地区でホームページ作成・制作とSEO対策をする。
ホームページ作成・制作とSEO対策なら2land.net。
木更津・君津地区でHP制作・作成やSEO対策なら。
XoopsやGeekやCMSのホームページをインストール・構築・管理・デザイン・インストール・設定も

自分でするSEO対策・検索エンジン最適化対策！

スタイルシートの匠技

コンテンツをウィンドウにぴったり密着させる

コンテンツを左上のウィンドウの枠ぴったりに密着させる事もスタイルシートで可能です。 これはよく考えるとさほど難しくない事に気づきます。 前回の簡単なコンテンツボックスの作成と罫線（けいせん）の利用方法 の内容を使います。ここで、「margin」というのがありましたが、コンテンツをぴったり密着させたいのでしたら、 body要素がサイトコンテンツ全体にかかるのを利用して、 body要素に「margin-left: 0px;」を適応させれば良いと言う事になります。 何も指定しないと予め、左右上下の余白がブラウザによって決められていますので、 そのマージンを0にしてしまうという考え方です。

企業のサイトなどでもよくぴったりと密着させているページを見かけますが、以下のようにしています。

<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
   <meta http-equiv="content-style-type" content="text/css">
   <title>ウィンドウ密着</title>
   <style type="text/css">
      body
      {
         margin: 0em;
      }
   </style>
</head>
<body>
   <h1>ウィンドウに密着させる</h1>
   <p>body要素がデフォルトで持っているブラウザ依存のマージンを書き換えてあげると、
   左上ウィンドウにぴったりと密着させる事ができます。</p>
</body>
</html>

プレビュー画面はちょっとできませんが、確認してみてください。 後は、左ペインに背景画像を縦一列に並べたりして、そこにメニューを配置、 メインコンテンツを作れば企業っぽいサイトになります。