First look at the effect:
The following is the source code:
<html>
<head>
<title>test</title>
<style type= "Text/css" >
ul{
margin:0px;
padding:0px;
width:200px;
}
ul li{
Float:left;
List-style-type:none;
border-top: #000 solid 1px;
Border-left: #000 solid 1px;
width:65px;
}
. border-r{
border-right: #000 solid 1px;
}
. border-b{
Border-bottom: #000 solid 1px;
}
. border-l{
border-right: #000 solid 1px;
Border-bottom: #000 solid 1px;
}
</style>
</head>
<body>
<ul>
<li>&nbsp;</li>
<li>&nbsp;</li>
<li class= "Border-r" >&nbsp;</li>
</ul>
<ul>
<li>&nbsp;</li>
<li>&nbsp;</li>
<li class= "Border-r" >&nbsp;</li>
</ul>
<ul>
<li>&nbsp;</li>
<li>&nbsp;</li>
<li class= "Border-r" >&nbsp;</li>
</ul>
<ul>
<li class= "Border-b" >&nbsp;</li>
<li class= "Border-b" >&nbsp;</li>
<li class= "border-l" >&nbsp;</li>
</ul>
</body>
</html>
You can see the effect by saving the above code into an HTML-formatted Web page document.