今天学习了无序列表和有序列表和使用HTML5创建表格
ol建立有序列表,该列表可以用设置type=”A/a”
其语法架构为
<ol>
<li></li>
<li></li>
</ol>
Ul建立无序列表, 该列表可以用设置type=” disc/circle/square”
其语法架构为
<ul>
<li></li>
<li></li>
</ul>
创建表格其基本属性有
Cellspacing:定义边框与边框的间距大小
Cellpadding:定义边框与内容的间隙大小
Bgcolor:定义表格的背景颜色
Width:定义表格的宽度
Height:定义表哥的高度
Caption:创建表格的标题
Colspan:合并左右单元格
Rowspan:合并上下单元格
Th:定义标题内容
Dd/dl:自定义列表
Mark:重点提示
附:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>20161018</title>
</head>
<body>
<ul>
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
<li>姑苏城外寒山寺</li>
<li>夜半钟声到客船</li>
</ul>
<ul type="disc">
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
</ul>
<ul type="circle">
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
</ul>
<ul type="square">
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
</ul>
<ol type="A">
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
<li>姑苏城外寒山寺</li>
<li>夜半钟声到客船</li>
</ol>
<ol>
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
<li>姑苏城外寒山寺</li>
<li>夜半钟声到客船</li>
</ol>
<!-- 建立嵌套的ul/ol列表 -->
<ol type="A">
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
<ul>
<li>月落乌啼霜满天</li>
<li>江枫渔火对愁眠</li>
</ul>
<ol type="a">
<li>姑苏城外寒山寺</li>
<li>夜半钟声到客船</li>
</ol>
</ol>
<!-- 自定义列表 -->
<dl>
<dt>电脑</dt>
<dd>是一种能够按照程序运行的电子设备</dd>
<dt>显示器</dt>
<dd>以视觉方式显示信息的装置</dd>
</dl>
<!-- 使用HTML5创建表格
<table>...</table> - 定义表格
<tr> - 定义表行
<th> - 定义表头
<td> - 定义表元
其语法结构为
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
-->
<!-- 创建一个三行三列的表格 -->
<table border="2px" cellpadding="2px" cellspacing="20px" bgcolor="DDSSAA">
<caption>创建一个三行三列的表格</caption>
<tr>
<th>姓名</th>
<th>学号</th>
<th>成绩</th>
</tr>
<tr>
<td align="left">1</td>
<td align="center">1</td>
<td align="rigth">1</td>
</tr>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td align="left">1</td>
<td align="center">1</td>
<td align="rigth">1</td>
</tr>
</table>
<br/>
<table border="2px" cellpadding="2px" cellspacing="20px" bgcolor="pppppp">
<caption>创建一个一行三列表格</caption>
<tr>
<td bgcolor="red">1</td>
<td bgcolor="green">1</td>
<td bgcolor="blue">1</td>
</tr>
</table>
<!-- 单元格的合并 -->
<br/><br/>
<table width="40" height="40" border="1" cellpadding="20px" cellspacing="3px">
<tr>
<td colspan="2" align="center">1</td>
<td rowspan="2" align="center">2</td>
</tr>
<tr>
<td rowspan="2" align="center">3</td>
<td align="center">5</td>
</tr>
<tr>
<td colspan="2" align="center">4</td>
</tr>
</table>
<br/><br/>
</body>
</html>
今天学习了无序列表和有序列表和使用HTML5创建表格的更多相关文章
- HTML无序列表和有序列表
html无序列表<ul><li></li></ul> ul属性设定:<ul type="square"> 常用属性值 ...
- 我教女朋友学编程html系列(7)—Html无序列表、自定义列表、有序列表及常用例子
昨天写的那篇文章<我教女朋友学编程Html系列(6)—Html常用表单控件>,基本上有1000人左右看了,那边文章是我站在前人的肩膀上修改来的,添加了截图和说明,合并了例子,使之更容易被初 ...
- HTML基础标签的综合应用案例(颜色、斜体、加粗、下划线、a标签、无序列表、有序列表)
什么是HTML l HTML(HyperText Mark-up Language)即超文本标记语言或超文本标签语言. l 何为超文本:“超文本”可以实现页面内可以包含图片.链接,甚至音乐.程序等. ...
- 前端学习 -- Css -- 有序列表和无序列表
列表就相当于去超市购物时的那个购物清单, 在HTML也可以创建列表,在网页中一共有三种列表: 1.无序列表 2.有序列表 3.定义列表 无序列表 - 使用ul标签来创建一个无序列表 - 使用li在ul ...
- HTML&CSS基础学习笔记1.14—有序列表及列表嵌套
我们上篇讲到了无序列表,那么今天就来看看有序列表和他们的组合嵌套使用吧. 有序列表 现在我们要做那堆杂事了,但是发现这么多杂事,先做哪个好呢?于是我们给这堆杂事弄个优先级排序,让我们能够按照顺序做下去 ...
- Python中将字典转换为有序列表、无序列表的方法
说明:列表不可以转换为字典 1.转换后的列表为无序列表 a = {'a' : 1, 'b': 2, 'c' : 3} #字典中的key转换为列表 key_value = list(a.keys()) ...
- 【学习笔记】HTML基础:列表、表格与媒体元素
一.列表是信息资源的一种展现形式,它可以使信息结构化和条理化,并以列表的样式显示出来,以便浏览者能够快速的获取相应的信息. 1.无需列表 <ul> <li>第一项</li ...
- 9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)
网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...
- 9月11日上午HTML有序列表、无序列表、网页的格式和布局
样式表 六.列表方块 1.有序列表变无序列表 <ol> <li>张店</li> <li>桓台</li> <li>淄川</l ...
随机推荐
- SQL注入攻击及防范
一.什么是SQL注入1.SQL注入的定义 SQL注入(SQL Injection) 利用了程序中的SQL的漏洞,进行攻击的方法. 2.SQL注入举例 1)利用SQL语法错误获取数据库表的结构 ...
- 关于java对象的思考
不可变对象和类 由不可变类创建的对象就是不可变对象,要使一个类成为不可变的,它必须满足下面的需求: 所有数据域都是私有的 没有修改器方法 没有一个访问器的方法,它会返回一个指向可变数据域的引用 看下面 ...
- homework-02 一坑到底的最大和联通图
你在这个作业中学到了什么? 有什么好的设计值得分享? 感想如何 (太容易 / 太难 / 太无趣)? 我觉得这套题目有点偏难,我不像大牛那样,有很多算法可以选择,我是0算法基础的,所以遇到这题我一个 ...
- hdoj 2097 Sky数
Sky数 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- [iOS基础控件 - 4.1] APP列表
需求 1.以N宫格的形式展示应用信息 2.APP信息包括图标.名字.下载按钮 3.使用尽可能少的代码,从plist读取app信息,计算每个app图标的位置尺寸信息 A.思路 1.UI布局:N宫 ...
- 转载总结 C# 多态(虚方法,抽象,接口实现)
前言:我们都知道面向对象的三大特性:封装,继承,多态.封装和继承对于初学者而言比较好理解,但要理解多态,尤其是深入理解,初学者往往存在有很多困惑,为什么这样就可以?有时候感觉很不可思议,由此,面向对象 ...
- webServices
引用项目的配置文件: <system.serviceModel> <bindings> <basicHttpBinding> <!--旅游供应--> & ...
- 流弊博客集锦(updating)
1.http://ifeve.com/ 2.淘宝的 code project http://code.taobao.org/ http://blog.csdn.net/tenfyguo/article ...
- The maximum number of cell styles was exceeded. You can define up to 4000 styles
POI操作Excel中,导出的数据不是很大时,则不会有问题,而数据很多或者比较多时, 就会报以下的错误,是由于cell styles太多create造成,故一般可以把cellstyle设置放到循环外面 ...
- ALERT日志中常见监听相关报错之中的一个:ORA-609错误的排查
參考MOS文档有: Troubleshooting Guide ORA-609 : Opiodr aborting process unknown ospid (文档 ID 1121357.1) Al ...