- 第6章 列表与表格——让网站更规整
- 小白前端04-HTML的三个表
- 四、表格标签
- 列表与表格
- 表格绘制_附件_代码
- 06.表格标签
- 04-表格table标签
- 2022-01-18 html第二天
- html列表
- Typora初试
带着问题去看书学习啦~
HTML5＋CSS3＋JavaScript Web 前端开发案例教程（慕课版），微信读书中找到的学习Web前端书籍，第6章开始啦，耶(＾－＾)V
习题
6-1 与定义列表相关的标签有哪些？它们的作用是什么？
<dl>（definition list）定义列表，该元素定义了一个包含术语、定义以及描述的列表。
<dt> 用来定义列表中项目部分的内容。
<dd> 定义描述部分的内容。6-2 有序列表和无序列表的区别是什么？
- 无序列表（Unordered List）：特征在于提供一种不编号的列表方式，在每一个项目文字之前，以符号作为分项标识。
语法：
<ul> <li>第1项</li> <li>第2项</li> … </ul><ul></ul>表示这一个无序列表的开始和结束，<li>则表示一个列表项的开始。
- 有序列表（Ordered List）：默认情况下，有序列表的序号是阿拉伯数字，通过 type 属性可以调整序号的类型，例如将其修改成字母等。
语法：
<ol type=序号类型> <li>第1项</li> <li>第2项</li> <li>第3项</li> … </ol>属性：
属性无序列表常被用于导航等内容，有序列表则被用于网站中需要排序的内容。
6-3 有序列表的序号类型有哪些？
序号类型：
序号类型6-4 在HTML中，绘制一张表格通常需要使用哪几种标签？
<table> 标签
<tr> 标签 （table row）行
<th> 标签 （table header cell）表头单元格
<td> 标签 （table data cell）数据单元格
<thead> 标签
<tbody>标签
<tfoot>标签
语法格式：<table> <tr> <td>单元格内的文字</td> <td>单元格内的文字</td> …… </tr> <tr> <td>单元格内的文字</td> <td>单元格内的文字</td> …… </tr> …… </table><table> 和 </table> 标签分别表示一个表格的开始和结束；而 <tr> 和 </tr> 标签则分别表示表格中一行的开始和结束，在表格中包含几组 <tr> </tr>，就表示该表格为几行；<td> 和 </td> 标签分别表示一个单元格的开始和结束，也可以说表示一行中包含了几列。
6-5 在HTML中，合并单元格有哪两种方式？
- <td colspan="跨的列数">
- <td rowspan="跨的行数">
跨的列数就是这个单元格在水平方向上跨列的个数，跨的行数是指单元格在垂直方向上跨行的个数。
其他
实践了喽，这些真的是需要实际上操作一下，现在的小例子也就抄抄书中，照着敲一遍也是会加深印象的，加油ヾ(◍°∇°◍)ﾉﾞ
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Demo6</title> </head> <body> <p>NBA东部联盟球队排名前四强</p> <ul> <li>多伦多 猛龙</li> <li> 密尔沃基 雄鹿</li> <li>底特律 活塞</li> <li>费城 76人</li> </ul> <p>2018年俄罗斯世界杯四强</p> <ol> <li>法国队</li> <li>克罗地亚队</li> <li>比利时队</li> <li>英格兰队</li> </ol> <table align="center" width="500"> <caption><h2>医院自助排队机</h2></caption> <tbody> <tr align="center" bgcolor="#fff979"> <th width="80">姓名</th> <th width="80">编号</th> <th width="80">科室</th> <th width="80">门室</th> <th width="120">排队人数(人)</th> </tr> <tr align="center" bgcolor="#6bffe1"> <td rowspan="2">王明</td> <!--纵向合并两个单元格--> <td rowspan="2">0203007</td> <!--纵向合并两个单元格--> <td >检验科</td> <td >101室</td> <td>5</td> </tr> <tr align="center" bgcolor="#6bffe1"> <td>放射科</td> <td>403室</td> <td>20</td> </tr> <tr align="center" bgcolor="#ffc3e9"> <td>张晓</td> <td>0103005</td> <td>内科</td> <td>201室</td> <td>3</td> </tr><!--此处省略雷同代码--> </tbody> </table> </body> </html>运行结果：
result补充：两个常用的CSS属性
- list-style-type：设置列表的标志
- list-style-image：设置自定义的列表标志
相关文章
第6章 列表与表格——让网站更规整
带着问题去看书学习啦~ HTML5＋CSS3＋JavaScript Web 前端开发案例教程（慕课版），微信读书中...
小白前端04-HTML的三个表
HTML的三个表：表格、列表和表单。表格：用来显示数据。让数据显示的更整齐规范。列表：用来布局。是页面布局更整齐规...
四、表格标签
一、表格标签 表格是实际开发中非常常用的标签： 1.表格的主要作用： 表格主要，因为它可以让数据显示的非常的规整，...
列表与表格
无序列表：
- 1.控制序列的显示：list-style-type:+形状2.一般讲显示样式置为：none，以...
表格绘制_附件_代码
用法举例:|id||:-:||1||2|id12 壹列表格 俩列表格 叁列表格 肆列表格 伍列表格 陆列表格 柒列...
06.表格标签
一、表格标签的主要作用 表格主要用于显示、展示数据，因为它可以让数据显示的非常的规整，可读性非变强。 表格不是用来...
04-表格table标签
表格作用： 表格是较为常用的一种标签，但不是用来布局，常用来展示表格式数据。 它可以让数据显示的非常的规整，可读性...
2022-01-18 html第二天
表格标签 表格的主要作用 表格主要用于显示、展示数据，因为它可以让数据显示的非常的规整，可读性非常好。特别是后台展...
html列表
无序列表 有序列表 自定义列表 表格 表格书写的快速格式 表格完全格式 单元格合并 细线表格
Typora初试
代码 有序列表 有序列表1 有序列表2 无序列表 无序列表1 无序列表2 表格 图片 引用 引用内容 换行 这是第...
本文标题：第6章 列表与表格——让网站更规整
本文链接：https://www.haomeiwen.com/subject/zuudbltx.html
深度阅读
- 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！
网友评论