当前位置:首页 > 前端技术 > HTML中style/css/color设置颜色值(RGB值)的几种方法(常见颜色和色值)

HTML中style/css/color设置颜色值(RGB值)的几种方法(常见颜色和色值)

2022年08月06日 11:38:22前端技术2

一般成体系的前端开发,会有UED给出具体的值,也会统一一个表达方式,所以开发不用关心值的问题。
但日常仍然会遇到很多表达方式的不同,尤其是十进制和十六进制转换太麻烦,所以特别记录下不同的表达方式。

颜色是UI中必不可少的组成部分,所以color属性使用很频繁,比如文字(color)、背景色(background-color)、边框色(border-color)等。

这里只记录几种常见的表达方式,所有支持的方式可参考 1

方式 样例 说明
颜色英文 color:blue css1~css3,支持的颜色种类越来越多了,具体可以参考 2 ;注意不同浏览器对颜色的渲染可能有所不同
RGB值 color:rgb(100,100,100) 三原色:r代表red红色,g代表green绿色,b代表blue蓝色
括号中值依次为红绿蓝(每个值范围在0~255之间)
十六进制 color:#C3B2A1 每个颜色占两位、顺序依次为红绿蓝;
* #CCBBAA可简写为#CBA

自用取色工具推荐:


  1. color属性:https://www.w3school.com.cn/cssref/css_colors_legal.asp ↩︎

  2. color的固定名:https://www.w3schools.com/cssref/css_colors.asp ↩︎

作者:王大雄_
来源链接:https://blog.csdn.net/zgdwxp/article/details/100096097

版权声明:
1、JavaClub(https://www.javaclub.cn)以学习交流为目的,由作者投稿、网友推荐和小编整理收藏优秀的IT技术及相关内容,包括但不限于文字、图片、音频、视频、软件、程序等,其均来自互联网,本站不享有版权,版权归原作者所有。

2、本站提供的内容仅用于个人学习、研究或欣赏,以及其他非商业性或非盈利性用途,但同时应遵守著作权法及其他相关法律的规定,不得侵犯相关权利人及本网站的合法权利。
3、本网站内容原作者如不愿意在本网站刊登内容,请及时通知本站(javaclubcn@163.com),我们将第一时间核实后及时予以删除。


本文链接:https://www.javaclub.cn/front/18214.html

分享给朋友:

“HTML中style/css/color设置颜色值(RGB值)的几种方法(常见颜色和色值)” 的相关文章

HTML5结构标签

GUIDM在这里祝大家节日快乐! 博主有话说:如果有描述错误之处请大家纠正。让我们可以一起学习一起进步。 个人主页:GUIDM的主页 内容专栏:HTML5干货系列 此块内容为纯纯的干货,略显乏味枯燥,是笔记向的blog。如果觉得还不错,希...

HTML常用标签及其用法总结

HTML常用标签及其用法总结

1、HTML分块--------< div> 说起HTML的标签,不得不提起的就是< div>,在制作一个网页的时候,应该先将他们划分为许多个块,再在这些块中进行操作。 整个电脑能够显示是因为显示屏上一个一个的小颗粒,如下宽度:1...

HTML常用标签的用法

HTML常用标签的用法

一、首先要了解一下什么是HTML,HTML(Hyper Text Markup Language,简称:HTML)也叫作超文本标记语言,是一种使用结构化Web网页及其内容的标记语言,HTML文档也叫做Web页面, 下面就来讲讲一些HTML中常用的标签。...

Markdown中使用html标签

有时候,我们会在笔记中使用一些HTML标签,但是Markdown中直接使用html标签会被解析为格式.该怎么书写,可以直接显示为html的标签呢. <h1>这是一个标题</h1> //其中的<h1&g...

HTML之框架结构标签的简单使用

框架标签的简单使用 框架: 通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面,简而言之,就是在一个窗口中显示多个页面。 每个页面称之为一个框架。并且每个框架独立于其他的框架。 使用...

HTML框架结构标签(frameset)

HTML框架结构标签(frameset)

第一次了解到竟然还有HTML框架结构标签()。为此小编在实例中应用了一下,但是在搭建框架之初就遇到 了问题。为此总结本博客,以便大家能及时解决问题。 什么是HTML框架结构标签(<frameset>)...

html标签汇总

html标签汇总

文章目录 段落处理 图像标签 超链接 注释 特殊字符 表格 列表标签 无序列表 有序列表 自定义列表...

HTML表单标签常用属性及其常见子标签

表单标签 通过form来定义 <form> //1.input类型 //2.select类型 //3.textarea类型 </form> 常用属性 ​ action:提交路径,默认是当...

v-html 解析并插入 html 标签

v-html 解析并插入 html 标签

1. 双大括号会将数据解释为普通文本,而非 HTML 代码。 <div id="app"> <p id="a">Using mustaches: { { rawHtml }}</p> <p >Using v-ht...

HTML 5 video 视频标签全属性详解

现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera、Mozilla、Chrome),支持H.264的(Safari、IE 9、Chrome),都不支持的(IE6、7、8)。好吧,现在让我们从技术层面...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。