`
thunderbow
  • 浏览: 155961 次
  • 性别: Icon_minigender_1
  • 来自: beijing
社区版块
存档分类
最新评论

ul表格制作

阅读更多
<html>
<head>
<title>test</title>
<style type="text/css">
ul{
 margin:0px;
 padding:0px;
 width:200px;
 }
ul li{
 float:left;
 list-style-type:none;
 border-top:#000 solid 1px;
                border-left:#000 solid 1px;
 width:65px;
 }
.border-r{
               border-right:#000 solid 1px;
                }
.border-b{
               border-bottom:#000 solid 1px;
                }
.border-l{
               border-right:#000 solid 1px;
               border-bottom:#000 solid 1px;
                }
</style>
</head>
<body>
<ul>
 <li> </li>
 <li> </li>
 <li class="border-r"> </li>
</ul>
<ul>
 <li> </li>
 <li> </li>
 <li class="border-r"> </li>
</ul>
<ul>
 <li> </li>
 <li> </li>
 <li class="border-r"> </li>
</ul>
<ul>
 <li class="border-b"> </li>
 <li class="border-b"> </li>
 <li class="border-l"> </li>
</ul>
</body>
</html>

 

分享到:
评论

相关推荐

    ul打造表格样式

    这就是"ul打造表格样式"这个主题所探讨的内容。通过使用无序列表`&lt;ul&gt;`和列表项`&lt;li&gt;`来模拟表格,我们可以实现更为自由的CSS样式定制,同时保持内容的语义清晰。 首先,我们需要理解`&lt;ul&gt;`和`&lt;li&gt;`元素的基本用法...

    12次网页制作中上传,表格布局网页

    3. **列表和图象**:在"列表和图象1"部分,我们可能会学习如何使用无序列表(ul)、有序列表(ol)和定义列表(dl)来组织信息。图象的使用包括设置`&lt;img&gt;`标签,指定src属性指向图像源,alt属性提供替代文本,以及...

    超简单!使用CSS制作圆角表格 3步搞定

    其中,制作圆角表格是一项常见的需求,尤其在追求现代感与用户友好体验的设计中。本文将详细介绍如何通过简单的三步骤,利用CSS来实现圆角表格的制作。 ### 第一步:设置基本CSS样式 首先,我们需要定义一些基本的...

    通过css动画实现一个表格滚动轮播效果

    css动画的一个应用,与此前的css走马灯同样的内容。只是一次不同的应用,具体实现如下 &lt;ul class=header&gt; 序号 姓名 年龄 性别 专业 &lt;/ul&gt;

    ul li内容宽度的问题的解决方案

    在网页布局中,`&lt;ul&gt;` 和 `&lt;li&gt;` 元素常常被用来创建列表,而内容宽度的问题在不同浏览器间存在兼容性差异,尤其是IE6。这个问题主要涉及到`&lt;li&gt;`元素的宽度自适应和跨浏览器兼容性。 在IE6中,如果设置`&lt;li&gt;`的...

    ul 1581线规电线电缆软线

    15. **热压变形中有外被的样品做管状试样的条件**:规定了有外被的样品制作管状试样的具体条件,以确保试验的有效性和可比性。 16. **Mppe-PE材质的参照**:增加了Mppe-PE材质的参照,拓展了标准的适用范围。 17. ...

    利用UL、Li+CSS属性制作无表格实用菜单导航效果

    当项目列表的项目符号可以通过list-style-type设置为none时,制作各式各样的菜单、导航条成了项目列表的最大用处之一,通过各种CSS属性变换可以达到很多意想不到的导航效果。本实例效果如下图所示:   建立HTML相关...

    Ztree+treeTable实现 Java实现 树形菜单 树形表格

    你需要定义一个`ul`元素作为树的容器,并在JavaScript中设置相应的配置项,例如节点的展开/关闭行为、节点点击事件等。同时,你需要为每个节点提供ID、父ID、名称等属性,形成JSON数据结构,供Ztree解析。 2. **...

    如何用angularjs制作一个完整的表格

    在本文中,我们将探讨如何使用AngularJS来创建一个完整的表格。AngularJS是一个强大的JavaScript框架,它简化了数据绑定和交互式Web应用的开发。在这个示例中,我们结合了Bootstrap的样式来提升表格的视觉效果,并...

    css制作有立体效果的表格

    下面我们将深入探讨如何使用CSS来制作一个具有立体感的表格。 首先,让我们解析给定的CSS代码片段: ```css .aa { margin: 100px; } ul { width: 80px; float: left; margin: 0px; } .aa li a { border: 1...

    HTML网页制作自制LOL页面(导航栏,小特效等等).zip

    然后,通过`&lt;ul&gt;`和`&lt;li&gt;`标签创建无序列表,每个`&lt;li&gt;`代表一个导航链接。为了让导航栏更美观,可以添加CSS(Cascading Style Sheets)样式,比如设置背景色、文字颜色、浮动效果以及响应式布局,以适应不同屏幕...

    网页制作 PPT教程

    此外,教程可能还会涉及表格的创建,使用、、和等标签,以及如何创建表单以收集用户信息,使用、、等元素。表单是网页交互的重要组成部分,常用于登录、注册、调查问卷等场景。 对于进阶学习者,教程可能会涵盖...

    第二部分 列表与表格1.doc

    在网页设计中,列表和表格是两种非常重要的元素,它们用于组织和呈现信息。本教程主要关注HTML中的列表和表格的使用,适用于网页设计初学者和爱好者,也适合作为教师的教学材料或从业人员的参考。 首先,我们来看...

    ul和li 基本用法分析

    6. **制作简单表格**: - 通过设置`&lt;ul&gt;`和`&lt;li&gt;`的宽度,可以模拟简单的表格布局。例如,若`&lt;ul&gt;`宽度为300px,每个`&lt;li&gt;`宽度为100px,则会形成3列的布局。 - 示例: ```css ul { width: 300px; } li { ...

    第二部分 列表与表格2.doc

    HTML是用于创建网页的标准标记...通过练习,如制作树形菜单、模拟考试试卷和易趣商品列表,你可以深入理解并熟练运用这些HTML元素。记住,实践是检验学习成果的最好方式,不断练习和实验,你的网页设计技能将日益精进。

    网页制作常用知识(《网页制作与网站建设(何秀芳)》)

    3. 表格和列表:`&lt;table&gt;`、`&lt;tr&gt;`、`&lt;td&gt;`用于表格,`&lt;ul&gt;`、`&lt;ol&gt;`和`&lt;li&gt;`用于无序和有序列表。 4. 图像和多媒体:`&lt;img&gt;`插入图片,`&lt;audio&gt;`和`&lt;video&gt;`处理音频和视频。 二、CSS(层叠样式表) CSS是用于控制...

    网页制作完全手册.rar

    `&lt;h1&gt;`到`&lt;h6&gt;`用于创建标题,`&lt;p&gt;`表示段落,`&lt;a&gt;`创建超链接,`&lt;img&gt;`插入图像,`&lt;ul&gt;`和`&lt;ol&gt;`定义无序和有序列表,以及`&lt;table&gt;`构建表格等。理解并熟练使用这些标签是制作静态网页的关键。 CSS(Cascading ...

Global site tag (gtag.js) - Google Analytics