如何在HTML中设置字体颜色,你知道这几种方式吗?
color设置字体颜色
- 在
color设置字体颜色之前,我们首先了解color在CSS中有几种取值方式,一共有4种方式,若有不全还请在评论区告知谢谢,4种方式如下: - 十六进制、十进制、 英文单词、十六进制的缩写。
- 现在让我们进入字体颜色实践,笔者以嵌入式的形式,将
class属性值为.box中的字体颜色设置为红色。 - 使用十六进制如下:
代码块
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>设置字体颜色</title>
<style>
.box{
color: #FF0000;
}
</style>
</head>
<body>
<h2 class="box">成功不是击败别人,而是改变自己</h2>
</body>
</html>
结果图

- 使用十进制如下:
代码块
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>设置字体颜色</title>
<style>
.box{
color: rgb(250,0, 0)
}
</style>
</head>
<body>
<h2 class="box">成功不是击败别人,而是改变自己</h2>
</body>
</html>
代码块

十进制表示颜色的方式在
CSS中没有浏览器兼容性问题。使用英文单词如下:
代码块
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>设置字体颜色</title>
<style>
.box{
color:red;
}
</style>
</head>
<body>
<h2 class="box">成功不是击败别人,而是改变自己</h2>
</body>
</html>
结果图

- 使用十六定制的缩写
代码块
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>设置字体颜色</title>
<style>
.box{
color: #F00;
}
</style>
</head>
<body>
<h2 class="box">成功不是击败别人,而是改变自己</h2>
</body>
</html>
结果图

- 如果大家对颜色的值不熟悉可以去W3 school 官方文档看看哈。
如何在HTML中设置字体颜色,你知道这几种方式吗?的更多相关文章
- android 在代码中设置字体颜色 问题
项目中需要在代码中控制字体颜色 之前是直接引用资源文件 但是不行 tv.setTextColor(R.color.textColor_black); 无效果 后来在网上找了资料发现 要从reso ...
- 【转】Android中设置TextView的颜色setTextColor--代码中设置字体颜色
原文网址:http://www.cnblogs.com/myphoebe/archive/2012/01/06/2314728.html android中设置TextView的颜色有方法setText ...
- Latex中设置字体颜色
在用Latex时,想要使用不同颜色来突出某些关键点,有以下三种方案: 1.组合red.green和blue的值合成我们想要的颜色 \usepackage{color} \textcolor[rgb]{ ...
- 【转】asp.net中设置弹出谈话框的几种方式详解
源地址:https://blog.csdn.net/zou15093087438/article/details/79637114 注:可用winform的MessageBox的方法,只需引用Syst ...
- Python中print字体颜色的设置
Python中print字体颜色的设置 实现过程: 终端的字符颜色是用转义序列控制的,是文本模式下的系统显示功能,和具体的语言无关. 转义序列是以ESC开头,即用\033来完成 ...
- Latex中如何设置字体颜色(3种方式)
Latex中如何设置字体颜色(三种方式) 1.直接使用定义好的颜色 \usepackage{color} \textcolor{red/blue/green/black/white/cyan/ma ...
- Android代码中设置字体大小,字体颜色,显示两种颜色.倒计时效果
Android代码中设置字体大小,字体颜色,显示两种颜色 在xml文件中字体大小用的像素 <TextView android:id="@+id/uppaid_time" an ...
- 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色
查看本章节 查看作业目录 需求说明: 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色 实现思路: 在页面的 <body&g ...
- 如何在 apache 中设置缓存有效时间
今天学习了下如何在 apache 中设置缓存时间,记之以备忘. 在 http 报文头中,与缓存时间有关的两个字段是 Expires 以及 Cache-Control 中的 max-age,Expire ...
随机推荐
- HTML5 lufylegend引擎学习(一) -- 剪刀石头布小游戏
网址:http://www.lufylegend.com/ <!DOCTYPE html> <html> <head> <title>A Little ...
- 运用第一性原理探寻AI本质
摘要:使用第一性原理探讨理解AI本质. 文章来源:宜信技术学院|宜信支付结算团队技术分享第二期-支付结算机器学习技术团队负责人 刘创 分享<AI与第一性原理> 分享者:宜信支付结算机器学习 ...
- Cocos2d-x入门之旅[4]场景
我们之前讲了场景图(Scene Graph) 的概念,继续之前你先要知道 场景图决定了场景内节点对象的渲染顺序 渲染时 z-order 值大的节点对象会后绘制,值小的节点对象先绘制 HelloWorl ...
- LeetCode初级算法--树01:二叉树的最大深度
LeetCode初级算法--树01:二叉树的最大深度 搜索微信公众号:'AI-ming3526'或者'计算机视觉这件小事' 获取更多算法.机器学习干货 csdn:https://blog.csdn.n ...
- Beanutils.copyProperties( )使用详情总结
Beanutils.copyProperties( ) 一.简介: BeanUtils提供对Java反射和自省API的包装.其主要目的是利用反射机制对JavaBean的属性进行处理.我们知道,一个 ...
- Hadoop 在 windows 7 64位的配置(二)|非cygwin
第一次使用需要 hdfs namenode -format 一键启动和关闭hadoop 新建文本文档 然后改名 start-hadoop.cmd 里面的内容 @echo off cd /d %HADO ...
- printf 格式输出代码大全
d,lx,ld,,lu,这几个都是输出32位的hd,hx,hu,这几个都是输出16位数据的,hhd,hhx,hhu,这几个都是输出8位的,lld,ll,llu,llx,这几个都是输出64位的, pri ...
- unity 截屏总结
转载与https://www.cnblogs.com/MissLi/p/8005342.html 1.针对指定的相机进行截屏 此中方式要添加yield return waitfortheEndofFr ...
- 如何在sprintf函数中输出百分号(%)等特殊符号
php中的sprinf可以格式化字符串的数据类型.今天遇到了想在其中输出%,可难倒我了. $query = sprintf("select * from books where %s li ...
- 二:Mysql库相关操作
1:系统数据库 information_schema: 虚拟库,不占用磁盘空间,存储的是数据库启动后的一些参数,如用户表信息.列信息.权限信息.字符信息等.performance_schema: My ...