文档章节

CSS中background-color属性(二)

博为峰教研组
 博为峰教研组
发布于 2017/03/27 14:41
字数 396
阅读 10
收藏 0

3. 十六进制表示法

红色:

 

1 background-color: #ff0000;

所有用#开头的值,都是16进制的。

#ff0000

16进制表示法,也是两位两位看,看r、g、b,但是没有逗号隔开。

ff就是10进制的255 ,00 就是10进制的0,00就是10进制的0。所以等价于rgb(255,0,0);

怎么换算呢,这里我们来介绍一下

我们现在看一下10进制中的基本数字(一共10个):

0、1、2、3、4、5、6、7、8、9

 

16进制中的基本数字(一共16个):

0、1、2、3、4、5、6、7、8、9、a、b、c、d、e、f

16进制对应表:

十六进制中,13 这个数字表示什么?

表示1个16和3个1。 那就是19。 这就是位权的概念,开头这位表示多少个16,末尾这位表示多少个1。


如: 

16进制中的2b等于10进制多少?

答:2*16+11 = 43。

所以,#ff0000就等于rgb(255,0,0)

 

1 background-color: #123456;

等价于:

1 background-color: rgb(18,52,86);

 

所以,任何一种十六进制表示法,都能够换算成为rgb表示法。也就是说,两个表示法的颜色数量,一样

 

十六进制可以简化为3位,所有#aabbcc的形式,能够简化为#abc;

比如:

1 background-color:#ff0000;

等价于

1 background-color:#f00;

 

比如:

1 background-color:#112233;

等价于

1 background-color:#123;

 

只能上面的方法简化,比如

1 background-color:#222333;

无法简化!

再比如

1 background-color:#123123;

无法简化!

 

要记住:

1 #000   黑

2 #fff    白

3 #f00   红

4 #333   灰

5 #222   深灰

6 #ccc   浅灰

 

 

 

© 著作权归作者所有

博为峰教研组
粉丝 51
博文 1224
码字总数 479077
作品 0
黄浦
程序员
私信 提问
input按钮的background-image属性兼容性问题

一般来说,设置input按钮的background-image属性,在Firefox,Chrome等标准W3C浏览器中,只要写二行css: background-image: url(images/hello.jpg); background-repeat: no-repeat; 但是在IE下...

serverking6
2013/08/22
0
0
CSS选择器笔记

去年我学jQuery的时候,曾经做过一点选择器(selector)的笔记。 这几天拿出来看了一下,发现很多都忘记了。所以,我决定把它们贴在这里,方便以后查看。这对其他朋友应该也是有用的,毕竟选...

阮一峰
2009/03/12
0
0
JS中style属性(网上整理)

解决办法: 1、先定义一个CSS规则,然后this.className='' 2、document.getElementByIdx_x("a").style.cssText="border-collapse:collapse;border-spacing:1;border:1 solid #0B2565;backgro......

The-duke
2014/01/16
324
0
Java程序员从笨鸟到菜鸟之(十六)CSS基础积累总结(上)

一:CSS的工作原理 1.基本的CSS语法 比方说,我们要用红色作为网页的背景色: 用HTML的话,我们可以这样: 用CSS的话,我们可以这样获得同样的效果: body {background-color: #FF0000;} 上例...

长平狐
2012/11/12
84
0
前端设计师必知的background属性(有CSS3内容)

回顾 css2中有五个与背景相关的属性。它们是: background-color: 完全填充背景的颜色 background-image: 用作背景的图片 background-position: 确定背景图片的位置 background-repeat: 确定...

黑魔法
2016/07/19
62
0

没有更多内容

加载失败,请刷新页面

加载更多

zk中ToBeAppliedRequestProcessor解析

ToBeAppliedRequestProcessor在Leader中 在已处理事务和最后处理事务处理器之间,处理器链上下一个是FinalRequestProcessor public void processRequest(Request request) throws RequestPro...

writeademo
33分钟前
3
0
Allegro快捷键设置-PCB环境

立题简介: 内容:简单介绍Allegro绘制的PCB环境下的快捷键; 来源:实际使用得出; 作用:对Allegro绘制PCB快捷键进行介绍; PCB环境:Cadence 16.6; 立题详解: 对“allegro”板而言,其在...

demyar
34分钟前
3
0
idea maven web项目启动build时报错java.lang.NullPointerException

之前还好好的,重启一下idea就报这个错了,大概率是tomcat没杀掉端口被占用了,在tomcat配置中更换一下sever端口就好了

宇辰OSC
38分钟前
3
0
weed3-2.3.1.查询之输出

Weed3 一个超轻量级ORM框架(只有0.1Mb哦) 源码:https://github.com/noear/weed3 源码:https://gitee.com/noear/weed3 查询可是个复杂的话题了,可能我们80%的数据库处理都在查询。 今天先...

刘之西东
38分钟前
3
0
【Android JetPack系列】数据绑定:DataBinding

参考MVVM

Agnes2017
47分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部