//置頂
<td valign="top"
border="8"
>
// table 包的格式<table >
<tr>
<td > </td>
<td > </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
可做出垂直的線
style="border-right: thin solid #2C5F93;"
置中的css語法
<style type="text/css">
/*
#center {
position:absolute;top:50%; margin-top:0px; /* div高度的一半 *//*
}
.style1
{
width: 100%;
}
*/
/* 下面這組會有一個300 * 300 的 box空間,在放入table來做垂直的部份*/
body
{
background-color:#EEE;
}
.BOX
{width:300px;
height:300px;
/*border:1px solid #444;*/
/*box-shadow:1px 5px 5px #666;*/
position:absolute;
left:50%;
top:50%;
margin-top:-150px;
margin-left:-150px;
}
.style1
{
width: 100%;
}
</style>
做一個垂直左右置中的login
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Test_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
/*
#center {
position:absolute;top:50%; margin-top:0px; /* div高度的一半 *//*
}
.style1
{
width: 100%;
}
*/
body
{
background-color:#EEE;
}
.BOX
{width:200px;
height:200px;
/*border:1px solid #444;*/
/*box-shadow:1px 5px 5px #666;*/
position:absolute;
left:50%;
top:50%;
margin-top:-100px;
margin-left:-100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<%--<div id="center">
1<table class="style1">
<tr>
<td>
1</td>
<td>
1</td>
</tr>
<tr>
<td>
1</td>
<td>
1</td>
</tr>
</table>
</div>--%>
<div class="BOX">
<table width="200px" border="1px">
<tr style="background-color:Silver">
<td>登入系統</td>
</tr>
<tr>
<td>
帳號</td>
</tr>
<tr>
<td >
<asp:TextBox ID="TextBox1" runat="server" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td >
密碼</td>
</tr>
<tr>
<td>
<asp:TextBox ID="TextBox2" runat="server" TextMode="Password" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Button ID="Button1" runat="server" Text="登入" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
沒有留言:
張貼留言