zoukankan      html  css  js  c++  java
  • 第二章:列表、表格与媒体元素

    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>

  • 相关阅读:
    mysql环境搭建
    php基础:查看上次插入的主键和影响的行数及关闭mysql连接
    php基础:文件包含与引用 require和include的区别
    php基础:echo和print_r和var_dump的区别
    php基础:变量检测
    php基础:动态变量名
    php基础:代码的短路特性和运算符优先级
    php基础:三元运算符及比较3个数的大小
    php基础:字符串基本函数
    php基础:数组的定义和遍历
  • 原文地址:https://www.cnblogs.com/wang2386033566/p/7465679.html
Copyright © 2011-2022 走看看