table标签制作表格代码繁琐，且不方便后期代码维护。

li标签加上css的浮动样式可以制作多种样式的表格。

代码如下：

<ul id="ttttt" style="width:404px;text-align:center;line-height:30px;border-left:1px solid #000;border-top:1px solid #000;">
 <li style="width:403px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">这是表格</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
  <li style="width:100px;height:30px;float:left;text-align:center;border-right:1px solid #000;border-bottom:1px solid #000;">a</li>
 </ul>

效果如下：

ul+li标签制作表格的更多相关文章

  1. 基于DIV+ul+li实现的表格(多示例)

    一个无序列表biaoge,前四个列表项我们赋予了类biaotou.因为这四个项是表格头部,应该与表格数据有所区别.所以单独赋予了类,可以方便控制.下面我们开始CSS代码的编写:由 www.169it. ...

  2. ul li 标签

    去除制表符: li{ list-style:none; } ul{ /* 靠左*/ padding-left: 5px; }

  3. html中去除ul,li标签的样式列表标签的点？

  4. 为什么要使用ul li布局网站导航条？使用ul li布局网站网页导航必要性

    会布局的都知道网站导航条布局非常重要,可能一个导航条最终布局效果有时可以使用ul li列表标签布局,有时可以不用ul li布局,而是直接一个div盒子里直接放锚文本超链接的栏目名称,也能实现,看下图. ...

  5. 使用CSS把ul,li制作成表格

    查看效果:http://hovertree.com/texiao/css/7.htm 具体实现请看样式部分. 完整代码: <!DOCTYPE html> <html> < ...

  6. 对Ul下的li标签执行点击事件——如何获取你所点击的标签

    问题所来:做项目时,一般的数据都是用循环动态加载出来的,结构都是一样的,只是绑定的值不同,如何对相同的标签做处理的问题就来了. 例如:点谁就显示谁的数值 <ul > <li id=& ...

  7. html-2, a img ul li ol dl dt dd 标签与列表标签的简单使用

    <!-- a:  a{ /*清除a标签的下划线*/ text-decoration: none; }  (1)超链接 href 超链接的地址 target: _self 默认 在当前中打开链接地 ...

  8. Jquery和JS获取ul中li标签（转）

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  9. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

随机推荐

  1. TestNg依赖详解(三)------灵活的文件配置依赖

    配置型的依赖测试,让依赖测试不局限于测试代码中,在XML文件中进行灵活的依赖配置 原创文章,版权所有,允许转载,标明出处:http://blog.csdn.net/wanghantong Javaco ...

  2. HTML5(常用的表单控件)

    常用的HTML5的表单控件: Input 类型: color color 类型用在input字段主要用于选取颜色,如下所示: 从拾色器中选择一个颜色: 选择你喜欢的颜色: <input type ...

  3. while的使用

    我在用while的时候, while(当这个对象的首个字是汉字){ 执行语句 } 我发现出现死循环的现象 其实我要再添加一个条件,就是不管是不是上述条件都成立,最终还是要结束的.

  4. BZOJ4383 : [POI2015]Pustynia

    设$a$到$b$的边权为$c$的有向边的含义为$b\geq a+c$,则可以根据题意构造出一张有向图. 设$f[x]$为$x$点可行的最小值,$a[x]$为$x$位置已知的值,则$f[x]=\max( ...

  5. 新提交审核app保留检查更新入口将被拒绝（读取App Store 版本号的）

    3月起要求关闭所有App内的检查更新功能,苹果App Store将向用户自动提示更新,新版本提交审核版本如果保留检查更新入口,审核时,将被拒绝. 以上拒绝的方案: 读取App Store的版本号. 替 ...

  6. ACM 取石子（七）

    取石子(七) 时间限制:1000 ms  |  内存限制:65535 KB 难度:1   描述 Yougth和Hrdv玩一个游戏,拿出n个石子摆成一圈,Yougth和Hrdv分别从其中取石子,谁先取完 ...

  7. POJ 2402 Palindrome Numbers

    题目链接 水题,LA我居然没找到在那里. #include <cstdio> #include <cstring> #include <string> #inclu ...

  8. BZOJ4518: [Sdoi2016]征途

    Description Pine开始了从S地到T地的征途. 从S地到T地的路可以划分成n段,相邻两段路的分界点设有休息站. Pine计划用m天到达T地.除第m天外,每一天晚上Pine都必须在休息站过夜 ...

  9. HDU 1251 Trie树模板题

    1.HDU 1251 统计难题  Trie树模板题,或者map 2.总结:用C++过了,G++就爆内存.. 题意:查找给定前缀的单词数量. #include<iostream> #incl ...

  10. 使用C#实现FTP的文件上传和下载【转】

    参考博文:http://blog.163.com/mity_rui@126/blog/static/1098136182013101525615577/