iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >HTML注释和颜色实例分析
  • 439
分享到

HTML注释和颜色实例分析

2024-04-02 19:04:59 439人浏览 泡泡鱼
摘要

这篇文章主要介绍“html注释和颜色实例分析”,在日常操作中,相信很多人在HTML注释和颜色实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”HTML注释和颜色实例分析”

这篇文章主要介绍“html注释和颜色实例分析”,在日常操作中,相信很多人在HTML注释和颜色实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”HTML注释和颜色实例分析”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

HTML注释和颜色实例分析

一、HTML注释(附带示例)

HTML 注释主要用来对文档中的代码进行解释说明,注释也是代码的一部分,但浏览器会自动忽略注释的内容,所以用户在网页中是看不到注释的。

我们在编写代码时应该善用注释,因为一个完整的 HTML 文档往往由成百上千行代码组成,当我们想要修改其中的某个部分时可能需要花费很长的时间才能找到想要修改的地方。有了注释就不一样了,我们可以根据功能或者其它条件将程序划分为若干个部分并通过注释进行标记,这样可以帮助您和他人阅读您的代码,提高代码的可读性。

单行注释

在 HTML 中您可以使用<!--  -->在代码中添加注释,<!--和-->之间的所有内容都会被视为注释。示例代码如下:

<!DOCTYPE html>
<html>
<!-- head 开始 -->
<head>
    <meta charset="UTF-8">  <!-- 当前文档采用UTF-8编码 -->
    <title>HTML注释的写法</title>
</head>
<!-- head 结束 -->
<!-- body 开始 -->
<body>
    <!-- 一段文本 -->
    <p>欢迎来到编程网</p>
</body>
<!-- body 结束 -->
</html>

注释可以出现在 HTML 文档的任意位置,包括文档开头、文档末尾、文档中间、标签外部、标签内容中等。

多行注释

前面我们主要演示的是单行注释,在 HTML 中同样支持多行注释。多行注释与单行注释的区别并不大,我们只需要保证注释的内容在<!---->之间即可,如下所示:

<!--
    多行注释
-->

使用注释除了可以对代码进行说明外,还可以用来注释程序中的代码,例如当不希望某段代码执行时,就可以先将它们注释掉,这样浏览器就不会执行这段代码了。

IE 条件注释

条件注释仅对 windows 系统上的 Internet Explorer(IE)浏览器中有效,其他的浏览器会忽略它们。从 IE5 开始支持条件注释,您可以使用条件注释为使用 IE 浏览器的用户提供一些说明。如下所示:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>IE浏览器条件注释</title>
</head>
<body>
<h5>根据不同的 IE 版本显示不同的内容</h5>
<!-- 如果使用 IE,则显示 -->
    <!--[if IE]>
        <p>您正在使用IE浏览器</p>
    <![endif]-->
    <!-- 如果使用 IE8,则显示 -->
    <!--[if IE 8]>
        <p>您正在使用 IE8</p>
    <![endif]-->
    <!-- 如果不是使用 IE7,则显示 -->
    <!--[if !IE 7]>
        <p>您使用的不是 IE7</p>
    <![endif]-->
    <!-- 如果版本小于 IE10,则显示 -->
    <!--[if lt IE 10]>
        <p>您正在使用 IE10 以下的版本</p>
    <![endif]-->
    <!-- 如果版本大于等于 IE6,则显示 -->
    <!--[if gte IE 6]>
        <p>您正在使用 IE6 及其以上的版本</p>
    <![endif]-->
</body>
</html>

在 IE8 下的运行效果:

HTML注释和颜色实例分析

在 Chrome 浏览器下的运行效果:

HTML注释和颜色实例分析

条件注释可以检测当前浏览器是否是 IE,以及 IE 版本,开发人员可以根据不同的 IE 浏览器加载不同的样式表或者 js 脚本。

比较 IE 版本将会用到如下关键字:

  • lt:less than 的简写,也就是小于的意思。

  • lte:less than or equal to 的简写,也就是小于或等于的意思。

  • gt:greater than 的简写,也就是大于的意思。

  • gte:greater than or equal to 简写,也就是大于或等于的意思。

  • !:不等于

IE 浏览器对 HTML5 支持不太友好,低版本的行为更是怪异,IE 已经逐渐退出市场,各大互联网巨头也不再兼容 IE,大家在开发过程中也不用重点考虑 IE。

二、HTML 颜色值的设置

HTML 颜色由红色、绿色、蓝色混合而成。

1、浏览器都支持颜色名称集合,颜色值是一个关键字或者是一个 RGB 格式的数字,在网页中部用的很多。

2、使用英文单词作为颜色值:

  • red 红色 |green 绿色 | blue 蓝色 | pink 粉色 | purple 紫色等。

