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. 越努力越幸运--2-LD_PRELOAD, fork ,僵尸进程

    开始新的工作了,做了爸爸之后感觉一直都是浑浑噩噩,希望老婆和宝宝一直健康开心~ 最近遇到的问题很多啊,哈哈 1. 装环境时候,需要的glibc 版本不对,我把本地的软链接改了个别名(惯性思维),然后一 ...

  2. 【问题】解决python3不支持mysqldb

    Django框架使用的还是python2.x的MySQLdb,而python3.x使用的是pymysql,centos7上默认安装的python2.7,自己安装了python3.6的版本,在运行dja ...

  3. 紫书 习题 8-17 UVa 11536 (滑动窗口)

    这道题说连续子序列, 马上就想到滑动窗口. 注意窗口里面的元素中小于等于k的才是有效元素.记录窗口里面有效元素的个数, 满足了之后开始 缩短窗口, 如果左端点不是有效元素或者即使窗口中存在这个元素的个 ...

  4. Generator 简介

    Generator 就是一种状态机,封装多个内部状态. 执行 Generator 函数会返回一个遍历器对象(),也就是说,Generator 函数除了状态机,还是一个遍历器对象生成函数.返回的遍历器对 ...

  5. 安装了python之后Windows的cmd中cd指令无法转换路径怎么办?

    1首先我们看看盘符,我的电脑里有 C D E,F. G盘. 2按下WIN+R键 输入cmd,打开cmd窗口. 3默认路径为用户文档路径,如果想切换到D盘 ,输入cd d: 是不行的. 4:AppDat ...

  6. 2015 Multi-University Training Contest 4 hdu 5336 XYZ and Drops

    XYZ and Drops Time Limit: 3000/1500 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Tot ...

  7. Opencv 三对角线矩阵(Tridiagonal Matrix)解法之(Thomas Algorithm)

    1. 简介 三对角线矩阵(Tridiagonal Matrix),结构如公式(1)所示: aixi−1+bixi+cixx+1=di(1) 其中a1=0,cn=0.写成矩阵形式如(2): ⎡⎣⎢⎢⎢⎢ ...

  8. C++ Primer笔记13_运算符重载_总结

    总结: 1.不能重载的运算符: . 和 .* 和 ?: 和 ::  和 sizeof 和 typeid 2.重载运算符有两种基本选择: 类的成员函数或者友元函数, 建议规则例如以下: 运算符 建议使用 ...

  9. JavaScript检查手机格式是否错误

    编写自己定义的JavaScript函数checkPhone(),在函数中应用正則表達式推断手机号码的格式是否正确,不对的给出提示 <script type="text/javascri ...

  10. 设置Webdriver启动chrome为默认用户的配置信息

    Webdriver 启动Chrome浏览器时,默认是打开一个新用户,而非默认用户.即新用户没有我们安装扩展程序.但在实际应用中,我们会须要 默认用户安装的一些扩展程序,比方对于某些js或者css样式. ...