positionレイアウトホームページ作成講座｜#container部分
CSSデザインサンプルのホームページ制作の流れをご確認下さい。 CSSのコピー 下記ソースをコピーして下さい。 /*-------------------------containerの指定*/ #container { position: relative; width: 100%; margin: 0; padding: 0; } HTMLファイル指定部分 <body> <div id="wrapper"> <div id="header"> *** ヘッダー部分 *** </div> <!--container 基点--> <div id="container"> <div id="contents"> *** コンテンツ部分 *** </div> <div id="sidebar"> *** サイドバー部分 *** </div> </div> <div id="footer"> *
max-width/min-widthで指定するレイアウト｜上級CSSレイアウト講座
max-widthプロパティ（最大幅）/min-widthプロパティ（最小幅）で指定する、最大幅と最小幅を固定したCSSレイアウト解説です。 当サイト内で解説しているリキッドレイアウトは、コンテンツ部分がブラウザの拡大縮小に合わせ可変し続けるのに対し、max-widthプロパティ/min-widthプロパティで指定するレイアウトでは、最大幅と最小幅を固定してしまいます。 max-widthプロパティ（最大幅）/min-widthプロパティ（最小幅）はIE6以前のバージョンでは未対応です。よってIE6以前のブラウザ対策が必要です。（IE独自拡張スクリプト） 以下のサンプル解説では、最大幅を900px、最小幅を500pxとします。 サンプルソース 当サイト内の リキッドレイアウト2カラム左サイドバー を使用しています。 #wrapper { text-align: left; margin:
CSSで指定するロールオーバー(1)｜CSSの小技(指定テクニック)
グローバルナビゲーションやローカルナビゲーションに画像を使用してボタン化しているサイトがあります。特にホームページビルダーを利用されている方、ホームページを制作されて間もない方のほとんどがjavascriptで指定していると思いますが、ここでは同じ仕組みをスタイルシートで指定する方法の紹介です。 下記のCSS指定は一番簡単な方法となります。もうひとつの方法はロールオーバー(2)を参照して下さい。こちらの方が画像入れ替えがスムーズに行えます。 ロールオーバーサンプル Home menu menu menu menu (X)HTML <ul id="globalnavi"> <li id="menu1"><a href="#">Home</a></li> <li id="menu2"><a href="#">menu</a></li> <li id="menu3"><a href="#">me
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
