青训营笔记

438 阅读3分钟

一、本堂课重点内容

介绍 HTML 在网页开发中的作用 前端应该关注网页上的哪些方面 简单介绍网页和 HTML 标签的组成元素 介绍编写一份规范的 HTML 代码的重要性

二、详细知识点介绍

1、什么是 HTML

HTML(HyperText Markup Language) 在 web 开发中,占据的重要的位置,采用标记语言描述整个网页的内容结构,它包含一系列由 W3C 或各浏览器厂商制定的 xml 标签,浏览器通过按照特定的规则将标签和内容渲染出来,就形成了网页。

2、常见的html标签 一、块级元素

div

含义:页面内容的一个独立组成部分。

常见的用途有三种:1)划分页首、页尾、页边栏或导航栏等等;2)表示页面的分栏;3)将文章进一步分成几个部分,比如正文、评论、文章的元数据等等。

示例:

页面的头部

h1, h2, h3, h4, h5, h6

含义:内容的标题。

h1是最高一级的标题,下一层标题使用h2,依次类推。除了h1以外,其他5个级别标题在一个页面中都可以出现多次,h1只能出现一次。

示例:

一级标题

二级标题

p

含义:表示段落。

它是文章内容的基本组成部分,也可以用来表示诗歌中的一节。p与div的主要区别是,前者表示文本段落,后者表示更广义的段落。

在P标签中,不应该再包含其他块级元素。此外,也不应该使用空的p标签。

示例:

这是一个段落。

blockquote

含义:表示一段引用自其他来源的独立文本。

它引用的文本通常有一定的长度,以块级元素的形式出现。

blockquote应该总是与cite标签配合使用,cite用来指明引用材料的来源。

示例:

不是在沉默中爆发,就是在沉默中灭亡。 鲁迅《为了忘却的纪念》

在浏览器的默认样式中,blockquote有文本缩进的效果,但是不要单单因为这个原因,而使用它。

blockquote有两个属性,第一个是cite属性,用来指明引用材料的URI地址;第二个是title属性,用于提供引用材料的相关信息。

示例:

"我正在此处引用W3C的标准。"

二、行内元素

a

含义:与href属性搭配使用时,链接至外部链接,或者同一页的某个锚点。

示例:

第二章

abbr

含义:表示内容是某个术语或短语的缩写形式,它有一个title属性,用来指明缩写所代表的原始词组。

示例:

Eur

acronym

含义:表示内容是一个词组的首字母简称,比如BBC、WTO。

它有一个title属性,用来指明属性所代表的原始词组。

acronym与abbr的主要区别是,前者往往是一个可以独立使用的词,而后者不是。这意味着acronym肯定是abbr,但是abbr不一定是acronym。

示例:

WWW

em

含义:表示强调。

em所指明的内容,应该比其周围的内容更重要。

注意,如果你只是想表示斜体或者引用书名,那就不要使用em标签,而是用CSS命令(font-style:italic)。

示例:

我正在强调这句话。

strong

含义:表示比em更强的强调。

示例:

我正在以更大的强度,强调这句话。

3、HTML文档是由一系列的元素和标签组成。元素名不区分大小写,HTML用标签来规定元素的属性和它在文件中位置,HTML文档分为头部分和主体两部分,在文档头中对文档进行一些必要的定义,主体部分是文档要显示的信息。 一个HTML文档基本结构主要由文档声明( )、HTML文档()、文档头部分()、和文档主体()四部分组成。

<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
 
</head>
<body>
 
 
 
</body>
</html>```