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. HttpHandler与HttpModule的用处与区别

    问题1:什么是HttpHandler? 问题2:什么是HttpModule? 问题3:什么时候应该使用HttpHandler什么时候使用HttpModule? 答案1:HttpHandler,Http ...

  2. 8、显示程序占用内存多少.txt

    方法一: 要加单元 PsAPI procedure TForm1.tmr1Timer(Sender: TObject); begin edt1.Text:= format('memory use: % ...

  3. WPF在DLL中读取Resource的方法

    WPF是个用户控件,被WinForm调用.而WinForm是在一个DLL类库中被调用.试了很多方法,都无法将Resource中的图读进程序.用下面的方法总算实现了.   /根据图片的名称,从资源中找到 ...

  4. hadoop 流streaming跑python程序

    先放上命令: hadoop jar /usr/hadoop-/contrib/streaming/hadoop-streaming-.jar -mapper mapper.py -file mappe ...

  5. view not attached to windows manager与This Toast was not created with Toast.makeText()

      http://blog.sina.com.cn/s/blog_474928c90100x871.html     public class Ex04_1Activity extends Activ ...

  6. Posterior visual bounds retrieval for the Plato framework

    Plato is a MVVM compliant 2D on-canvas graphics framework I've been designing and implementing for d ...

  7. Android -- ListView(SimpleAdapter) 自定义适配器

    aaarticlea/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBAQEBA ...

  8. [iOS-UI]给输入框添加清除按钮的代码

    UIButton *clearButton = [self.textField valueForKey:@"_clearButton"]; [clearButton setImag ...

  9. 如何在Linux中使用rz/sz工具进行文件传输

    在Linux中,使用rz/sz工具能够进行Linux和windows之间的文件传输,那么要如何使用rz/sz工具工具呢?下面小编就给大家介绍下Linux下如何使用rz/sz工具进行文件传输,一起来学习 ...

  10. java分享第五天（数组）

    1 声明数组变量: double[] mylist;    or double mylist[]; 2 创建数组: 可以通过使用new运算符使用以下语法创建一个数组: arrayRefVar=new ...