css中颜色的设置形式主要有三种方式:颜色名称、十六进制代码和十进制代码。

  在古老的 HTML4 时,颜色名称只有 16 种。

颜色名称 十六进制代码 十进制代码 含义
 black  #000000  0,0,0  黑色 
 silver  #c0c0c0  192,192,192  银色 
 gray  #808080  128,128,128  灰色
 white  #ffffff  255,255,255  白色
 maroon  #800000  128,0,0  栗色
 red   #ff0000  255,0,0  红色
 purple  #800080  128,0,128  紫色
 fuchsia  #ff00ff  255,0,255  紫红
 green  #008000  0,128,0  绿色
 lime  #00ff00  0,255,0  闪光绿
 olive  #808000  128,128,0  橄榄色
 yellow  #ffff00  255,255,0  黄色
 navy  #000080  0,0,128  海军蓝
 blue  #0000ff   0,0,255  蓝色
 teal  #008080  0,128,128  水鸭色
 aqua  #00ffff  0,255,255  浅绿色

  当然,目前颜色名称远远不止这些,可以搜索更多的 HTML 颜色表或 CSS 颜色表查阅。 这里提供一些页面如下:

  http://xh.5156edu.com/page/z1015m9220j18754.html

  http://finle.me/colors.html

  http://www.w3school.com.cn/tags/html_ref_colornames.asp


1.颜色名称形式

p {
color: red;
}

2.十六进制形式

p {
color: #ff0000;  /*可简写成:f00*/
}