3.六位的十六进制颜色值:

  • #ff0000 简写:#f00

  • 前两位表示红色,中间两位表际绿色,最后两位表示蓝色。

单击一个颜色名或者 16 进制值,就可以查看与不同文字颜色搭配的背景颜色。

Color NameHEXColor
AliceBlue#F0F8FF
AntiqueWhite#FAEBD7
Aqua#00FFFF
Aquamarine#7FFFD4
Azure#F0FFFF
Beige#F5F5DC
Bisque#FFE4C4
Black#000000
BlanchedAlmond#FFEBCD
Blue#0000FF
BlueViolet#8A2BE2
Brown#A52A2A
BurlyWood#DEB887
CadetBlue#5F9EA0
Chartreuse#7FFF00
Chocolate#D2691E
Coral#FF7F50
CornflowerBlue#6495ED
Cornsilk#FFF8DC
Crimson#DC143C
Cyan#00FFFF
DarkBlue#00008B
DarkCyan#008B8B
DarkGoldenRod#B8860B
DarkGray#A9A9A9
DarkGreen#006400
DarkKhaki#BDB76B
DarkMagenta#8B008B
DarkOliveGreen#556B2F
DarkOrange#FF8C00
DarkOrchid#9932CC
DarkRed#8B0000
DarkSalmon#E9967A
DarkSeaGreen#8FBC8F
DarkSlateBlue#483D8B
DarkSlateGray#2F4F4F
DarkTurquoise#00CED1
DarkViolet#9400D3
DeepPink#FF1493
DeepSkyBlue#00BFFF
DimGray#696969
DodgerBlue#1E90FF
FireBrick#B22222
FloralWhite#FFFAF0
ForestGreen#228B22
Fuchsia#FF00FF
Gainsboro#DCDCDC
GhostWhite#F8F8FF
Gold#FFD700
GoldenRod#DAA520
Gray#808080
Green#008000
GreenYellow#ADFF2F
HoneyDew#F0FFF0
HotPink#FF69B4
IndianRed#CD5C5C
Indigo#4B0082
Ivory#FFFFF0
Khaki#F0E68C
Lavender#E6E6FA
LavenderBlush#FFF0F5
LawnGreen#7CFC00
LemonChiffon#FFFACD
LightBlue#ADD8E6
LightCoral#F08080
LightCyan#E0FFFF
LightGoldenRodYellow#FAFAD2
LightGray#D3D3D3
LightGreen#90EE90
LightPink#FFB6C1
LightSalmon#FFA07A
LightSeaGreen#20B2AA
LightSkyBlue#87CEFA
LightSlateGray#778899
LightSteelBlue#B0C4DE
LightYellow#FFFFE0
Lime#00FF00
LimeGreen#32CD32
Linen#FAF0E6
Magenta#FF00FF
Maroon#800000
MediumAquaMarine#66CDAA
MediumBlue#0000CD
MediumOrchid#BA55D3
MediumPurple#9370DB
MediumSeaGreen#3CB371
MediumSlateBlue#7B68EE
MediumspringGreen#00FA9A
MediumTurquoise#48D1CC
MediumVioletRed#C71585
MidnightBlue#191970
MintCream#F5FFFA
MistyRose#FFE4E1
Moccasin#FFE4B5
NavajoWhite#FFDEAD
Navy#000080
OldLace#FDF5E6
Olive#808000
OliveDrab#6B8E23
Orange#FFA500
OrangeRed#FF4500
Orchid#DA70D6
PaleGoldenRod#EEE8AA
PaleGreen#98FB98
PaleTurquoise#AFEEEE
PaleVioletRed#DB7093
PapayaWhip#FFEFD5
PeachPuff#FFDAB9
Peru#CD853F
Pink#FFC0CB
Plum#DDA0DD
PowderBlue#B0E0E6
Purple#800080
Red#FF0000
RosyBrown#BC8F8F
RoyalBlue#4169E1
SaddleBrown#8B4513
Salmon#FA8072
SandyBrown#F4A460
SeaGreen#2E8B57
Seashell#FFF5EE
Sienna#A0522D
Silver#C0C0C0
SkyBlue#87CEEB
SlateBlue#6A5ACD
SlateGray#708090
Snow#FFFAFA
SpringGreen#00FF7F
SteelBlue#4682B4
Tan#D2B48C
Teal#008080
Thistle#D8BFD8
Tomato#FF6347
Turquoise#40E0D0
Violet#EE82EE
Wheat#F5DEB3
White#FFFFFF
WhiteSmoke#F5F5F5
Yellow#FFFF00
YellowGreen#9ACD32

Web安全色

