查看效果:http://hovertree.com/texiao/css/7.htm

具体实现请看样式部分。

完整代码:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>使用CSS把ul,li制作成表格-何问起</title><base target="_blank" />
<meta charset="utf-8" />
<style>.hovertreeulli ul{list-style:none;width:300px;border:solid 1px gray;padding:0px}
.hovertreeulli li{margin-left:0px;width:99%;border-bottom:1px dotted gray;text-align:center;line-height:30px}
a{color:blue;text-decoration:none}</style>
</head>
<body>
<div><h2>何问起</h2>
<h3>使用CSS把ul,li制作成表格</h3>
</div>
<div class="hovertreeulli">
<ul>
<li><a href="http://hovertree.com/">首页</a></li>
<li><a href="http://hovertree.com/map/">网站地图</a></li>
<li><a href="http://hovertree.com/menu/hovertreecms/">HoverTreeCMS</a></li>
<li><a href="http://hovertree.com/menu/texiao/">特效</a></li>
<li><a href="http://cms.hovertree.com/">CMS在线预览</a></li>
<li><a href="http://hovertree.com/hvtart/bjae/74cc61ed089a2991.htm">jQuery图片列表鼠标经过遮罩显示文字</a></li>
<li><a href="http://hovertree.com/hvtart/bjae/9gjkwp4f.htm">原文</a></li>
</ul>
</div>
</body>
</html>

web前端: http://www.cnblogs.com/jihua/p/webfront.html

使用CSS把ul,li制作成表格的更多相关文章

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

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

  2. css ul li 制作导航条

    <html> <head> <style> .test ul{list-style:none;} .test li{float:left; width:100px; ...

  3. css控制UL LI 的样式详解

    用<ul>设置导航 <style> #menu ul {list-style:none;margin:0px;} #menu ul li {float:left;} </ ...

  4. div+css(ul li)实现图片上文字下列表布局

    css样式表代码: html布局代码: 效果图: html布局部分,可根据自己需要添加对应的div即可. 1.CSS关键样式单词解释 1).ul.imglist{ margin:0 auto; wid ...

  5. css控制UL LI 的样式详解(推荐)

    代码如下: <div id="menu"> <ul> <li><a href="#">首页</a>& ...

  6. DIV+CSS布局重新学习之css控制ul li实现2级菜单

    竖状菜单: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  7. CSS中ul li居中的问题

    一直以为对ul li居中对齐已经掌握了.但最近做项目时发现之前li的float:left方法显然有一个问题,就是无法居中(水平),只能使用padding-left或margin-right的方法方法来 ...

  8. css 中ul li 与 ul>li的区别

    ul li :后代选择器,ul 里所有的 li 元素,包括 ol 里的 li ; ul>li :子代选择器,下一级的DOM节点,不包括 ol 里的 li . ul>ol>li :子代 ...

  9. 将word文件快速转换成表格的技巧

    最近烦心事还真是很多,世界买家网最近就遇到了很多烦心事. 从www.buyerinfo.biz网站中的数据导出为csv格式的文件,我导出了buyer的数据,那怎么把它制作成表格呢? 找了下,发现还是比 ...

随机推荐

  1. iOS开发-捕获程序崩溃日志

    iOS开发中遇到程序崩溃是很正常的事情,如何在程序崩溃时捕获到异常信息并通知开发者,是大多数软件都选择的方法.下面就介绍如何在iOS中实现: 1. 在程序启动时加上一个异常捕获监听,用来处理程序崩溃时 ...

  2. 薪资至少10K的一道题,你能拿下吗

    我所了解的华为: 应届本科生8k+ 应届硕士生10k+ 应届博士生12k+ 看到后什么感想?有没有只恨生不逢时运不佳的感觉? 很多人做3年多甚至更久,才能达到这个薪资水平,还不如一个新生. 在我看来, ...

  3. LINQ系列:Linq to Object投影操作符

    投影是指在将序列中的元素转换为一个自定义形式的操作.投影操作符Select和SelectMany用于选择出赋予了适当功能的值.SelectMany操作符可以处理多个集合. LINQ表达式语法: 1. ...

  4. 【Win10 应用开发】扫描和连接Wi-fi网络

    老周今天带大家去“扫雷”了,别当真,是扫描并连接指定无线网络,时尚一点叫Wi-fi. 所以,今天的任务要求你的设备至少有1张无线网卡,目前老周没看到过有N张无线网卡的设备.像笔记本.平板等设备都可以, ...

  5. Create views of OpenCASCADE objects in the Debugger

    Create views of OpenCASCADE objects in the Debugger eryar@163.com Abstract. The Visual Studio Natvis ...

  6. 深入理解javascript中的动态集合——NodeList、HTMLCollection和NamedNodeMap

    × 目录 [1]NodeList [2]HTMLCollection [3]NamedNodeMap[4]注意事项 前面的话 一说起动态集合,多数人可能都有所了解.但是,如果再深入些,有哪些动态集合, ...

  7. ASP.NET MVC之如何看待内置配置来提高性能优化(四)

    前言 前几篇我们比较基础的讲了下MVC中的知识,这一节我们穿插点知识,讲讲MVC中我们可以提高性能的办法. Razor视图引擎优化(优化一) 我们知道默认情况下配置MVC去解析一个视图会首先约定通过查 ...

  8. PHP+MySQL代码部署在Linux(Ubuntu)上注意事项

    最近帮同学做一个网站,同学买的是阿里云服务器,Linux发行版是Ubuntu12.04.我在本地把程序写好,都调试好了.然后他让我自己发布和部署.之前在大学里上操作系统课程时,也用过一段时间的Ubun ...

  9. MongoDB一键式安装工具

    一. 需求 不知道有多少人会像我一样,会把MongoDB用在客户端应用上,不过我感觉应该非常少.于是,我就希望能在客户机器上尽可能简单方便的安装MongoDB.所以以下是我的一些取舍: 1. 我只使用 ...

  10. SharePoint Server 2013 让上传文件更精彩

    新版的SharePoint 2013 提供了多种上传与新建文件的方式,对于与系统集成紧密的IE来上传文档更加方便 使用IE开启SharePoint地址 Figure 1打开文档库,在"新颖快 ...