首页 > 代码库 > 初识HTML-第二章- 列表，表格，框架
初识HTML-第二章- 列表，表格，框架
一，列表的分类
1，无序列表
通常使用项目符号作为列表项的前缀。符号有三种属性1,默认值为实体圆心 type="disc" 2，实体方心 type="square" 3,空心圆 type="circle"
语法
<ul type="需要的符号">声明这是个无序列表 并设置列表符号的样式
<li></li>作为列表语句的开始
</ul>
2，有序列表
每个列表项目前，有顺序的符号表示。符号三种属性：1，是数字 type="1" 2，字母type="A或者a" 3，罗马数字 type="I或者i" 表示大小写
语法
<ol>声明这是个有序列表 并设置列表符号的样式
<li></li>
</ol>
3，定义列表
项目列表及其注释的组合。不会在项目前添加任何符号
语法
<dl>声明定义列表
<dt></dt>定义列表项
<dd></dd>定义内容
</dl>
小结：在实际的网页应用中，无序列表比有序列表应用更加广泛。定义列表适用于带有标题解释性内容或者图片和文本内容混合排列的场合
二.表格
为什么使用表格？
1,简单易用
2，结构稳定
表格由什么组成？
1，单元格
2，行
3，列
基本语法：
<table>声明表格
<tr>表格第一行开始
<td>第1行第1个单元格中的内容</td>
<td>第1行第2个单元格中的内容</td>
<td>第1行第3个单元格中的内容</td>
</tr>
<tr>
<td>第2行第1个单元格中的内容</td>
<td>第2行第2个单元格中的内容</td>
<td>第2行第3个单元格中的内容</td>
</tr>
</table>
1，在<table>标签里 可以设置各种表格属性，例如：border="1"边框宽度
2，在<td>标签里 也可设置align水平对齐属性 和 valign垂直对齐属性
3，align中有三种对齐方式，分别是1，左对齐：left 2,居中对齐:center 3，右对齐：right
valign中有四种对齐方式，分别是1，顶端对齐：top 2,居中对齐:middle 3，底端对齐:bottom 4，基线对齐:baseline
4，小结：在实际的开发中，表格的对齐方式通常会使用CSS样式进行控制，使用属性进行对齐控制的场合比较少
5，<td>标签里还可以设置跨行与跨列
语法是：<td colspan="所跨列数">内容</td>
<td rowspan="所跨行数">内容</td>
三，框架
1，什么是框架？
在同一个页面显示多个页面，可以实现页面复用，通过点击左侧页面内容，右侧显示具体内容。
2，常用的框架技术有以下两种
框架<frameset>页面各个窗口全部用<frame>实现，适用于整个页面都用框架实现的场合
内联框架<iframe>一般在页面中引入站外的页面内容
3，基本语法：
<frameset rows="25%,*">将一个完整的页面分成两行，上面占用%25.下面占用*，*代表的就是剩余的部分
<frame src="http://www.mamicode.com/需要在这%25下显示的页面">
<frameset cols="20%,*">将剩余*的页面分成两列，左侧占用%20.右侧占用*，也就是剩余的部分
<frame src="http://www.mamicode.com/需要在这%20下显示的页面">
<frame src="http://www.mamicode.com/需要在这*下显示的页面">
</frameset>
</frameset>
4，我们可以再<frameset>标签里设置一些框架属性
例如
①scrolling是否显示滚动条： 只有两值，默认为显示，scrolling="no"不显示
②noresize 是否允许调整框架窗口大小 默认允许 noresize="noresize"不允许
③name 框架标示名 nama="想要的名字"
④frameborder是否显示框架周围的边框frameborder="1"
5,窗口之间的关联在于设置超链接"target"目标窗口属性
有以下几种打开方式
①blank:在新选项卡中打开
②self:如果没有设置target属性，默认取值是_self
③框架窗口名 在制定的框架窗口中打开链接
④_parent：在父框架集中打开链接，如果不是框架网页，则含义同_self
⑤_top：在顶级窗口中打开链接
6.<iframe>语法
<irame src="http://www.mamicode.com/引用的页面地址" name=框架名"">
它的常用属性 与frameset一样