2顶

用纯CSS建立的不错的表格

稿源：互联网 2022-04-25 00:26:06 点击： 905 撤稿纠错

用纯CSS建立的不错的表格，阿里西西网页特效收集。

以下讨论的是和css 特效网页网页特效表格相关的用纯CSS建立的不错的表格教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>www.alixixi.com</title>
<style type="text/css">
* {
 margin:0;
 padding:0;
 font-size:12px;
 color:#000;
}
#table {
 width:405px;
 margin:50px auto;
}
#table li,#table li.header {
 list-style-type:none;
 width:100px;
 height:30px;
 line-height:30px;
 text-align:center;
 float:left;
 margin-left:1px;
 margin-bottom:1px;
 background:#ccc;

}
#table li.header {
 background:#999;
}
</style>
</head>

<body>

<ul id="table">
 <li class="header">第一列</li>
 <li class="header">第二列</li>
 <li class="header">第三列</li>
 <li class="header">第四列</li>
 <li>数据1-1</li>
 <li>数据1-2</li>
 <li>数据1-3</li>
 <li>数据1-4</li>
 <li>数据2-1</li>
 <li>数据2-2</li>
 <li>数据2-3</li>
 <li>数据2-4</li>
 <li>数据3-1</li>
 <li>数据3-2</li>
 <li>数据3-3</li>
 <li>数据3-4</li>
 <li>数据4-1</li>
 <li>数据4-2</li>
 <li>数据4-3</li>
 <li>数据4-4</li>
</ul>
</body>
</html>
<a href="http://www.alixixi.com/Dev/HTML/jsrun/">欢迎访问阿里西西网页特效集</a>

关于用纯CSS建立的不错的表格的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200807151128.shtml方便下次再访问哦。

·上一篇： 横向弹出菜单特效
·下一篇： 像册方式展现字母表

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

用纯CSS建立的不错的表格

文章分类LIST >>返回首页

最新游戏

最新新闻