html.列表,表格与媒体元素.

无序列表:

无序列表由<ul>标签和<li>标签组成,使用<ul>标签作为无序列表的声明,使用<li>标签作为每个列表的起始.

<ul>

<li>内容</li>

<li>内容</li>

<li>内容</li>

</ul>

特性:1.没有顺序,每个<li>标签独占一行(块元素).2.默认<li>标签项前面有个实心小圆点.

有序列表:

有序列表由<ol>标签和<li>标签组成,使用<ol>标签有序列表的声明,使用<li>标签作为每个每个列表的起始,有序列表和无序列表一样,只能<ol>标签里嵌套<li>标签.

<ol>

<li>内容</li>

<li>内容</li>

<li>内容</li>

</ol>

特性:1.有顺序,每个<li>标签独占一行(块元素)2.默认前面<li>标签前面有顺序.

定义列表:

定义列表是一个特殊的列表形式,它是标题和列表的结合,它是使用<dl>标签作为开始,使用<dt>来作为每个列表的起始,使用列表<dd>标签来完成.

<dl>

<dt>标题</dt>

  <dd>内容</dd>

  <dd>内容</dd>

<dt>标题2</dt>

  <dd>内容</dd>

  <dd>内容</dd>

</dl>

特性:1.没有顺序,每个<dt>标签,<dd>标签独占一行(块元素)2.默认没有标记

表格:

单元格:表格的最小单位,一个或多个纵横排列组成了表格.

行:一个或多个单元格横向推叠形成了行.

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

基础语法:

<table border="1">

<tr>

  <th>标题</th>

  <th>标题2</th>

</tr>

<tr>

  <td>内容</td>

  <td>内容</td>

</tr>

</table>

第一步:创建表格标签<table></table>

第二步:在表格标签<table><table>里创建行标签<tr></tr>可以有多行.

第三步:在行标签<tr></tr>里创建单元格标签<th></th>,用于表格标题.

第四步:在行标签<tr></tr>里创建单元格标签<td></td>,可以有多个单元格.另为了显示表格的轮廓,一般还需要设计<table border="1">边框属性,

注意:在HTML5的规范里已经把boreder边框属性废除了.

表格的跨列和跨行.

跨列:

<table>

<tr>

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

</tr>

</table>

跨行:

<table>

<tr>

  <td rowspan="所跨的行数">内容</td>

</tr>

</table>

媒体元素:

<video src="视频地址" controls></video>

<video controls>

  <source src="视频地址"视频格式>

  你的浏览器不支持video标签

</video>

音频元素:

<audio src="地址" controls></audio>

<audio controls>

  <source src="音频地址"音频格式>

</audic>

<iframe框架>:

语法:<iframe src="引用页面地址" name="框架名"></iframe>

示列:

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<head>
    <title>使用iframe嵌套网页</title>
</head>
<body>
      <h2>使用iframe嵌套</h2>
       <p>
           <a href="http://s.bdqn.cn/login" target="a">打开云课堂</a><br/>
           <a href="https://www.baidu.com/index.php?tn=56060048_4_pg&ch=13" target="a">打开百度</a><br/>
           <a href="图像vedio.MP4" target="a">你猜</a><br/>
       </p>
           <iframe name="a" width="2000" height="1000"></iframe>

</body>
</html>

页面布局分析:
整个页面,页面的头部,页面的主体,页面的底部.

HTML5的饥结构元素:

元素名                            描述

header                           标题头部区域的内容

footer                             标记脚部区域的内容

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

article                             独立的文章内容

aside                            相关内容和应用

nav                              导航类辅助内容

原文地址:https://www.cnblogs.com/matianpeng/p/7444445.html