Home > Article > Web Front-end > Raised button effect_CSS/HTML

Raised button effect_CSS/HTML

WBOYOriginal: 2016-05-16 12:10:344687browse

[Ctrl+A Select all Note: If you need to introduce external Js, you need to refresh to execute

]

<style>

body{background: #DDD;} 
table 
{ 
 width: 450px;height:75; 
 background: #CCC;filter:progid:DXImagetransform.microsoft.shadow(strength=10,direction=135,color=#666666); 
} 
td{text-align: center;} 
td a{ 
 width: 100px; 
 30px; 
 text-align: center; 
 border-top: 2px solid #FFF; 
 border-bottom: 2px solid #333; 
 text-decoration: none;padding:3px; 
} 
td a:hover{ 
 background: #DDD;font-family:华文行楷;padding:5px; 
} 
td a:active 
{ 
 padding:7px; 
 color: #ED1C24; 
 font-weight: bold; 
} 
</style>
<table border="0" align="center"> 
<tr> 
<td><a href="#">金翅擘海</a></td>
<td><a href="#">知往观来</a></td>
<td><a href="#">独来读网</a></td>
<td><a href="#">野火寒烟</a></td> 
</tr> 
<tr> 
<td><a href="#">萧萧小雨</a></td>
<td><a href="#">湖面无舟</a></td>
<td><a href="#">孤零飘客</a></td>
<td><a href="#">天牙海脚</a></td> 
</tr> 
</table>

<table border="0" align="center">
<tr>
<td><a href="#">Golden Wings Breaking the Sea</a></td>
<td><a href="#">Knowledge GoViewCome </a></td>
<td><a href="#">Dulaidu.com<input onclick="runEx('runcode7213')" type="button" value="运行代码"></a></td>
<td><a href="#">Wildfire Cold Smoke<input onclick="doCopy('runcode7213')" type="button" value="复制代码"></a></td>
</tr>
<tr>
<td><a href="#">Xiao Xiaoyu<input onclick="doSave(runcode7213)" type="button" value="保存代码"></a></td>
<td>
<a href="#">There is no boat on the lake</a><a href="/article/23421.htm" title="查看具体详情" target="_blank"></a>
</td>
<td><a href="#%20">Lonely wanderer</a></td>
<td><a href="#">Tianya Haijiao</a></td>
</tr>
</table>
 <div class="htmlarea"> <textarea id="runcode60260"> [Ctrl+A Select all Note: <table width="60" cellspacing="16" bgcolor="buttonface" style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=blue,endColorStr=white);"> 
<tr> 
<td width="100%" name="cool" bgcolor="buttonface" onmouseover="movr(this)" onmouseout="mout(this)" onmouseup="movr(this)" onmousedown="mdwn(this)"> 
鹤发童颜 
</td> 
<td width="100%" bgcolor="buttonface" onmouseover="movr(this)" onmouseout="mout(this)" onmouseup="movr(this)" onmousedown="mdwn(this)"> 
青梅竹马 
</td> 
<td width="100%" bgcolor="buttonface" onmouseover="movr(this)" onmouseout="mout(this)" onmouseup="movr(this)" onmousedown="mdwn(this)"> 
知往观来 
</td> 
<td width="100%" bgcolor="buttonface" onmouseover="movr(this)" onmouseout="mout(this)" onmouseup="movr(this)" onmousedown="mdwn(this)"> 
金翅擘海
 

</td> 
</tr> 
</table>If you need to introduce external Js, you need to refresh to execute

]

[Ctrl+A select all Note: If you need to introduce external Js, you need to refresh to execute ]

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Black text with white borders css_CSS/HTMLNext article：Black text with white borders css_CSS/HTML

See more

Raised button effect_CSS/HTML

Related articles