第二章:列表、表格与媒体元素

1.无序列表及其应用

  语法:

  <ul>

  <li>第一项</li>

  <li>第二项</li>

  <li>第三项</li>

  </ul>

  遵循W3c的标准<ul>标签里只能嵌套<li>标签,不能嵌套其他标签。

  <li>标签里可以嵌套任何标签。

2.无序列表的特征

  (1)没有顺序,每一个<li>独占一行(块元素)

  (2)默认<li>标签项前面都有一个实心小圆点

  (3)一般用于无序类型的列表,如导航,侧边栏新闻,有规律的图文组合模块

3.有序列表及其应用

  语法:

  <ol>

    <li>第一项</li>

    <li>第二项</li>

    <li>第三项</li>

  </ol>

4.有序列表的特征

  (1)有顺序,每一个<li>独占一行(块元素)

  (2)默认<li>标签项前面都有顺序标记

  (3)一般用于排序类型列表,如试卷问卷选项等

  定义列表及其应用

    语法:

    <dl>

      <dt>标题一</dt>

      <dd>第一项</dd>

      <dd>第二项</dd>

      <dt>标题二</dt>

      <dd>第一项</dd>

    </dl>

  定义列表的特征如下

    (1)没有顺序,每个<dt>标签,<dd>标签独占一行(块元素

    (2)默认没有标记

    (3)一般用于(一个标题下有一个或多个类表项)

5.表格的基本结构

  1 单元格

  单元格是表格的最小单位,一个或多个单元格纵横排列组策划那个表格

  2 行

  一个或多个单元格横向堆叠成了行

  3 列

  由于表格单元格宽度必须一致,因此单元格纵向排列形成了列

  语法

  <table>

    <tr>

      <th>第一个单元格内容</th>

      <th>第二个单元格内容</th>

    </tr>

    <tr>

      <td>第一个单元格内容</td>

      <td.第二个单元格内容</td>

   </tr>

  </table>

6.表格的跨行和跨列

  表格跨列

  语法

  <table>

    <tr>

      <td colspan="所跨的列数">单元格内容</td>

    </tr>

  </table>

表格的跨行

  <table>

    <tr>

      <td rospan="所跨的行数">单元格内容</td>

    </tr>

  </table>

7.经验:

  1 在需要合并的第一个单元格设置跨行或跨列属性,如colspan=“3”。

  2 删除被合并的其他单元格,及把某个单元格看成多个单元格合并后的单元格

  3 跨行和跨列后并不改变表格特点,同行的总高度一致,同列的总宽度一致。因此,表格中的各个单元格宽度或高度互相有影响结构相对稳定,但缺点是不能灵活的进行布局控制

8.视频元素

  1.video 元素的语法

  <voieo src="视频路径" controls="controls"></video>

  只能接收一种格式

  source 元素解决这一问题,source元素嵌套在video,并且可以出现多次 每一次source元素对应一种格式视频

  在video中指定controls属性可以在页面上以默认的方式进行播放控制。如果不加这个属性视频就不能直接播放

  还有一种方法在voieo元素设置另一个属性autoplay

9.音频元素

  audio 基本元素

  <audio src="音频路径"controls="controls"></video

  controls属性用于提供播放暂停和音量控键,

10.页面布局

  HTML结构元素

  header 标题的头部区域内容

  footer 标记脚部区域的内容(用于整个页面或页面的一块区域)

  section WEB页面中的一块独立区域

  aticle 独立的文章内容

  aside 相关内容或应用(常用于侧边栏)

  nav 导航类辅助内容

11.<iframe>框架

  主要作用使页面中的部分内容用框架实现,一般用于页面引用站外的页面内容,使比较方便、灵活。

  语法:

  <iframe src="引用页面地址"name="框架标识名"...></iframe>

  <iframe>属性使用

  (1)<iframe name="mainframe" src=""...../>

  (2)<a href="......"tiget="mainframe">下面显示第二行</a>

时间: 2024-10-25 13:31:42

第二章:列表、表格与媒体元素的相关文章

列表,表格,与媒体元素

一.无序列表 <ul> <li>无序列表</li> <li>有序列表</li> <li>自定义列表</li> </ul> 特性:1.没有顺序,每个<li>标签独占一行(块级元素) 2.默认每一个li标签前有一个实心小圆点 3.主要用于无序类型信息的展示,如导航栏等 二.有序列表 <ol> <li>无序列表</li> <li>有序列表</li>

列表 表格与媒体元素

无序列表及其应用 语法<ul><li>第一项</li><li>第二项</li><li>第三项</li></ul>遵循W3c的标准<ul>标签里只能嵌套<li>标签,不能嵌套其他标签.<li>标签里可以嵌套任何标签. 无序列表的特征 (1)没有顺序,每一个<li>独占一行(块元素)(2)默认<li>标签项前面都有一个实心小圆点(3)一般用于无序类型的列表

列表表格及媒体元素

一.列表 信息资源的一种展示形式 二.列表的分类 1.有序列表  <ol>   <li>列表项1</li>   <li>列表项2</li>  </ol>    特性:   1.有顺序,每一个li独占一行            2.默认每一个li前有顺序标识  2.无序列表  <ul>   <li>列表项1</li>   <li>列表项2</li>  <ul>   

HTML5 第二章 列表和表格和媒体元素

列表: (1)什么是列表? 列表就是信息资源的一种展示形式. (2)无序列表: 语法: <ul> <li>第1项</li> <li>第2项</li> <li>第3项</li> </ul> (3)有序列表: 语法: <ol> <li>第1项</li> <li>第2项</li> <li>第3项</li> </ol> (4

第二章 列表、表格与媒体元素

一.无序列表 <ul>       <li>无序列表</li>       <li>有序列表</li>       <li>自定义列表</li>      </ul> 特性:1.没有顺序,每个<li>标签独占一行(块级元素)        2.默认每一个li标签前有一个实心小圆点        3.主要用于无序类型信息的展示,如导航栏等 二.有序列表 <ol>       <li&

python基础教程-第二章-列表和元组

本章将引入一个新的概念,:数据结构.数据结构是通过某种方式(例如对元素进行编号)组织在 一起的数据元素的集合,这些数据元素可以是数字或者字符,甚至可以是其他数据结构.在python中,最基本的数据结构是序列(sequence).序列中的每个元素被分配一个序号--即元素的位置,也称为索引.第一个索引是0,第二个则是1,依次类推. 2.1 序列概览 python包含6中内建的序列,本章重点讨论最常用的两种:列表和元组.其他的内建序列类型字符串.Unicode字符串.buffer对象和xrange对象

Python基础教程(第二章 列表和元组)

本文内容全部出自<Python基础教程>第二版,在此分享自己的学习之路. ______欢迎转载:http://www.cnblogs.com/Marlowes/p/5293195.html______ Created on Xu Hoo 本章将引入一个新的概念:数据结构.数据结构是通过某种方式(例如对元素进行编号)组织在一起的数据元素的集合,这些数据元素可以是数字或者字符,甚至可以是其他数据结构.在Python中,最基本的数据结构是序列(sequence),序列中的每个元素被分配一个序号——即

列表 ,表格与媒体元素基础

一.列表 信息资源的一种展示形式 二.列表的分类 1.有序列表 <ol> <li>列表项1</li> <li>列表项2</li> </ol> 特性: 1.有顺序,每一个li独占一行 2.默认每一个li前有顺序标识 2.无序列表 <ul> <li>列表项1</li> <li>列表项2</li> <ul> 特性: 1.没有顺序,每一个li独占一行(块元素) 2.默认每

HTML5 列表、表格、媒体元素

无序列表 <ul> <li>范冰冰演藏族女孩</li> <li>拍集体合影后自拍</li> <li>诗隆甜蜜出游</li> <li>一线城市楼市退烧</li> </ul> 特性 没有顺序,每个<li>标签独占一行(块元素) 默认<li>标签项前面有个实心小圆点  有序列表 <ol> <li>范冰冰演藏族女孩</li> <l