最終表示効果如下図:
代码:
<% @ Page Language="C#" AutoEventWireup="true" CodeFile="SammyDiv.aspx.cs" Inherits="Buying_SammyDiv" %>
< html xmlns ="http://www.w3.org/1999/xhtml" >
#rtop{}{
margin:0 auto;
高さ: 30%;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景: #CCCC00;
}
#rbottom{}{
margin:0 auto;
高さ: 70%;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景: #CCee00;
}
#left{}{
float:left;
高さ:100%;
幅: 50%;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景: #CCCCed;
}
#コンテナ{}{
width:600px;
高さ:300ピクセル;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景色:緑
}
#leftside{}{
幅: 20%;
高さ: 60%;
float:left;
フォントファミリー:Arial;
font-size:x-large;
vertical-align:middle;
text-align:center;
背景: グレー;
}
#rightside{}{
幅:80%;
高さ: 60%;
float:left;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景: #Cdfd00;
}
#foot{}{
高さ:20%;
クリア: 両方;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景色:InactiveBorder;
}
#header{}{
高さ:20%;
クリア: 両方;
vertical-align:middle;
text-align:center;
フォントファミリー:Arial;
font-size:x-large;
背景色:赤
}
style >
頭>
ヘッダー
div >
左側
div >
右上
div >
左
div >
右
div >
div >
div >
div >
足
div >
div >
フォーム >
ボディ>