补充:十六进制可以使用简写形式,其要求是从头开始,字符两两一组,且组内字符相同,如上所示。(像#8000080就不可以)


3.十进制形式

  十进制表示方法就比较多样化,有四种方案:

函数 说明 实例
rgb(r,g,b) 用 RGB 模型表示颜色 rgb(0,128,128)
rgba(r,g,b,a) 同上,a 表示透明度 0~1 之间 rgba(0,128,128,0.5)
hsl(h,s,l) 用 HSL 模型(色相、饱和度 和透明度)来表示颜色 hsl(120,100%,30%)
hsla(h,s,l,a) 同上, a 表示透明度 0~1 之间 hsla(120,100%,30%,0.5)
p {
color: rgb(112, 128, 114);
color: rgba(0, 128, 128, 0.5);
color: hsl(120, 100%, 30%);
color: hsla(120, 100%, 30%, 0.5);
}

  目前又有一个疑问,这些值从哪里获取。除了颜色表之外,想要微调自己的颜色值。我们可以使用 photoshop 等平面设计软件的调色板获取相应的值。

3.css中的颜色的更多相关文章

  1. CSS中的颜色问题

    css颜色: CSS 颜色 颜色是通过对红.绿和蓝光的组合来显示的 颜色值 CSS 颜色使用组合了红绿蓝颜色值 (RGB) 的十六进制 (hex) 表示法进行定义.对光源进行设置的最低值可以是 0(十 ...

  2. 在 CSS 中表示颜色的hex code方法和rgb方法

    hexadecimal code(十六进制编码),简写为 hex code. 我们通常使用 decimals,也就是十进制数字,它对每一位数字使用符号0到9来表示.Hexadecimals (或 he ...

  3. css中的单位和css中的颜色表示方法

    css中颜色的表示方式: 图片来源http://www.w3school.com.cn

  4. CSS中的颜色、长度、角度、时间

    一.颜色的表示方法 颜色是通过对红.绿和蓝光的组合来显示的. 1.颜色名 1 <!DOCTYPE html> 2 <html lang="en"> 3 &l ...

  5. css中的颜色

    我常用的是win10里面的自带的3D画图工具里面的颜色表 CSS 设置颜色的几种方式: 1.颜色名 2.rgb值 3十六进制表示 4. HSL color values CSS3 adds numer ...

  6. HTML与CSS中的颜色与单位个人分享

    颜色与单位 Web安全色有216中其中色彩有210中,非色彩6中 前景色与背景色 前景色就是设置字体的颜色 背景色就是为指定元素设置背景色 - 浏览器默认背景色的颜色为透明色 颜色的命名 1.使用单词 ...

  7. CSS中表示颜色的4种方法

    #1:直接用颜色名称 #2:十六进制数 #3:RGB整数设置颜色 0-255 #4:RGB百分数设置颜色0%-100%

  8. js函数实现转换css中常用的颜色编码

    //转换css中常用颜色编码 var toRGB = function (val){ var reg1 = /^#([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i; ...

  9. CSS中的HSLA颜色

    CSS 中的颜色可以由RGB色彩空间和HSL色彩空间两种方式来表述.其中我们常用的是RGB色彩空间,RGB色彩空间的颜色表示方式有:十六进制颜色(如红色:#FF0000).RGB颜色(如红色:rgb( ...

随机推荐

  1. 《Code Complete》ch.21 协同构建

    WHAT? 所有的协同构建技术都试图通过这样那样的途径,将展示工作的过程正式化,以便将错误暴露出来 WHY? 提高缺陷检出率,从而缩短开发周期,降低开发成本 发现不明显的错误信息,如不恰当的注释.硬编 ...

  2. Grunt 之 watch 和 livereload

    现在 watch 中已经集成了 livereload ,所以把它们放在一起说明. watch 可以监控特定的文件,在添加文件.修改文件.或者删除文件的时候自动执行自定义的任务,比如 livereloa ...

  3. visual studio R6034解决方案集 从VC6.0 或VC2003 到VC2005发现的问题

    这是我转的一篇非常全的帖子 能查到的解决方法都在里面有提及: 我是使用 stdafx.h加入这句 code #pragma comment(linker, "\"/manifest ...

  4. com学习(四)2——用 ATL 写第一个组件(vs2003)

    步骤2.1:建立一个解决方案. 步骤2.2:在 该解决方案中,新建一个 vc++ 的 ATL 项目.示例程序叫 Simple2,并选择DLL方式,见图一.图二. 图一.新建 ATL 项目 图二.选择非 ...

  5. PERT(计划评审技术,Program Evaluation an Review Technique)

    如果你对项目管理.系统架构有兴趣,请加微信订阅号"softjg",加入这个PM.架构师的大家庭 PERT(计划评审技术,Program Evaluation an Review T ...

  6. [linux] 替换字符串

    Linux下批量替换多个文件中的字符串的简单方法.用sed命令可以批量替换多个文件中的字符串. 命令如下:sed -i “s/原字符串/新字符串/g” `grep 原字符串 -rl 所在目录` 例如: ...

  7. 在 JNI 编程中避免内存泄漏

    JAVA 中的内存泄漏 JAVA 编程中的内存泄漏,从泄漏的内存位置角度可以分为两种:JVM 中 Java Heap 的内存泄漏:JVM 内存中 native memory 的内存泄漏. Java H ...

  8. 【EF 4】ORM框架及其流行产品之一EF介绍

    导读:跳进了多租户切换数据库的坑,那么就继续走下去吧.在我们的项目中,是运用EF实现对数据库的操作,那么EF其实是.NET系统中,基于ORM框架的一个产品实现.在java那边,则有Hibernate和 ...

  9. .NET平台下,关于数据持久层框架

    在.NET平台下,关于数据持久层框架非常多,本文主要对如下几种做简要的介绍并推荐一些学习的资源: 1.NHibernate 2.NBear 3.Castle ActiveRecord 4.iBATIS ...

  10. 用python3统计代码行数

    今天接到一个电话面试,对方问我在一个项目中维护了多少行代码. 我懵逼了,从来没有统计过啊,怎么还会有这种需求? 当时一脸茫然的想了想,回答了一个,呃...差不多两千多行吧...感觉很心虚 挂完电话之后 ...