按钮美化

1.样式一 平面按钮


代码如下 :

<style type="text/css">
input.sa{border:1 solid black;FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 18px; LINE-HEIGHT: normal}
</style>

<input type="text" name="textfield" class=sa>
<input type="submit" name="Submit" value="" class=sa>

2.样式二



代码如下 :
<style type="text/css">
input.a1{background:#ffffff;border-bottom-color:#6699FF; border-bottom-width:1px;border-top-width:0px;border-left-width:0px;border-right-width:0px; solid #ff6633; color: #000000; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 18px; LINE-HEIGHT: normal}
input.b1{BACKGROUND: #6699FF; border:1 solid #6699FF; COLOR: #ffffff; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 18px; LINE-HEIGHT: normal}
</style>

<input type="text" name="textfield" class=a1>
<input type="submit" name="Submit" value="" class="b1">

3.样式三:


代码如下 :
<style type="text/css">
input.a2{background:#ffffff;border-bottom-color:#CC0000; border-bottom-width:1px;border-top-width:0px;border-left-width:0px;border-right-width:0px; solid #ff6633; color: #000000; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 18px; LINE-HEIGHT: normal}
input.b2{BACKGROUND: #CC0000; border:3 solid #DEE3E7; COLOR: #ffffff; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-VARIANT: normal; FONT-WEIGHT: normal; HEIGHT: 18px; LINE-HEIGHT: normal}
</style>

<input type="text" name="textfield3" class="a2">
<input type="submit" name="Submit3" value="" class="b2">

4.样式四




代码如下 :
<INPUT name="submit" type=submit class=so style="BACKGROUND-COLOR: #e86000; COLOR: #ffffff; HEIGHT: 20px; WIDTH: 58px" value="" />

5.样式五,button

代码如下 :
<style>
.btn {
BORDER-LEFT: #ff9966 1px solid;
BORDER-RIGHT: #ff9966 1px solid;
BORDER-TOP: #ff9966 1px solid;
BORDER-BOTTOM: #ff9966 1px solid;
PADDING-LEFT: 2px;
PADDING-RIGHT: 2px;
PADDING-TOP: 2px;
PADDING-BOTTOM: 2px;
FONT-SIZE: 12px;
CURSOR: hand;
COLOR: #000000;
FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#ff9966);
}
</style>

<button class=btn title="">这是一个按钮</button>






posted @ 2009-03-24 17:31  朝夕  阅读(1243)  评论(0编辑  收藏  举报