一文详解HTML注释和颜色(颜色名、十六进制值)

本篇文章带大家了解一下html注释和颜色,并分享一些常用颜色名、十六进制值,希望对大家有所帮助!

一文详解HTML注释和颜色(颜色名、十六进制值)

一、HTML注释(附带示例)

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

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

立即学习“前端免费学习笔记(深入)”;

单行注释

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

          HTML注释的写法        

欢迎来到PHP中文网

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

多行注释

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

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

IE 条件注释

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

        IE浏览器条件注释

根据不同的 IE 版本显示不同的内容

在 IE8 下的运行效果:

1.png

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

2.png

条件注释可以检测当前浏览器是否是 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 Name HEX Color

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 色调色板时,所有的计算机能够正确地显示所有的颜色。

4.png

相关推荐:《html视频教程》

以上就是一文详解HTML注释和颜色(颜色名、十六进制值)的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1550924.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月21日 21:08:58
下一篇 2025年12月21日 21:09:13

相关推荐

  • 深入解析head标签中常用的头部标签

    标签的内容必须与当前文档有关,并且不应该过长,中文页面请尽量控制在 30 个字符(包括空格)以内。 2、 标签 标签用于为页面中所有相对链接指定一个基本链接,当您设置了基本链接后,当前页面中的所有相对链接都会使用这个基本链接作为前缀,如下例所示: 标签演示 视频教程 入门教程 上面的示例中第一个 标…

    2025年12月21日 好文分享
    000
  • html怎么设置按钮文字

    方法:1、设置“”和“”间的内容,语法“按钮文字”;2、设置input元素中value属性的值,语法“”。 本教程操作环境:windows7系统、HTML5版、Dell G3电脑。 html有两种按钮: button按钮 input按钮 立即学习“前端免费学习笔记(深入)”; 两种按钮设置按钮文字的…

    2025年12月21日
    000
  • html怎么让图片上下移动

    html让图片上下移动的方法:1、使用animation属性给图片绑定一个移动动画;2、使用“@keyframes 动画名称 {50%{transform:translateY(移动距离);}}”语句定义动画每一帧的动作,控制图片上下移动。 本教程操作环境:windows7系统、CSS3&&…

    2025年12月21日
    000
  • html5中元素能拉伸宽度吗

    html中元素能拉伸宽度,只需要利用style、transform属性配合scaleX()函数设置元素宽度的拉伸倍数即可,语法为“”。 本教程操作环境:windows10系统、HTML5版、Dell G3电脑。 html5中元素能拉伸宽度吗 在html中,想要拉伸元素的宽度需要利用到style、tr…

    2025年12月21日
    000
  • html5中onclick是什么意思

    html5中onclick的意思是“单击”,onclick属性是鼠标事件的一种,在单击鼠标时触发,用于规定事件触发时执行的脚本,语法为“”。 本教程操作环境:windows10系统、HTML5版、Dell G3电脑。 html5中onclick是什么意思 onclick是HTML标记对象的一个属性。…

    2025年12月21日
    000
  • html怎么放大图片

    方法:1、利用width和height属性放大图片,语法“”;2、用style和transform属性放大图片,语法“”。 本教程操作环境:windows10系统、HTML5版、Dell G3电脑。 html怎么放大图片 在html中想要放大图片有两种方法 一种是重新设置图片元素的高度和宽度,这时候…

    2025年12月21日
    000
  • html不常用的标签有哪些

    html不常用的标签有:pre、figure、figcaption、em、strong、del、ins、sub、sup、ruby、bdo、vedio、audio、track、optgroup、output、progress、meter等等。 本教程操作环境:windows7系统、HTML5版、Del…

    2025年12月21日 好文分享
    000
  • HTML怎么设置td内容居中

    设置方法:1、利用align属性,语法“…”;2、利用style属性添加居中对齐样式,语法“…”。 本教程操作环境:windows7系统、HTML5版、Dell G3电脑。 HTML设置td内容居中 1、利用align属性 align 属性规定单元格中内容的水平对齐方式。当属…

    2025年12月21日
    000
  • html表格怎么设置行高

    html表格设置行高的方法:1、给tr或td元素设置height属性,语法“”;2、利用style属性给tr或td元素添加height样式,语法“”。 本教程操作环境:windows7系统、HTML5版、Dell G3电脑。 我们有下面一个表格: 商品价格T恤¥100牛仔褂¥250牛仔库¥150 怎…

    2025年12月21日 好文分享
    000
  • html怎样设置select默认不选中

    设置方法:1、在select标签内的第一个option标签设置为空;2、给option空标签添加“display:none”样式,即可设置select默认不选中,语法为“”。 本教程操作环境:windows10系统、HTML5版、Dell G3电脑。 html怎样设置select默认不选中 默认情况…

    2025年12月21日
    000
  • 十分钟搞懂form标签中的GET和POST提交方式

    本篇文章给大家带来了form标签中get和post两种提交方式的相关知识以及比较,form表单的作用是收集标签中的内容, … 中间可以由访问者添加类似于文本,选择,或者一些控制模块等等.然后这些内容将会被送到服务端,希望对大家有帮助。 form标签中的GET和POST 在HTML中,fo…

    2025年12月21日 好文分享
    000
  • html div怎么设置宽度

    html div设置宽度的方法:1、给div元素添加“width:宽度值;”样式设置固定宽度;2、给div元素添加“min-width:宽度值;”样式设置最小宽度;3、给div元素添加“max-width:宽度值;”样式设置最大宽度。 本教程操作环境:windows7系统、CSS3&&amp…

    2025年12月21日 好文分享
    000
  • html怎么设置div高度

    html设置div高度的方法:1、给div元素添加“height:高度值;”样式设置固定高度;2、给div元素添加“min-height:高度值;”样式设置最小高度;3、给div元素添加“max-height:高度值;”样式设置最大高度。 本教程操作环境:windows7系统、CSS3&&a…

    2025年12月21日 好文分享
    000
  • html怎么设置div的透明度

    html设置div透明度的方法:1、利用opacity属性,只需要给div元素添加“opacity: 透明度值;”样式即可;2、利用filter属性,只需要给div元素添加“filter:opacity(透明度值);”样式即可。 本教程操作环境:windows7系统、CSS3&&HT…

    2025年12月21日 好文分享
    000
  • html怎么设置a标签位置

    设置方法:1、给a标签的父标签添加“position: relative;”样式,进行相对定位;2、给a标签添加“position: absolute;”样式进行绝对定位;3、用top、bottom、left、right属性控制a标签位置。 本教程操作环境:windows7系统、CSS3&&…

    2025年12月21日
    000
  • html textarea怎么设置大小

    设置方法:1、给textarea设置cols和rows属性,语法“”;2、给extarea添加“width:宽度值;height:高度值;”样式。 本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。 html textarea设置大小 标签定义一个多…

    2025年12月21日 好文分享
    000
  • html怎么设置下划线长度

    html设置下划线长度的方法:1、给元素添加“display: block;”样式将其变成块级元素;2、使用border-bottom属性设置下划线样式;3、利用width属性控制下划线长度,语法“width:长度值;”。 本教程操作环境:windows7系统、CSS3&&HTML5…

    2025年12月21日
    000
  • html怎么禁止横向滚动

    在html中,可以利用overflow-x属性来禁止横向滚动,只需要给body元素添加“overflow-x:hidden;”样式即可;该样式可以规定当内容横向超出页面时,不提供横向滚动机制,而是裁剪并隐藏溢出的内容。 本教程操作环境:windows7系统、CSS3&&HTML5版、…

    2025年12月21日
    000
  • html怎么设置下拉框option不可选

    在html中,可以通过给option标签元素设置disabled属性,禁用指定选项,让指定option不可选,语法“选项值”。 本教程操作环境:windows7系统、HTML5版、Dell G3电脑。 在html中,可以通过给option标签元素设置disabled属性来让option不可选。 di…

    2025年12月21日
    000
  • html怎么去掉button的边框

    方法:1、利用border-style属性,给button元素添加“border-style:none;”样式即可;2、利用border-color属性,给button元素添加“border-color:transparent;”样式即可。 本教程操作环境:windows7系统、CSS3&&…

    2025年12月21日
    000

发表回复

登录后才能评论
关注微信