今天准备为大家准备了表格和列表。

一、文章有各种数据的表格这个网页也不例外。

（1）、标签意思　

<table>----------------------表格开始
　　<caption></caption>-------表格标题
　　　　<tr>--------------------行开始标签 
　　　　　　<th></th>-------------表头 
　　　　　　<tb></tb>-------------单元格 
　　　　</tr>-------------------行结束标签 
</table>---------------------表格结束

（2）、表格样式

　　cellpadding 属性设置单元格边框和单元格内容的距离。
　　cellspacing 属性设置单元格之间的距离。
　　border 属性表示边框  
      width 设置表格的宽。

      height 设置表格的高。 [注]：高这个属性最好不小给 table 中写，让它自动撑开就好。但这个可以给 tr 给每行需要的高度

代码

<html>

     <head>

	<title>表格</title>

     </head>

     <body>

	<table border="1px" width="500px" cellpadding="10px" cellspacing="10px">

　　		<caption>表格标题</caption>

　　　　		<tr height="50px">

　　　　　　		<th>表头</th>

　　　　　　		<th>表头</th>

　　　　		</tr>

		<tr>

　　　　　　		<td>单元格</td>

　　　　　　		<td>单元格</td>

　　　　		</tr>

	</table>

     </body>

</html>

效果

二、无序列表

<ul> 无序列表属性：
　　<li></li> 　　 （type属性） <ul type="dise">（是无序列表前边小黑点的属性）
</ul> 　　　　 　　 disc(实心圆) circle（空心圆） square（方块）

代码

<html>

     <head>

	<title>表格</title>

     </head>

     <body>

	 <ul type="circle">

 		<li>无序列表</li>

 	 </ul>           

     </body>

</html>

效果　

　

三、有序列表

有序列表：
<ol> 　　　　　　 有序列表属性：
　　<li></li>     （type属性） <ol type="1">
</ol> 　　　　　　 1(按数字1.2.3...往下排) A（按大写字母A.B.C...往下排） a（按小写字母a。b。c....往下排）
　　　　　　　　　　Ⅰ(按大写罗马数字Ⅰ、Ⅱ、Ⅲ.....往下排)
　　　　　　　　　　（start属性）<ol start="2">(表示这个有序列表不是默认的从1开始是从2开始的)

代码

<html>

     <head>

	<title>有序列表</title>

     </head>

     <body>

	  <ol type="A">

   		<li>有序列表</li>

   		<li>有序列表</li>

   		<li>有序列表</li>

 	  </ol>                     

     </body>

</html>

效果 按照A,B,C... 往下排 type 只能写那三种

html基础-表格-列表（4）的更多相关文章

  1. 【共享单车】—— React后台管理系统开发手记：AntD Table基础表格

    前言:以下内容基于React全家桶+AntD实战课程的学习实践过程记录.最终成果github地址:https://github.com/66Web/react-antd-manager,欢迎star. ...

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

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

  3. 1.进入debug模式（基础知识列表）

    1.进入debug模式(基础知识列表)1.设置断点 2.启动servers端的debug模式 3.运行程序,在后台遇到断点时,进入debug调试状态 ========================= ...

  4. Python基础数据类型-列表（list）和元组（tuple）和集合（set）

    Python基础数据类型-列表(list)和元组(tuple)和集合(set) 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 本篇博客使用的是Python3.6版本,以及以后分享的 ...

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

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

  6. python基础之列表list元组tuple

    作者:tongqingliu 转载请注明出处:http://www.cnblogs.com/liutongqing/p/7041763.html python基础之列表list元组tuple 列表li ...

  7. python基础数据类型--列表（list）

    python基础数据类型--列表(list) 列表是我们在后面经常用到的数据类型之一,通过列表可以对数据类型进行增.删.改.查等操作 一列表的增.删.改.查 1增: 1.1增加到最后   append ...

  8. 前端基础-html 列表标签,表格标签,表单标签

    一.列表标签 1.ul(无序列表)标签 ul(unordered list)无序列表,ul下的子元素只能是li(list item),如下示例: <ul> <li>第一项< ...

  9. 【学习笔记】HTML基础：列表、表格与媒体元素

    一.列表是信息资源的一种展现形式,它可以使信息结构化和条理化,并以列表的样式显示出来,以便浏览者能够快速的获取相应的信息. 1.无需列表 <ul> <li>第一项</li ...

随机推荐

  1. jmeter报错

    1.检测服务性能是报超时时问题 解决:因为服务器限制只能域名访问不能用ip+端口访问,但是jmter使用的是IP+端口访问 如图: 所以需要服务器放开这个端口,改成可以使用这个IP+端口访问

  2. HTML+Javascript制作拼图小游戏详解（二）

    上一篇我们说了网页的基本布局.接下来将为大家带来具体的实现方法. 拼图通表格来实现,做一个方形的表格,改变其大小使之如图所示. 试想一下如果我们将一张图片剪成6张分别放入对应位置,然后再把它打乱,这样 ...

  3. Nginx Web服务(一)

    一.Nginx原理介绍 1.1:什么是Nginx Nginx是一个开源的,支持高性能.高并发的WWW服务和代理服务软件 1.2:Nginx的功能特点及应用场合 ① 支持高并发:能支持几万并发连接,特别 ...

  4. 【DB2】How to resolve SQL20249N the statement was not processed with error

    相关链接 https://vinaysdb2blog.blogspot.com/2017/11/how-to-resolve-sql20249n-statement-was-not-processed ...

  5. Java之集合(二十四)ConcurrentLinkedDeque

    转载请注明源出处:http://www.cnblogs.com/lighten/p/7517454.html 1.前言 本章介绍并发队列ConcurrentLinkedDeque,这是一个非阻塞,无锁 ...

  6. JavaMail之-通过邮件激活账号

    关键点就在于: 根据用户的给出的email,给这个email发送一个邮件.这个邮件中应该带有一个激活码?(32位UUID,64位UUID). 大概步骤: 1,  注册功能 - 只要用户注册成功,就给他 ...

  7. Centos 6.5下的OPENJDK卸载和SUN的JDK安装、环境变量配置

    不多说,直接上干货! 说明 图形界面安装,会自带有Centos6.5自带的OPRNJDK!!! *********************************自带的OPENJDK的卸载****** ...

  8. C/C++ -- Gui编程 -- Qt库的使用 -- 使用.ui文件

    1.创建Qt空工程 2.添加Qt设计师界面,无按钮对话框helloqt.ui 3.编辑界面,添加部件,修改对话框对象名为HelloQt <?xml version="1.0" ...

  9. ActiveMQ发布-订阅消息模式

    一.订阅杂志我们很多人都订过杂志,其过程很简单.只要告诉邮局我们所要订的杂志名.投递的地址,付了钱就OK.出版社定期会将出版的杂志交给邮局,邮局会根据订阅的列表,将杂志送达消费者手中.这样我们就可以看 ...

  10. OpenStack-Queens版 实践

    OpenStack简介 OpenStack是一个由NASA(美国国家航空航天局)和Rackspace合作研发并发起的,以Apache许可证授权的自由软件和开放源代码项目. OpenStack是一个开源 ...