<!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title></title>

     <link rel="stylesheet" type="text/css" href="style.css">

 </head>

 <body>

     <table border=""><!--border属性只要设置，值为空也能显示边框-->

         <caption>我的表格</caption>

         <tr><td>单元格单元格单元格单元格单元格单元格</td><td>单元格</td><td>单元格</td></tr>

         <tr><td>单元格</td><td></td><td>单元格</td></tr>

         <tr><td>单元格</td><td>单元格</td><td>单元格</td></tr>

     </table>

     <ul>

         <li>无序列表项1</li>

         <li>无序列表项2</li>

         <li>无序列表项3</li>

     </ul>

     <ol>

         <li>有序列表项1</li>

         <li>有序列表项2</li>

         <li>有序列表项3</li>

     </ol>

 </body>

 </html>
 table{

     width: 200px;

     border-collapse:;/*默认值separate双边框；collapse单一边框。*/

     border-spacing: 2px;/*默认值2px；当border-collapse为collapse时此设置有效果，双边框的间距*/

     caption-side: bottom;/*默认值top表格之上，bottom表格之下。*/

     empty-cells:hide;/*默认值show显示空单元格；hide隐藏空单元格，此时需要border-collapse设置为separate才能看到效果*/

     table-layout: ;/*默认值auto；fixed列宽由表格宽度和列宽设定*/

 }

 ul{

     list-style-type:upper-alpha;/*none无标记；disc默认实心圆；circle空心圆；square实心方块；list-style-type属性值在ul和ol上通用。*/

     list-style-position: ;/*标志位置，默认outside，可设inside*/

     /*list-style-image: url("img/鸟1.jpg");*//*默认值none*/

 }

 ol{

     list-style-type:upper-alpha;/*默认decimal数字；decimal-leading-zero以01开头的数字；lower-roman小写罗马数字；upper-roman大写罗马数字；lower-alpha小写字母；upper-alpha大写字母；日文、拉丁文……等其他字符，可查CSS手册。*/

     list-style-position: ;

     /*list-style-image: url("img/鸟1.jpg");*/

     list-style: circle inside;/*此属性可同时设置其他三个属性值*/

 }

【CSS3】表格、列表的更多相关文章

  1. 【转】一张图解析FastAdmin中的表格列表的功能

     一张图解析FastAdmin中的表格列表的功能 功能描述请根据图片上的数字索引查看对应功能说明. 1.时间筛选器如果想在搜索栏使用时间区间进行搜索,则可以在JS中修改修改字段属性,如 {field: ...

  2. 循序渐进VUE+Element 前端应用开发(5）--- 表格列表页面的查询，列表展示和字段转义处理

    在我们一般开发的系统界面里面,列表页面是一个非常重要的综合展示界面,包括有条件查询.列表展示和分页处理,以及对每项列表内容可能进行的转义处理,本篇随笔介绍基于Vue +Element基础上实现表格列表 ...

  3. 7.css3表格、列表、边框的样式设置--list/border

    1.css表格: ①Border-collapse是否把表格边框合并为单一的边框.Separate默认值,collapse合并. ②Border-spacing分割单元格边框的距离. ③Caption ...

  4. html 和 html5（一）（表格 | 列表 | 提交按钮 | 单选 |复选 | 框架 | 脚本 | html字符实体 ）

    一.框架 使用iframe来显示目录链接页面 iframe可以显示一个目标链接的页面 目标链接的属性必须使用iframe的属性,如下实例: 实例 <iframe src="demo_i ...

  5. 一张图解析FastAdmin中的表格列表的功能

    大图: 1.默认生成的CRUD是没有菜单名称和描述显示的,如果需要显示则可以在后台修改,权限管理->菜单规则,给对应菜单的添加上备注信息后即可显示,支持HTML 2.TAB过滤选项卡 在一键生成 ...

  6. 用CSS3把列表项目反转显示

    忘了哪儿的一个题目来着,说是把 一个列表 给翻转序列显示,比如 : 有一个列表如图: 翻转为  回复里面有人机智的使用 CSS3 的 transform:rotate(180deg); 实现了,引发众 ...

  7. html基础-表格-列表（4）

    今天准备为大家准备了表格和列表. 一.文章有各种数据的表格这个网页也不例外. (1).标签意思 <table>----------------------表格开始 <caption& ...

  8. css3—产品列表之鼠标滑过效果

    <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" /> <title&g ...

  9. css3表格样式

    <caption>  关于表格存储内容的描述或总结. 1.border-spacing:0;border-spacing 属性设置相邻单元格的边框间的距离(仅用于“边框分离”模式). 2. ...

  10. HTML表格列表简介

    HTML简介: html列表: ol标签:order list 有序列表. ul标签:unorder list 无序列表. li标签:list item 列表项. style属性: 标签内写css表达 ...

随机推荐

  1. 完美解决--用VS中的Git做代码管理器，与他人共享代码

    1.创建代码仓库,这里说一下为什么要创建仓库,Git不能够作为源代码管理器,vs中自带的也只能够在本地进行管理,要和他们共享的话必须要有服务器端去存储代码,类似于SVN,它就有客户端和服务器端,这里推 ...

  2. Java 读取 .properties 配置文件的几种方式

    Java 开发中,需要将一些易变的配置参数放置再 XML 配置文件或者 properties 配置文件中.然而 XML 配置文件需要通过 DOM 或 SAX 方式解析,而读取 properties 配 ...

  3. JVM菜鸟进阶高手之路十四：分析篇

    转载请注明原创出处,谢谢! 题目回顾 JVM菜鸟进阶高手之路十三,问题现象就是相同的代码,jvm参数不一样,表现的现象不一样. private static final int _1MB = 1024 ...

  4. Python 学习之路

    这个是我学python以来,写的的第一个小游戏,写的不好 题目:石头剪刀布 主要有两个难度 在普通模式,电脑是随机出 在噩梦下,就是不管你出什么,电脑都会赢你,牛逼吧 #Author:陈浩彬 impo ...

  5. C#学习笔记——数据库篇（1）

    C#的数据连接分同样分三步走 .连接语句 string str_conn = "sever = localhost;database = smaple;usid = sa;pwd = 123 ...

  6. C语言之二分猜数字游戏

    #include <stdio.h>#include <windows.h>#include<string.h>int main() { int oldprice, ...

  7. iscroll遇到的两个坑

    最近移动端闪付遇到的两个坑做下总结: 1.使用iscroll后,滑动并没有生效 解决方案: 首先要查看:结构是否正确: <div id="wrapper">   //w ...

  8. JAVA的向上转型和向下转型怎么理解呢？

    在定义中是子类向父类转型称为向上转型,父类向子类转型是向下转型(必须先向上转型过,才能向下转型), 但是在下面类定义后,我得到的结果却不同.求大佬解惑 class superclass{ public ...

  9. WCF、WebAPI、WCFREST、WebService之间的区别和选择

    转载翻译,原文:http://www.dotnet-tricks.com/Tutorial/webapi/JI2X050413-Difference-between-WCF-and-Web-API-a ...

  10. 原生javascript选项卡

    js选项卡是一个常用的实现.这里我们将用原生js来将其给予实现. 首先html代码: <div id="container"> <input type=" ...