数年以前,当大多数计算机仅支持 256 种颜色的时候,一系列 216 种 WEB 安全色作为 Web 标准被建议使用。其中的原因是,微软和 Mac 操作系统使用了 40 种不同的保留的固定系统颜色(双方大约各使用 20 种)。

我们不确定如今这么做的意义有多大,因为越来越多的计算机有能力处理数百万种颜色,不过做选择还是你自己。

最初,216 跨平台 web 安全色被用来确保:当计算机使用 256 色调色板时,所有的计算机能够正确地显示所有的颜色。

HTML注释和颜色实例分析

到此,关于“HTML注释和颜色实例分析”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

--结束END--

本文标题: HTML注释和颜色实例分析

本文链接: https://www.lsjlt.com/news/98438.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • HTML注释和颜色实例分析
    这篇文章主要介绍“HTML注释和颜色实例分析”,在日常操作中,相信很多人在HTML注释和颜色实例分析问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”HTML注释和颜色实例分析”...
    99+
    2024-04-02
  • HTML十六进制颜色实例分析
    这篇文章主要介绍了HTML十六进制颜色实例分析的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇HTML十六进制颜色实例分析文章都会有所收获,下面我们一起来看看吧。 十六进制色调...
    99+
    2024-04-02
  • HTML注释与样式表实例分析
    这篇文章主要介绍“HTML注释与样式表实例分析”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“HTML注释与样式表实例分析”文章能帮助大家解决问题。   ...
    99+
    2024-04-02
  • CSS RGB颜色值实例分析
    本文小编为大家详细介绍“CSS RGB颜色值实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“CSS RGB颜色值实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。 ...
    99+
    2024-04-02
  • OpenCV中的颜色空间实例分析
    这篇文章主要讲解了“OpenCV中的颜色空间实例分析”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“OpenCV中的颜色空间实例分析”吧!1 不同的色彩空间在本节中,我们将介绍计算机视觉中使用...
    99+
    2023-06-30
  • HTML5颜色修改示例分析
    这篇文章主要介绍“HTML5颜色修改示例分析”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“HTML5颜色修改示例分析”文章能帮助大家解决问题。 Chrome支持i...
    99+
    2024-04-02
  • CSS颜色体系的示例分析
    这篇文章主要介绍了CSS颜色体系的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。先用一张图直观的感受一下与 CSS 颜色相关大概覆盖...
    99+
    2024-04-02
  • CSS背景颜色的示例分析
    这篇文章主要为大家展示了“CSS背景颜色的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“CSS背景颜色的示例分析”这篇文章吧。 1、bac公斤roun...
    99+
    2024-04-02
  • crontab快速注释及撤销注释的示例分析
    crontab快速注释及撤销注释的示例分析,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。我们知道一般情况下,编写crontab需要使用vi编辑器进行编辑。通过v...
    99+
    2023-06-06
  • HTML实例分析
    今天小编给大家分享一下HTML实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。HTML是什么HTML 是一种语言,它的...
    99+
    2023-06-27
  • Python中matplotlib内置单颜色的示例分析
    小编给大家分享一下Python中matplotlib内置单颜色的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!1、matplotlib支持的颜色格式RGB 或者 RGBA 元组格式颜色元组中浮点型数值位于 [0, ...
    99+
    2023-06-29
  • HTML的实例分析
    这篇文章主要为大家展示了“HTML的实例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“HTML的实例分析”这篇文章吧。 实例:<!doctype&n...
    99+
    2024-04-02
  • Java基础之颜色工具类的示例分析
    这篇文章主要介绍Java基础之颜色工具类的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!常用的java框架有哪些1.SpringMVC,Spring Web MVC是一种基于Java的实现了Web MVC设计...
    99+
    2023-06-14
  • Html头部和标题实例分析
    这篇“Html头部和标题实例分析”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Html头部...
    99+
    2024-04-02
  • CSS RGBA色采实例分析
    今天小编给大家分享一下CSS RGBA色采实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一...
    99+
    2024-04-02
  • Spring Ioc和DI注解实例分析
    今天小编给大家分享一下Spring Ioc和DI注解实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。1.Sp...
    99+
    2023-06-29
  • Java注解和异常实例分析
    今天小编给大家分享一下Java注解和异常实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。注解作用注解是JDK1.5版本...
    99+
    2023-07-02
  • HTML使用实例分析
    本篇内容介绍了“HTML使用实例分析”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! HTML 标题 ...
    99+
    2024-04-02
  • HTML表单实例分析
    这篇文章主要介绍了HTML表单实例分析的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇HTML表单实例分析文章都会有所收获,下面我们一起来看看吧。 <!DOCTYPE...
    99+
    2024-04-02
  • HTML表格实例分析
    本篇内容主要讲解“HTML表格实例分析”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“HTML表格实例分析”吧! table 【默认样式】 复制代码 //...
    99+
    2024-04-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作