CSS 文本字体颜色设置方法(CSS color)

一、认识CSS 颜色(CSS color)

这里要介绍的是网页设置颜色包含有哪些;网页颜色规定规范。

1、常用颜色地方包含:字体颜色、超链接颜色、网页背景颜色、边框颜色
2、颜色规范与颜色规定:网页使用RGB模式颜色

二、颜色基础知识

网页中颜色的运用是网页必不可少的一个元素。使用颜色目的在于有区别、有动感(特别是超链接中运用)、美观之用,同时颜色也是各种各样网页的样式表现元素之一,了解CSS 字体颜色。

传统的html颜色与w3c标准下的css颜色对比和DIV CSS运用颜色

CSS color颜色语法:

color:#000000;

Css样式中color后直接加RGB颜色值(#FFFFFF 、#000000 、#F00)
RGB颜色值在实际布局时候确定,可以使用Photoshop(简称PS)拾取工具进行获取获得。

三、两种方法设置对象颜色样式

1、在DIV标签内使用color颜色样式
<div style="color:#F00">www.jb51.net</div>

2、在CSS选择器中使用color颜色样式CSS代码:

.divcss5{color:#00F}

/* 设置对象divcss5内文字为蓝色 */

扩展阅读:这里运用了CSS注释对此样式设置说明,了解CSS 注释

3、DIV+CSS颜色样式完整案例:

Css代码:

复制代码

代码如下:

.divcss5{color:#00F}
/* 设置对象divcss5内文字为蓝色 */

HTML代码:

复制代码

代码如下:

<p>
标签内使用color css样式

<div style="color:#F00">www.jb51.net 红色</div>
</p>
<p>外部样式表设置对象color颜色

<div class="divcss5">www.jb51.net 蓝色</div>
</p>

4、实例结构图:

以上使用标签内使用color颜色样式和css代码使用color颜色样式。

四、文字颜色控制一样  

传统html和css 文字颜色相同使用“color:”+“RGB颜色取值”即可,如颜色为黑色字即对应设置CSS属性选择器内添加“color:#000;”即可。

五、网页背景颜色设置区别  

传统设置背景颜色使用“bgcolor=颜色取值”,而CSS中则“background:”+颜色取值。例如:设置背景为黑色,传统Html设置,即在标签内加入“bgcolor="#000"”即可实现颜色为黑色背景,如果在W3C中即在对应CSS选择器中始终“background:#000”实现。

六、设置边框颜色区别

传统“bordercolor=取值”,CSS中“border-color:”+颜色取值。例如:在传统html直接在table标签加入“bordercolor="#000"”即可,在现在CSS中设置“border-color:#000;”即可让边框颜色为黑色,同时记得对包括设置宽度和样式(虚线、实现)。

DIV+CSS颜色值扩展知识:
颜色值是一个关键字或一个数字的RGB规范。

16个关键字是采取从Windows的VGA调色板: 水色 , 黑色 , 蓝色 , 紫红色 , 灰 , 绿 , 灰 , 褐红色 ,藏青色, 橄榄色 , 紫色 , 红色 , 银色 , 青色 , 白色 , 黄色 。

七、RGB颜色给出了四种方法之一  

1、#rrggbb( 如 ,#00cc00) (强烈推荐使用此表示颜色取值)
2、#的RGB( 如 ,#0c0)
3、RGB(十中,x,x)的x是一个包容性的0和255之间的整数( 如 的RGB(0,204,0))
4、RGB(Ÿ%,Ÿ%,Ÿ%),其中 y是一个包容性的数量介于0.0和100.0( 如 的RGB(0%,80%,0%))

八、以下是RGB颜色表


当然一般的网页开发软件都有颜色取值器:


网页开发软件DW软件中CSS取色器

如何获得CSS颜色值?

我们又不能记住颜色值,以及如何确定准确的与美工图相同颜色值呢?其实很简单通常我们是在PS软件里通过识色器工具进行获得准确颜色值,当然也可以借用其它专门识别颜色工具进行获取准确的color颜色值。

九、div css color颜色样式总结


使用css样式设置对象内容color颜色样式,我们可以使用命名CSS类对象设置其颜色样式,还有直接在html标签内设置color样式。

CSS 文本字体颜色设置方法(CSS color)的更多相关文章

  1. [转载]Linux下终端字体颜色设置方法

    原文地址:Linux下终端字体颜色设置方法作者:router 网上类似的文章有很多,但是都是转来转去的,没有经过测试,按照很多文章的方法会造成你设置之后的终端在换行和删除输入字符时终端显示会乱七八糟, ...

  2. Linux下终端字体颜色设置方法

    颜色=\033[代码;前景;背景m 如:\033[1;32;40m表示高亮显示字体为绿色,背景色为黑色 颜色=\[\033[代码;前景;背景m\] echo -e "this is a \0 ...

  3. 超链接字体颜色设置(通过html/css的设置方法)

    超链接字体颜色设置是通过css来设置,a链接的颜色设置常用的有以下两种,1.超链接a的初始状态颜色,2.超链接字体的鼠标滑过颜色,还有两种病不常用:3.超链接字体的已访问颜色,4.超链接字体在按下鼠标 ...

  4. echarts x轴或y轴文本字体颜色改变

    1:x轴文本字体颜色改变 xAxis : [ { type : 'category', data : ['<30','30-','40-','50-','60-','>=70'], axi ...

  5. 【pycharm基本操作】项目创建、切换、运行、字体颜色设置,常见包的安装步骤

    创建新项目 退出项目 怎样区别虚拟环境和系统环境? 虚拟环境和系统环境切换:进入项目切换解释器 切换项目 创建python目录和文件 代码运行方式一: 还可以这样执行代码方式二: 文件的剪切.复制.删 ...

  6. 【转】IntelliJ IDEA 仿照vs2017快捷键设置,以及字体颜色设置

    因后期工作需要使用java技术栈,所以近期抽空下载了intelliJ IDEA工具,但是作为一个Net开发者,在使用了vs以后,感觉在使用别的开发工具感觉就是没法和vs相比,毕竟vs被称为宇宙最强id ...

  7. Python字体颜色设置

    Python字体颜色设置 平时学习工作中,我们经常会接触到一些大佬写的Python工具,运行起来总会显示出五颜六色的字体,比如红色代表Error , 黄色代表Warning , 绿色代表Success ...

  8. win7保护眼睛的颜色设置方法(85,125,205)

    win7保护眼睛的颜色设置方法(85,125,205) 在电脑桌面空白处点击右键“个性化”按钮. 在弹出的对话框单击“窗口颜色”. 在弹出的新的对话框中单击“高级外观设置”. 在弹出的窗口颜色和外观中 ...

  9. css宽度+字体+颜色+边框+文本+光标+伪类选择器

    常用属性: width:宽 height:高 min-width:最小宽度 :可以设置如果宽度变小了,有个滑动效果(常常在我们布局的过程中需要去设置) min-height;最小高度 max-widt ...

随机推荐

  1. POJ-2318 TOYS 计算几何 判断点在线段的位置

    题目链接:https://cn.vjudge.net/problem/POJ-2318 题意 在一个矩形内,给出n-1条线段,把矩形分成n快四边形 问某些点在那个四边形内 思路 二分+判断点与位置关系 ...

  2. [NOIP2015普及组]推销员

    题目:洛谷P2672.codevs5126.Vijos P1977 题目大意:有个推销员要去推销,要你求他推销1~n户人家分别最多花多少“疲劳值”.具体见题目. 解题思路:如果用$O(n^2)$做的话 ...

  3. 【转载】02-PowerDesigner的下载及安装

    原创路径:https://blog.csdn.net/ruyu00/article/details/79842807 一.下载 下载路径:https://pan.baidu.com/s/1WD7QHT ...

  4. Java基础学习总结(4)——对象转型

    一.对象转型介绍 对象转型分为两种:一种叫向上转型(父类对象的引用或者叫基类对象的引用指向子类对象,这就是向上转型),另一种叫向下转型.转型的意思是:如把float类型转成int类型,把double类 ...

  5. 2015 Multi-University Training Contest 1 OO’s Sequence

    OO’s Sequence Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)T ...

  6. 物理读之LRU(近期最少被使用)的深入解析

    转载请注明出处: http://blog.csdn.net/guoyjoe/article/details/38264883 一组LRU链表包含LRU主链.LRU辅助链.LRUW主链,LRUW辅助链, ...

  7. UVA10491 - Cows and Cars(概率)

    UVA10491 - Cows and Cars(概率) 题目链接 题目大意:给你n个门后面藏着牛.m个门后面藏着车,然后再给你k个提示.在你作出选择后告诉你有多少个门后面是有牛的,如今问你作出决定后 ...

  8. nyoj--1009--So Easy[Ⅰ](数学)

    So Easy[Ⅰ] 时间限制:1000 ms  |  内存限制:65535 KB 难度:2 描述 给出任意一个三角形的三个边a,b,c. 要求:求出这个三角形的外接圆半径. 输入 输入数据有多组. ...

  9. 监控rman备份

    1.服务会话关联通道设置 set COMMAND ID 命令 2.查询V$PROCESS和V$SESSION 决定会话对应的RMAN的通道 3.查询V$session_LONGGOPS监控备份集和复制 ...

  10. 减少XML文件数

    在android开发中,做出漂亮的ui的应用,往往有数量庞大的xml文件.比如,我们要给一个Button加上一个selector,如果背景不是图片,就得写三个xml文件,分别是:edit_focuse ...