基础标签
1. HTML 的基础标签
1.1 基础标签 有哪些 ?
用途 | 标签名 |
---|---|
① 文档类型 | <!DOCTYPE> |
② html 文档 | <html> |
③ 文档的标题 | <title> |
④ 文档的主体 | <body> |
⑤ 文档内容的标题 | <h1>-<h6> |
⑥ 段落 | <p> |
⑦ 换行 | <br> |
⑧ 水平线 | <hr> |
⑨ 注释 | <!--...--> |
1.2 ★ !DOCTYPE 文档类型声明 (用的哪一版本 HTML)
-
HTML 文档类型声明 用什么 ?
- 一般使用
<!DOCTYPE>
进行文档类型 声明
- 一般使用
-
<!DOCTYPE>
声明的 一般放在什么位置 ?- 必须是 HTML 文档的第一行,
<html>
文档 根标签 之前。
<!DOCTYPE>
是一个标签吗 ? - 不是 HTML 标签
- 必须是 HTML 文档的第一行,
-
快捷输入文档结构:
- 支持 emmet 的编辑器中,如 webstorm中,输入
html:5
,按下tab 键,会自动扩展出 5.0 版本的文档结构,包括 html 5.0 版本的 文档类型声明。
- 支持 emmet 的编辑器中,如 webstorm中,输入
-
<!DOCTYPE>
声明 是否区分大小写 ?有没有结束标签 ?- 没有 结束标签
- 不区分 大小写
-
如何 检查 是否编写了有效的 HTML / XHTML 文档 ?
- 使用 W3C 的验证器
-
声明 HTML 版本: 如何 告诉浏览器 网页 使用的 HTML 版本 是哪一版本?
- 使用
<!DOCTYPE>
文档类型声明
- 使用
-
总结: 文档类型 声明 =
<!DOCTYPE>
= HTML 版本 -
HTML 4.01 与 HTML 5 之间 有什么差异 ?
- 在 HTML 4.01 中有三种
<!DOCTYPE>
声明。 - 在 HTML 5 中 只有一种
- 在 HTML 4.01 中 , 为什么
<!DOCTYPE>
声明 引用 DTD(文档类型定义) document type definition。 美 /ˌdefɪˈnɪʃn/。- 因为 HTML 4.01 基于 SGML。
- abbr. 标准通用 标记语言(Standard Generalized Markup Language)
- 因为 HTML 4.01 基于 SGML。
- 在哪里 规定了 标记语言的规则,使浏览器 正确地呈现内容 ?
- 在 DTD 中
- DTD
- abbr. 文档类型定义(document type definition)
- 总结 :文档类型定义 = DTD = 标记语言的规则 = DTD的网址
- DTD
- 在 DTD 中
- 在 HTML 4.01 中有三种
- 为什么 HTML5 不需要引用 DTD ?
- 因为 HTML 5 不基于 SGML 标准通用 标记语言
- 为什么一定 要向 HTML 文档 添加
<!DOCTYPE>
声明- 因为这样,浏览器才能 知道文档类型,知道 html 的版本,才能更正确地显示。
- 常用的 DOCTYPE 声明有哪些 ?
- HTML 5 的文档类型声明 是怎样的 ?
<!DOCTYPE html>
- HTML 4.01和 XHTML 的文档类型声明 是怎样的 ?
-
① 严格 文档类型 :
Strict
- 严格 文档类型 DTD 包含 所有 HTML 元素和属性吗 ?
- 是的
- 严格 文档类型 包含 展示性的和弃用的元素(比如
font
)吗 ?- 不包含
- 严格文档类型,可以包含框架集吗 ?
- 不允许 框架集(Framesets)
- 严格 文档类型 DTD 包含 所有 HTML 元素和属性吗 ?
-
② 过渡 文档类型 :
Transitional
- 过渡 文档类型 的DTD 包含所有 HTML 元素和属性吗 ?
- 是的
- 过渡 文档类型 包含展示性的和弃用的元素(比如
font
) ?- 包含
- 过渡文档类型 可以包含框架集(Framesets)吗 ?
- 不可以
- 过渡 文档类型 的DTD 包含所有 HTML 元素和属性吗 ?
-
③ 框架集 文档类型 :
Frameset
- 框架集的 DTD和 过渡 文档类型的 有什么区别 ?
- 一样的
- 允许 框架集的内容 吗?
- 允许
- 框架集的 DTD和 过渡 文档类型的 有什么区别 ?
-
XHTML 1.1 的 DTD 和XHTML 1.0 Strict 有什么区别 ?
- 等同于 XHTML 1.0 Strict
- 而且允许 添加模型(例如提供对东亚语系的 ruby 支持)。
-
<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
1.3 ★ html 告诉浏览器 文件是一个 HTML 文档
-
如何 告诉浏览器 文件自身是 一个 HTML 文档 ?
- 使用
<html>
文档 根标签 - 总结 :
<html>
= 我是一个HTML 文档 - 根元素:
<html>
文档根 元素表示 HTML文档的根(顶级元素),因此也称为 root 根元素。 - 祖先: 所有其他元素 都必须是 该元素的后代。其他元素,都写在
<html>
元素的内部,自身 没有父元素,就像始祖一样。(当然,根标签 和文档类型声明是 兄弟关系)
- 使用
-
如何 表示 文档的 开始点和结束点 ?
<html>
与</html>
-
HTML 与 XHTML 之间的区别 有哪些 ?
-
<html>
文档根 标签的xmlns
命名空间属性(html-xmlns
) 是必需的吗 ?- ns:namespace,命名空间
- 在 XHTML 中是 必需的
- 在 HTML 中 不是必需的
- 如果 XHTML 文档中的
<html>
没有使用xmlns
属性,W3C 的验证器 会报错吗?- 不会报错。
- 为什么不会报错 ?
- 因为
"xmlns=http://www.w3.org/1999/xhtml"
是一个 固定值, 没有包含它,这个值也会 被添加到<html>
标签中。
- 因为
- 为什么不会报错 ?
- 不会报错。
-
哪个元素是 文档的根元素 ?
<html>
文档根 标签
-
<html>
文档根 元素 中 应该包含 文档类型声明<!DOCTYPE>
吗 ? 。- 不包含 .
<!DOCTYPE>
必须位于<html>
元素之前,和根标签是 兄弟关系。
- 不包含 .
1.3.1 html 根标签的 常用属性
属性 | 值 | 用于 |
---|---|---|
=url | 已废弃 . 定义一个 URL,这个 URL 指示 应在本地缓存的资源。 | |
xmlns | =http://www.w3.org/1999/xhtml | 限定版本中使用,定义 XML namespace 命名空间 属性,xhtml 版本中才使用,html 5 版本中不使用。 |
lang | =“语言代码” | 指明标签内容 使用的是什么语言。是 html 标签中最常用的属性。(注:lang 语言属性,是个全局属性,但是在 html 标签中最常使用。) |
-
manifest
本地缓存资源属性,使用时会有个背景色,鼠标放上去,会提示是弃用的属性。
-
⑴
<html>
文档根 标签的manifest
缓存信息 属性 [已废弃]- 如何 描述 文档的缓存信息 ?
- 使用 html-
manifest
缓存信息 属性 - 应在本地缓存的资源: 指定资源清单的URI,指示 应在本地缓存的资源。
- 使用 html-
- html-
manifest
缓存讯息 属性值 一般是 ?- url
- html-
manifest="url"
- 如何 描述 文档的缓存信息 ?
-
⑵
<html>
文档根 标签的xmlns
命名空间 属性-
如何 定义 XML namespace (XML的命名空间 ) ?
- 使用 html-
xmlns
命名空间 属性 - 指定 文档的 XML名称空间。默认值是
"http://www.w3.org/1999/xhtml"
- 使用范围: 这在 使用 XML解析器 解析的文档中,即 xhtml 文档中 是必需的,在 HTML 中,
xmlns
属性是无效的,就是说,在最新版本的 html 5 版本中 没有必要使用这个属性。
- 使用 html-
-
xmlns
属性 的属性值 一般是 ?http://www.w3.org/1999/xhtml
- 固定值 :html-
xmlns="http://www.w3.org/1999/xhtml"
-
如何 在文档中 定义 一个或多个 可供选择的命名空间 ?
- 使用
xmlns
xml 命名空间 属性
- 使用
-
html-
xmlns
命名空间 属性 可以放置在什么位置?- 文档内 任何元素的 开始标签中.不仅仅是
<html>
文档根 标签中.
- 文档内 任何元素的 开始标签中.不仅仅是
-
xmlns
属性 的属性值 一般是 ?- 类似于 URL,它定义了一个命名空间
- 固定值 :
http://www.w3.org/1999/xhtml
-
浏览器会将此
xmlns
命名空间属性 命名空间 用在哪里 ?- 该属性 所在元素内的 所有内容。
-
如果 需要使用 符合 XML 规范的 XHTML 文档,如何 指定 整个文档所使用的 主要命名空间 ?
- 在文档中的
<html>
根标签中 使用一个xmlns
命名空间 属性
- 在文档中的
-
-
为什么要定义
xmlns
命名空间 属性 ?- XML 命名空间的作用是 : 提供 避免元素 命名冲突的方法。
- 有必要理解 存在着多个命名空间,以便在需要选择 将基于某个 DTD 的内容,嵌入其他 DTD 定义的内容中时,可以管理 多个命名空间。
-
⑶
lang
文档使用语言 属性lang
是英语 language 语言的缩写,最常用的属性值en
代表英语,zh-CN
代表中文。lang
是全局属性,但一般在html
标签中使用的最多,用来指明 整个文档内容使用的 语言。- csdn 网站中 使用的就是
zh-CN
,指明文档内容 使用的是中文。
-
⑷ 支持全局属性
- 总结 :
<html>
文档根标签 支持的 属性- ①
manifest
属性: 需要缓存的信息(已废弃) - ②
xmlns
属性: 命名空间 - ③ 全局属性
- ①
- 总结 :
1.4 ★ title 定义 文档的标题
-
如何定义 文档的标题 ?
- 使用
<title>
文档标题 标签 - 文档标题: 定义 显示在 ❶ 浏览器标题栏 或 ❷ 页面选项卡中的 文档标题。它只包含文本,元素中的标签 被忽略。
- 什么是 浏览器标题栏?
- 浏览器顶部,即为标题栏
- 标题栏在计算机软件中,位于窗口最顶部。显示当前应用程序名、文件名等,在许多窗口中,标题栏也包含程序图标、“最小化”、“最大化”、“还原”和“关闭”按钮以及“帮助”的按钮,可以简单地对窗口进行操作。
- 什么是页面选项卡?
- 选项卡显示的是 目前所有打开的网页。
- 打开了三个网页,三个选项卡。
- 可以看到 页面选项卡,是标题栏的一部分。
- 使用
-
浏览器一般会 怎样 使用
<title>
文档标题标签 的内容 ?-
通常把它放置在 浏览器窗口的 标题栏 或状态栏上。
- 下方是网页的快捷方式,选中后,显示在 windows 窗口的状态栏中。
-
当把网页加入收藏夹或书签列表时,标题 将成为该网页的 默认名称。
-
-
<title>
文档标题 标签 一般放在哪里 ?<head>
头部标签中 ,head>title
,头部标签的子标签。<title>
文档标题 标签 是<head>
头部标签 必需的子元素吗 ?- 是的,一个
<head>
有且仅有一个<title>
,文档 有且只有一个主标题。
- 是的,一个
-
<title>
文档标题 标签的内容,一般要有什么特点 ?- 说明文档 的内容主题
-
⑴ 网页标题 及 搜索引擎优化 SEO
- abbr. 搜索引擎优化(Search Engine Optimization)
- ① 页面标题和搜索优化: 页面标题的内容 对搜索引擎优化(SEO)有重要的影响。
- ② 长 描述性标题更佳: 一般来说,较长的描述性标题 比 较短 或缺乏灵感的标题 效果更好。
-
⑵ 标题内容的作用:
- ① 搜索结果 出现顺序: 标题的内容是 算法用来 决定在搜索结果中 列出页面的 顺序的组件之一
- ② 吸引读者: 标题也是 吸引浏览搜索结果页面 的读者注意力 的初始“钩子”。
-
⑶ 写好标题的一些 指导方针和技巧:
- ① 标题 不能过短+ 要有描述性: 避免使用 一两个单词的标题。为术语表 或引用样式的页面 使用 描述性短语 或术语/定义配对。
- ② 不能过长,重要的写在前面:
- 前 55-60个字符: 搜索引擎通常会 显示页面标题的 前55-60个字符。
- 超过这个长度的文本 可能会丢失,所以尽量不要有 超过这个长度的标题。
- 重要的写在前: 如果必须使用更长的标题,请确保 重要的部分 出现得更早,并且标题中 可能被删除的部分 没有关键内容。
- 前 55-60个字符: 搜索引擎通常会 显示页面标题的 前55-60个字符。
- ③ 不要使用 特殊字符: 尽可能 避免使用 特殊字符;并不是所有的浏览器 都会以相同的方式 显示它们。
- 例如,
“<”
经常在窗口标题栏中显示为&lt;
- 例如,
- ④ 不要使用“关键字块”: 如果你的标题 只是一个单词列表,算法通常会 人为地降低页面 在搜索结果中的位置。
- ⑤ 标题的特别性: 确保你的标题 在你自己的网站中 尽可能的独一无二。重复 或接近重复的标题 会导致搜索结果不准确。
- 示例: 为页面定义 一个标题
<head>
<title>演示实例的页面</title>
</head>
1.5 ★ body 定义 文档的 主体内容
- 如何 定义文档的主体 ?
- 使用
<body>
文档主体 标签 - 文档的内容:
<body>
标签 表示 HTML 文档的内容。 - 数目: 一个文档中 只能有一个
<body>
标签。 - 位置: 它必须是
<html>
根标签的 第二个标签。为什么是第二个?因为第一个是head
头部标签,从上往下,先有头,才有主体,有上下顺序。
- 使用
- 网页中显示的内容,比如文本、超链接、图像、表格和列表等等,一般都放在哪里 ?
<body>
文档主体 标签中,一般body
标签中的内容,都是显示给用户看的,而head
头部标签中的内容,则给浏览器看的,它们服务的对象是不同的。
- HTML 与 XHTML 的
<body>
文档主体 标签 有什么区别 ?- 在 HTML 4.01 中
- 所有
body
文档主体 元素的“呈现属性” 均不赞成使用。
- 所有
- 在 XHTML 1.0 Strict DTD 中
- 所有
body
元素的“呈现属性”均不支持。
- 所有
- 呈现属性 有哪些 ?
- 如
background,bgcolor,text
等,标签原来的 样式化的属性,基本上都废弃了 , 使用css
代替。
- 如
- 在 HTML 4.01 中
1.6 ★ h1~h6 定义 文档内容的 标题
- 如何定义 文档内容的标题 ?
<h1>
到<h6>
内容标题 标签<h1>–<h6>
标题(Heading)元素 呈现了六个 不同的级别的 区段标题,<h1>
一级标题标签的级别最高,而<h6>
六级标题标签的 级别最低。- 属性: 这些元素只包含 全局属性。
- 如何定义 最大的标题 ?
<h1>
一级内容标题 标签
- 如何定义 最小的标题 ?
<h6>
六级内容标题 标签
- 注意事项
- 内容标题 标签一般用于 什么样的内容 ?
- 用于 标题文本。
- 可以为了 产生粗体文本 而使用标题标签吗 ?
- 不可以 。因为 标题标签是有语义的,并只是粗体。可以使用其它标签或 CSS 代替。
- 内容标题 标签一般用于 什么样的内容 ?
- 使用说明
- 自动构造目录: 例如,用户代理可以使用标题信息 自动构造文档的目录。
- 避免使用: 避免使用标题标签 来调整文本大小。
- 相反,使用CSS
font-size
属性。标题使用大小 来表示它们的 相对重要性,但是CSS 更适合用于 一般用途的调整大小。
- 相反,使用CSS
- 不要跳级使用 按顺序: 避免 跳过标题级别:总是从
<h1>
开始,然后使用<h2>
,以此类推。- 标题间跳转: 屏幕阅读软件 用户 常用的一种导航技术 是从一个标题 跳转到另一个标题,以快速确定页面的内容。因此,重要的是 不要跳过一个或多个标题级别。这样做可能会造成混淆,因为以这种方式导航的人 可能会想知道 丢失的标题在哪里。
- 仅用一次
<h1>
: 避免在页面上 多次使用<h1>
,就像一本书,只有一个书名一样。
- 示例1: 所有标题
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
- 字体的大小,反应了 不同级别标题的重要性
- 示例2: 标题嵌套
- 标题嵌套 和页面内容结构: 标题 可以嵌套为 子部分,以反映 页面内容的组织结构。大多数屏幕阅读器 还可以生成 页面上所有标题的 有序列表,这可以帮助用户 快速确定内容的层次结构:CSDN 就采用了这种技术 自动生成目录.
- 标题嵌套 和页面内容结构: 标题 可以嵌套为 子部分,以反映 页面内容的组织结构。大多数屏幕阅读器 还可以生成 页面上所有标题的 有序列表,这可以帮助用户 快速确定内容的层次结构:CSDN 就采用了这种技术 自动生成目录.
- 示例3:
<h1>~<h6>
六个级别的标题,搭配aria-labelledby
属性- aria-labelledby 属性详解
id
被当作标签:aria-labelledby
属性用来表明 某些元素的id
是 某一对象的标签。它被用来确定 控件 或控件组 与它们标签之间的联系。- 屏幕阅读器 和标签: 使用诸如屏幕阅读器 等辅助技术的用户通常使用 tab键 在页面的不同区域间 进行导航。如果一个输入元素、控件或控件组 没有被分配一个
label
标签,那么屏幕阅读器 就无法对其进行阅读。 - 标题 和相关内容 相关联: 标题元素 与 标题相关的内容 相关联。
- 标题的
id
属性,相关性内容区的div的aria-labelledby=h1的id
,两个属性的属性值 一样的。
- 标题的
<div role="main" aria-labelledby="foo">
<h1 id="foo">Wild fires spread across the San Diego Hills</h1>
Strong winds expand fires ignited by high temperatures ...
</div>
1.7 ★ p 定义 段落
- 如何定义 段落 ?
- 使用
<p>
段落标签 - paragraph 美 /ˈpærəɡræf/
<p>
表示 一个段落。- ① 文本块: 段落通常在可视媒体中 表示为文本块,文本块 通过 空行和 / 或第一行缩进 与相邻的块分隔开。
- 段落: 指根据 文章或事情的内容、阶段划分的相对独立的部分。
- ② 相关联 内容分组: HTML 段落 可以是相关内容的 结构化分组,比如 图像 或表单字段。
- 块级元素: 段落 标签
p
是块级元素. - 自动关闭: 值得注意的是,如果在结束标记
</p>
之前 解析另一个块级元素,段落将 自动关闭 ,意思是,其他的块级元素的前后 也会自动换行,那就相当于是段落中 多了一个段落,就不只是一个段落了,看上去像是有两个段落。如下,两段,两个独占一行的。- 如果只要一个段落,
p
标签中,最好别包含其他的块级标签,否则会断行。
- 如果只要一个段落,
- 使用
<p>
<h2>二级标题</h2>
我是段落内容
</p>
<p>
段落元素 在显示上 有什么特点 ?- 浏览器会自动 在其前后 自动换行。
- 显示结果:
- 浏览器会自动 在其前后 自动换行。
</p>
段落前
<p>聪明出于勤奋,天才在于积累。——华罗庚</p>
段落后
- 分段 和可访问性
- 更容易访问: 将内容分成段落 有助于使页面 更容易访问。
- 为 屏幕阅读器 和其他辅助技术 提供了快捷方式,让用户跳过 下一段 或上一段,让他们浏览内容,比如 空白键 如何让视觉用户跳过。
- 不要使用空的
<p>
段落 添加空白- 使用空的
<p>
元素 在段落之间 添加空格 对于使用屏幕阅读技术导航的人 来是有问题的。屏幕阅读器 可以显示段落的存在,但不能显示 其中包含的任何空内容,因为没有任何内容。这可能会使 使用屏幕阅读器的人 感到困惑,明明是一个段落,怎么没有任何东西?
- 使用空的
- 创建段落间空白: 如果需要 额外的空间,使用 CSS 属性,如外边距
margin
外边距 来创建效果:
- 更容易访问: 将内容分成段落 有助于使页面 更容易访问。
- 示例1: 两个文本块 段落
<head>
<style>
p {
margin: 10px 0;
padding: 5px;
border: 1px solid #999;
}
</style>
</head>
<body>
<p>壁虎通常是一群夜间活动的小型蜥蜴。除了澳大利亚,其他大陆都有。</p>
<p>有些物种生活在房子里,它们捕捉被人造光吸引的昆虫。</p>
</body>
- 不带样式的 两个段落
1.8 ★ hr 创建一条 主题分隔 水平线
- 如何在 HTML 页面中 创建 一条水平线 ?
- 使用
<hr>
主题分隔 水平线 标签 - 主题中断(主题分隔):
<hr>
水平线 元素 表示 段落级元素 之间的 主题中断:例如,一个故事中的 场景更改,或者一个段落中的 主题转换。 - 语义性 不仅仅是水平线: 历史上,这一直 被表示为 一条水平线。虽然在可视浏览器中 它仍然可以 作为水平线显示,但是现在 这个元素是语义术语 而不是表示术语,所以如果 希望 绘制水平线,应该使用 适当的 CSS。
- 使用
- 水平分隔线(horizontal rule)可以在视觉上有什么特点 ?
- 将文档分隔成 各个部分。(分隔文档)
- 美 /ˌhɔːrɪˈzɑːntl/ 美 /ruːl/
- 示例: 两个主题间 画一条水平线
<p>§1: 搏击俱乐部的第一条规则是: 不要谈论搏击俱乐部。</p>
<hr>
<p>§2: 搏击俱乐部的第二条规则是: 永远带纸杯蛋糕。</p>
1.9 ★ < !–…--> 在 html 代码中 插入注释
- 如何在 html 的源代码中 插入注释 ?
- 使用 注释标签
<!-- -->
- 使用 注释标签
- 注释的内容 会显示在 浏览器中吗 ?
- 不会
- 注释标签的用途 有哪些 ?
- ① 代码解释 : 如何对代码 进行解释 ?
- 使用注释标签
<!--...-->
- 这段代码干什么用的,写明白了,团队合作的时候,队友很容易看懂。
- 使用注释标签
- ② 隐藏脚本: 如何隐藏浏览器 不支持的脚本 ?
- 使用注释标签
<!--...//-->
- 使用注释标签
- ① 代码解释 : 如何对代码 进行解释 ?
<script type="text/javascript">
<!--
function displayMsg()
{
alert("Hello World!")
}
//-->
</script>
-
注释:注释行结尾处的 两条斜杠
//
有什么用 ?- 是 JavaScript 注释符号。可以避免 JavaScript 执行
-->
标签.
- 是 JavaScript 注释符号。可以避免 JavaScript 执行
-
html 注释的作用
- 说明文档代码
- 适当的 解释说明, 提高 代码可读性
- 纠错
- 比如,可以一次注释一行 HTML 代码,以搜索错误。
- 说明文档代码
-
多 注释: 多使用注释标签,是很好的习惯,几个人合作开发网站的时候,注释 有利于理解。
-
浏览器 不解析: 注释的内容,是给开发者看的,浏览器是不解析的。
-
html 注释的快捷键:
- 单行注释: ctrl + / (可先 选中要注释的区域)
- 多行注释: ctrl+shift+ / (可先 选中要注释的区域)
<!-- 此刻不显示图片:
<img border="0" src="pic_mountain.jpg" alt="Mountain">
-->
- 定义 只在 IE 中执行的 HTML 代码
- 使用 条件注释
- 条件注释的开始 如何表示? 和普通注释的区别是什么?
<!--[if xxx]>
- 连字符后面 ,多了个 方括号+
if
,[if xxx]>
- 条件注释的结束 如何表示? 和普通注释的区别是什么?
<![endif]-->
- 连字符前面 ,多了个
!
+方括号+endif
,多了个![endif]
<!--[if IE 8]>
.... some HTML here ....
<![endif]-->
- 在 CSDN的博客中,可以看到的 条件注释
<!--[if lte IE 11]>
<meta name='csdn-browser-upgrade' content='为了获得更好的写作体验,建议更换<a href="https://www.google.cn/chrome/">Chrome</a>或<a href="http://www.firefox.com.cn/">FireFox</a>最新版浏览器'>
<![endif]-->
<!--[if lte IE 11]>
<script src="https://g.csdnimg.cn/browser_upgrade/1.0.2/browser_upgrade.js"></script>
<![endif]-->
结束语
- 捐助: 喜欢这篇文章吗? 持续更新中,捐助此文,向团团 表示鼓励和支持吧~❤
- 捐助二维码:
- 感谢:♥♥♥ 如果这篇文章 对您有帮助的话,可以点赞、评论、关注,鼓励下作者哦,感谢阅读 ~
- 欢迎指正: 如果发现 有需要 更正的细节问题,欢迎指正,谢谢大家 ~╮( ̄▽ ̄)╭
- 转载 请注明出处 ,Thanks♪(・ω・)ノ
- 作者:Hey_Coder
- 来源:CSDN
- 原文:https://blog.csdn.net/VickyTsai/article/details/89638966
- 版权声明:本文为博主原创文章,转载请附上博文链接!