[ 前端与 HTML | 青训营笔记]

XiangMang
340 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天

课程重点

  1. 前端工作的定义
  2. 前端技术栈拆解与分析
  3. HTML 作用解析
  4. HTML 语义化

课程内容

<!DOCTYPE html>

它是文档类型声明标签，用于一个文档类型的声明，DOCTYPE 用来保证文档能够正确被读取，html 声明这是一个 html 文档。

<html>

<html> 标签置于 HTML 文档最前边，用来标识 HTML 文档的开始，而 </html> 标签恰好相反，它放在 HTML 文档最后边，用来标识 HTML 文档的结束。

两个标签必须成对使用，网页中其他的所有标签都应该放在 <html> 和 </html> 标签之间。

<head>

head 标签是头部元素的家，头部元素是对页面的一些基本描述。

<h1>--<h6>

HTML <h1>–<h6> 标题元素呈现了六个不同的级别的标题，<h1> 级别最高，而 <h6> 级别最低。

代码表述
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
显示结果

image.png

<ol>

有序标签的使用

代码描述
<ol>
  <li>项目一</li>
  <li>项目二</li>
  <li>项目三</li>
</ol>

显示结果

image.png

<ul>

无序标签的使用

代码描述
<ul>
  <li>项目一</li>
  <li>项目二</li>
  <li>项目三</li>
</ul>
显示结果

image.png

<dl>

自定义列表的使用

代码描述
<dl>
  <dt>列表项一</dt>
  <dd>列表项一的描述</dd>
  <dt>列表项二</dt>
  <dd>列表项二的描述</dd>
</dl>
显示结果

image.png

<a>

在 HTML 中，使用 a 标签可以实现这一功能，它被称为超链接标签。

代码描述
<a href="URL"></a>

<img>

在 HTML 中，我们用 img 标签来插入图片，它负责向页面中嵌入一幅图像。

代码描述
<img src="图像 URL" alt="图像描述" />

<audio>

在 HTML5 中，使用 audio 标签来播放声音文件或者音频流，该标签支持 Ogg、MP3、WAV 等音频格式。

代码描述
<audio src="URL" controls></audio>

<audio>

在 HTML5 中，使用 audio 标签来播放声音文件或者音频流，该标签支持 Ogg、MP3、WAV 等音频格式。

代码描述
<audio src="URL" controls></audio>

<video>

HTML <video> 元素 用于在 HTML 或者 XHTML 文档中嵌入媒体播放器，用于支持文档内的视频播放。

代码描述
<video controls width="800">
    <source src="/videos/video1.mp4"
            type="video/mp4">
</video>
avatar
文章
阅读
粉丝