<!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. 使用JavaScript生成二维码教程-附qrcodejs中文文档

    使用javascript生成二维码 依赖jquery 需要使用到的库 https://github.com/davidshimjs/qrcodejs DIV <div id="qrco ...

  2. YII2 models非常好用的控制输出数据【重写Fields】

    models里重写Fields真的很好用,用于分类.评论功能 列子:评论表models/Comment.php 1.关联商品表 2.获取父级(即管理员)评论 public function Field ...

  3. 基于Spark和SparkSQL的NetFlow流量的初步分析——scala语言

    基于Spark和SparkSQL的NetFlow流量的初步分析--scala语言 标签: NetFlow Spark SparkSQL 本文主要是介绍如何使用Spark做一些简单的NetFlow数据的 ...

  4. 老男孩Python全栈开发（92天全）视频教程 自学笔记01

    day1课程目录: 开课介绍(1) 开课介绍(2) 开课介绍(3) 电脑简史(1) 电脑简史(2) 计算机结构 day1课程内容梳理: 导师介绍: Alex Li(金角大王):买了一辆特斯拉,喜欢姑娘 ...

  5. 把项目中的那些恶心的无处存储的大块数据都丢到FastDFS之快速搭建

        在我们开发项目的时候,经常会遇到大块数据的问题(2M-100M),比如说保存报表中1w个人的ID号,他就像一个肿瘤一样,存储在服务器哪里都 觉得恶心,放在redis,mongodb中吧,一下子 ...

  6. 详解卷积神经网络（CNN）在语音识别中的应用

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者:侯艺馨 前言 总结目前语音识别的发展现状,dnn.rnn/lstm和cnn算是语音识别中几个比较主流的方向.2012年,微软邓力和俞栋老 ...

  7. Numpy数组的基本运算操作

    一.算术运算符 In [3]: a = np.arange(0,5) Out[3]array([0, 1, 2, 3, 4]) In [4]: a+4 Out[4]: array([4, 5, 6, ...

  8. Mysql实现企业级日志管理、备份与恢复实战

    背景 随着业务的发展,公司业务和规模不断扩大,网站积累了大量的用户信息和数据,对于一家互联网公司来说,用户和业务数据是根基.一旦公司的数据错乱或者丢失,对于互联网公司而言就等于说是灭顶之灾,为防止系统 ...

  9. springboot集成swagger

    对于搬砖的同学来说,写接口容易,写接口文档很烦,接口变动,维护接口文档就更更更烦,所以经常能发现文档与程序不匹配. 等过一段时间就连开发者也蒙圈了 Swagger2快速方便的解决了以上问题.一个能与S ...

  10. php加密字符串超时不可解密

    <?php/** * 加密字符串在指定时间内解密有效 * @param  [type]  $string    明文字符串 * @param  string  $operation 解密值为DE ...