WEBの基本
WEBに関してあれこれ。
WEBに関してあれこれ。
トップページ>2カラムレイアウト(左固定幅、右リキッド)
2カラムレイアウト(固定メニューリキッド)
HTML部分
<div id="header">
<div id="header_text">
<p>ヘッダー</p>
</div>
</div>
<div id="container">
<div id="left">
<div id="left_text">
<p>メニュー</p>
</div>
</div>
<div id="right">
<div id="right_text">
<p>テキスト</p>
</div>
</div>
</div>
CSS部分
* {
margin: 0;
padding: 0;
}
#header {
width: 100%;
height: 100px;
background-color: #808080;
}
#header_text {
border: 1px solid black;
height: 100px;
}
#container {
width: 100%;
}
#left {
width: 200px;
height: 300px;
background-color:#D8D8D8;
float: left;
}
#right {
width: 100%;
height: 300px;
background-color:#D8D8D8;
}
#left_text {
border: 1px solid black;
height: 300px;
}
#right_text {
border: 1px solid black;
height: 300px;
}
#footer {
clear: both;
width: 100%;
height: 100px;
}
#footer_text {
border: 1px solid black;
background-color: #808080;
height: 100px;
}
