当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > css制作有立体效果的表格

CSS样式表
CSS制作网页的类以及ids的命名
认识Opera浏览器和IE浏览器
CSS模块化的理解
CSS教程:设计制作网页的CSS经验
一列固定宽度布局和背景图片绝对定位
CSS也要语义化
清除网页浮动CSS的做法
CSS让网页提交input按钮与众不同
CSS BUG问题解决的一些经验
CSS教程:网页字体的设置和控制
CSS根据用户需求设置网页字体大小
CSS样式设计网页字体与用户体验
CSS教程:position属性
浅谈html和body标记应用CSS
认识浏览器:Google Chrome 浏览器
认识浏览器:Firefox 浏览器
认识浏览器:挪威的 Opera
认识浏览器:Mozilla项目
认识浏览器:Netscape 浏览器
认识浏览器:Internet Explorer

CSS样式表 中的 css制作有立体效果的表格


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-11   浏览: 78 ::
收藏到网摘: n/a

<style>
.aa {margin:100px}
ul {width:80px; float:left; margin:0px}
.aa li a{border:1px #E5E5E5 solid; background-color:#EAEAEA; width:120px; height:30px; list-style:none; margin:0px;float: left; border-top-color:#FFFFFF; border-left-color:#FFFFFF}
.aa li a:hover{border:1px #717171 solid; background-color: #E5E5E5; border-top-color:#FFFFFF; border-left-color:#FFFFFF}
</style>
<div class="aa">
<ul>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
<ul>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
</div>
HTML代码

[Ctrl A 全部选择 提示:你可先修改部分代码,再按运行]