<!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. 在64位Win7环境+64位JDK下，运行64位Eclipse，提示“Failed to load the JNI shared library”错误，提示jvm.dll不对

    -startup plugins/org.eclipse.equinox.launcher_1.2.0.v20110502.jar --launcher.library plugins/org.ecl ...

  2. git 分支合并 强制合并

    常用的提交流程git add *.XXXgit commit -m "备注....." # 提交到本地分支git fetch git merge #"合并远程分支情况,如 ...

  3. python 自动拉起进程脚本

    cat /usr/local/ssdb/moniter_ssdb.py #!/usr/bin/env python import os import sys import commands #ssdb ...

  4. 这次真的忽略了一些ActiveMQ内心的娇艳

    好久没总结了,内心有点空虚了,所以今天主要给园里的朋友们分享一点儿这几天使用ActiveMQ过程中踩过的小坑,虽然说这东西简单易用,代码几行配置也就几行,问题不大但是后果有点严重,所以就要必要总结一下 ...

  5. PAM - 可插拔认证模块

    1.为什么要使用PAM 为了让用户更合理地使用系统,应用程序或服务(如sshd.login.su.password.ftp等)不可避免地需要对用户进行安全认证,若按照各自的规则去配置非常耗费时间和精力 ...

  6. TFboy养成记 多层感知器 MLP

    内容总结与莫烦的视频. 这里多层感知器代码写的是一个简单的三层神经网络,输入层,隐藏层,输出层.代码的目的是你和一个二次曲线.同时,为了保证数据的自然,添加了mean为0,steddv为0.05的噪声 ...

  7. python自动发邮件库yagmail

    #### 一般发邮件方法 我以前在通过Python实现自动化邮件功能的时候是这样的: import smtplib from email.mime.text import MIMEText from ...

  8. 读Kafka Consumer源码

    最近一直在关注阿里的一个开源项目:OpenMessaging OpenMessaging, which includes the establishment of industry guideline ...

  9. 爱立信开始大规模mesh网络测试

    mesh网络可谓是物联网之关键,相较于传统有线技术,无线连接的mesh网络实施成本较低,而且更具有适应性和可扩展性,让高通信量的应用更加可靠. 虽然Thread和ZigBee等细分技术也能提供标准化的 ...

  10. Ocelot网关

    Ocelot是一个.net core框架下的网关的开源项目,下图是官方给出的基础实现图,即把后台的多个服务统一到网关处,前端应用:桌面端,web端,app端都只用访问网关即可. Ocelot的实现原理 ...