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. 将tomcat设为开机自动启动

    参考网址:http://jingyan.baidu.com/article/a65957f4b12b8724e77f9b5a.html 方法一 1.Tomcat的使用之前必须得Jre,至于是怎么装的, ...

  2. ognl.NoSuchPropertyException

    [WARN ] 2013-11-21 14:56:25 :Error setting expression 'b2bAccOcPage.endB2bGrantDateString' with valu ...

  3. BFPRT(线性查找算法)

    BFPRT算法解决的问题十分经典,即从某n个元素的序列中选出第k大(第k小)的元素,通过巧妙的分 析,BFPRT可以保证在最坏情况下仍为线性时间复杂度.该算法的思想与快速排序思想相似,当然,为使得算法 ...

  4. 【Hibernate 5】继承映射配置及多态查询

    一.继承实现的三种策略 1.1,单表继承.每棵类继承树使用一个表(table per class hierarchy) -->本文主要介绍的继承策略 类继承树对应多个类,要把多个类的信息存放在一 ...

  5. VS2010 C++ 操作Excel表格的编程实现

    转载请注明原文网址: http://www.cnblogs.com/xianyunhe/archive/2011/09/25/2190485.html 通过VC实现对Excel表格的操作的方法有多种, ...

  6. Spring框架搭建遇到的问题汇总

    1.The resource is not on the build path of a Java project 然后把相应的依赖加入构建路径 2.Type mismatch: cannot con ...

  7. javaSE第八天

    第八天    43 1. 如何制作帮助文档(了解)    43 2. 通过JDK提供的API学习了Math类(掌握)    44 (1)API(Application Programming Inte ...

  8. javaSE第四天

    第四天    18 1. switch语句(掌握)    18 (1)格式:    18 (2)面试题    19 (3)执行流程:    19 (4)注意事项:    19 (5)案例:    19 ...

  9. 华为OJ—字符串排序(排序,忽略指定字符排序)

    http://career-oj.huawei.com/exam/ShowProblemInfo?id=2168 编写一个程序,将输入字符串中的字符按如下规则排序. 规则1:英文字母从A到Z排列,不区 ...

  10. 第四章_PHP基本语法(2)

    1.常量的声明 在PHP中,定义常量使用define()函数来实现 2.魔术常量 名称 作用 __LINE__ 返回文件中的当前行号 __FILE__ 返回该文件的完整路径和文件名 __DIR__ 返 ...