How to beautify table borders with CSS to create a sunken three-dimensional effect_Typical special effects-JS Tutorial-php.cn

How to beautify table borders with CSS to create a sunken three-dimensional effect_Typical special effects

WBOY

Release： 2016-05-16 18:45:34

Original

2141 people have browsed it

Of course, here is only one idea, you can modify it flexibly.

<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<center>
<fieldset id="shop" style="width:200;"> <legend><span style="font size:12px">Script Home</span></legend>
 
<form name="form1" method="post" action="">
<p align="left">
<input type="checkbox" name="checkbox" value="checkbox">
<span style="font size:12px">AJAX Column</span>
 
</p>
<p align="left">
<input type="checkbox" name="checkbox2" value="checkbox">
<span style="font size:12px">FW Column</span></p>
<p align="left">
<input type="checkbox" name="checkbox3" value="checkbox">
<span style="font size:12px">FLASH Column</span></p>
</form>
<span style="font size:12px"><font color="#990000">This border is the default style</font></span>
 
</fieldset>

<fieldset id="shop" style="width:200;border:inset;border-top-width: 3px; border-right-width: 3px; border-bottom-width: 3px; border-left-width: 3px;">
<legend><span style="font size:12px">Script House</span></legend>
 
<form name="form1" method="post" action="">
<p align="left">
<input type="checkbox" name="checkbox4" value="checkbox">
<span style="font size:12px">AJAX Column</span>
 
</p>
<p align="left">
<input type="checkbox" name="checkbox22" value="checkbox">
<span style="font size:12px">FW Column</span></p>
<p align="left">
<input type="checkbox" name="checkbox32" value="checkbox">
<span style="font size:12px">FLASH Column</span></p>
</form>
<span style="font size:12px"><font color="#990000">This border has a concave effect</font></span>
 
</fieldset>
</center>