HTML快速入门（一）

HTML快速入门（一）

• 结构标签
• 基础标签
• 图片、音频、视频标签

1.结构标签

标签	描述
HTML	定义HTML文档
head	定义关于文档的信息
title	定义文档的标题
body	定义文档的主体

2.基础标签

只需要在body标签中书写标签

1. 标题标签
标题标签中h1最大，h6最小。

2.字体标签

font:字体标签

• face属性：用来设置字体，如“楷体”、“宋体”。

• color属性:设置字体颜色，颜色有三种表现方式
  1.直接后面带颜色英文单词：如red,blue…
  2.rgb(值1，值2，值3）：值的范围是0~255，也就是红绿蓝三原色，例如（255，0，0）。
  3.#值1值2值3：值的范围为00~FF，是rgb方法的简化方法，基本上都用这方法，值1表示红色的范围，值2表示绿色的范围，值3表示蓝色的范围。例如#ff0000

• size属性：设置字体的大小

代码演示：

<font color="red" size="7" face="楷体"></font>

3.换行标签
多一个br就多一个换行

静夜思<br/>
李白<br/><br/>

4.段落、空格标签

段落换行、文字之间的空格以及段落的居中、左、右。

    床前明月光，
    <p>疑是地上霜。</p>
    <p align="center">举头望明月，</p>
    <p align="right">低头思故乡。</p>


    李&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;白

5.加粗、斜体、下划线、局中标签

• b:加粗
• i:斜体
• u:下划线
• center:居中

<b>床前明月光</b><br>
<i>床前明月光</i><br>
<u>床前明月光</u><br>
<center>床前明月光</center>

3.图片、音频、视频标签

标签	描述
img	定义图片
audio	定义音频
video	定义视频

• img：图片标签
  –src:规定显示图像的URL（统一资源定义符）
  –width：定义图片的宽
  – height：定义图片的高
  height和width有两种设置方式：
  1.像素：单位是px
  2.百分比%：占父标签的百分比，比如width=“50%”，则占父标签的宽度的一半(50%)。

<img src="../img/i1.jpg" width="200" height="200"/>
<img src="../img/i1.jpg" width="200%" height="200%"/>

• audio：定义音频，可支持音频格式：MP3、WAV、OGG
  –src:规定音频的URL
  –controls:显示播放控件

• video:定义视频，可支持视频格式：MP4、WebM、OGG
  –src:规定音频的URL
  –controls:显示播放控件

资源路径：

• 绝对路径：完整路径，格式为： 协议://ip地址:端口号/资源名称。
• 相对路径：相对位置路径。

./表示当前路径
. ./表示上一级路径
. ./. ./表示上两级路径
比如此时 img与web03在不同的文件夹，所以引用需要返回上一级目录：