代码改变世界

一个表单的界面,在我感觉还蛮好的,附有css代码

2009-03-05 10:10  Jeffery Tao  阅读(306)  评论(0)    收藏  举报

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <style>

 

body
{
 margin-left: 0px;
 margin-top: 0px;
 margin-right: 0px;
 margin-bottom: 0px;
    font-size: 12px;
    color: Black;

}

/*普通TD*/
td
{
    font-size: 12px;
    color: black;
}
  /*单元格居中对齐*/
.centerStyle
{
 font-size:18px;
 font-weight:bold;
 
    text-align:center;
    height: 20px;
    color: #333333;
    line-height: 18px;
    padding: 2px;
    background-color: #F3F3F3;
    }
  /*单元格 内有文字*/
.zhongStyle
{
    text-align: center;
    width: 100px;
    height: 20px;
    color: #333333;
    line-height: 18px;
    padding: 2px;
    background-color: #F3F3F3;
}
/*单元格 内有文字*/
.leftStyle
{
    text-align: right;
    width: 100px;
    height: 20px;
    color: #333333;
    line-height: 18px;
    padding: 2px;
    background-color: #F3F3F3;
}
.shortLeftStyle
{
    text-align: right;
    width: 74px;
    height: 20px;
    color: #333333;
    line-height: 18px;
    padding: 2px;
    background-color: #F3F3F3;
}
/*单元格 内有文字 --加长--的一个*/
.leftStyleLong
{
    text-align: right;
    width: 120px;
    height: 20px;
    color: #333333;
    line-height: 18px;
    padding: 2px;
    background-color: #F3F3F3;
}

/*单元格 内有文字 --加长(zwsqmy/badysdjb.aspx页面用)*/
.leftStyleLong2
{
    text-align: right;
    height: 20px;
    color: #333333;
    line-height: 18px;
    padding: 2px;
    background-color: #F3F3F3;
}
/*单元格 内有控件*/
.rightStyle
{
    text-align: left;
    height: 20px;
    line-height: 18px;
    padding: 2px;
}
input.longTextBox
{
    border-top: solid 1px #7F9DB9;
    border-left: solid 1px #7F9DB9;
    border-right: solid 1px #D5D5D5;
    border-bottom: solid 1px #D5D5D5;
    width: 200px;
  event:expression(onfocus = function(){this.style.backgroundColor='#EDF7FD'},onfocusout = function(){this.style.backgroundColor='#FFFFFF'});
}

A
{
    font-family: "宋体";
 font-size: 9pt;
    color: Black;
 text-decoration: none;
}
A:ACTIVE /*按过后后退时颜色*/
{
 color:Black; 
 text-decoration: none;
}
A:HOVER /*鼠标悬浮在链接上时的颜色*/
{
 color:Red;
 text-decoration: underline;
}
A:LINK /*显示颜色*/
{
 color:Black;
 text-decoration: none;
}
  </style>
 </HEAD>

 <BODY>
  
                    <table id="AutoNumber1" runat="server" border="1" bordercolor="#93bee2" cellpadding="0"
                        cellspacing="0" bordercolordark="white" bordercolorlight="#D5D5D5" width="100%">
                         <tr>
                            <td colspan="4" class="centerStyle">
                                公共场所、特种行业管理登记表
                            </td>
                        </tr>
                        <tr>
                            <td class="leftStyle">
                                编号:</td>
                            <td class="rightStyle" nowrap>
                               <input type="TextBox" class="longTextBox" />
                            </td>
                            <td class="leftStyle">
                                分类:</td>
                            <td class="rightStyle" nowrap>
                               <input type="TextBox" class="longTextBox"/>
                            </td>
                        </tr>
                        <tr>
                            <td class="leftStyle">
                                单位名称:</td>
                            <td class="rightStyle" nowrap>
                               <input type="TextBox" class="longTextBox"/>
                            </td>
                            <td class="leftStyle">
                                开业时间:</td>
                            <td class="rightStyle">
                                <input type="TextBox" class="longTextBox"/>
                        </tr>
                      
                     
                      
                                        
                     
                    </table>
     <a href="#" >Click me</a>
       
 </BODY>
</HTML>