在HTML中,我们可以使用以下三种方式更改文本颜色:

使用HTML标签

使用内联样式属性

使用内部CSS

使用HTML标签

使用Html标签更改网页上的文本颜色,按照以下步骤,我们可以轻松完成。

步骤1:首先,我们在文本编辑器中键入Html代码,或者在本编辑器中打开现有的Html文件。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>奔月教程(runoon.com)</title></head><body><h3>《浪淘沙·帘外雨潺潺》</h3><p>帘外雨潺潺,春意阑珊。</p><p>罗衾不耐五更寒。</p><p>梦里不知身是客,一晌贪欢。</p><p>独自莫凭栏,无限江山,别时容易见时难。</p><p>流水落花春去也,天上人间。</p></body>
</html>

步骤2:将光标移动到要更改颜色的文本的开头,在该位置键入标签,文本结尾处关闭标签。

< font > 单行文本和语句 </ font >

步骤3:在标签内添加名称为“ color ”的字体属性,在color属性中键入颜色名称或颜色值。

<h3>《浪淘沙·帘外雨潺潺》</h3>
<p><font color="red">帘外雨潺潺,春意阑珊。</font></p>
<p><font color="green">罗衾不耐五更寒。</font></p>
<p><font color="yellow">梦里不知身是客,一晌贪欢。</font></p>
<p><font color="pink">独自莫凭栏,无限江山,别时容易见时难。</font></p>
<p><font color="purple">流水落花春去也,天上人间。</font></p>

步骤4:最后将HTML代码保存在文本编辑器中并运行代码。执行后,我们将在浏览器中看到输出。

效果展示:

《浪淘沙·帘外雨潺潺》
帘外雨潺潺,春意阑珊。

罗衾不耐五更寒。

梦里不知身是客,一晌贪欢。

独自莫凭栏,无限江山,别时容易见时难。

流水落花春去也,天上人间。

点击下方“阅读原文”可亲试效果

注意:HTML 5不支持字体的color属性,因此我们必须使用内联样式属性和内部CSS选项来更改文本的颜色。

使用内联样式属性

如果想用内联样式属性来更改文本的颜色,按照以下步骤,可以轻松实现。

步骤1:在文本编辑器中键入HTML代码或打开现有HTML文件。

步骤2:将光标移动到我们要更改颜色的文本的开头,在元素中键入内联样式属性,在文本结尾处关闭元素。在这里我们使用了

(段落)标签:

< p style = “ color:red;” > 任何文本 </ p >

步骤3:在这一步,我们需要提供颜色名称或颜色值作为参数。我们可以使用三种形式的颜色:

我们可以输入颜色的名称

我们还可以输入颜色的RGB值

我们还可以输入颜色的十六进制值。

<h3>《浪淘沙·帘外雨潺潺》</h3>
<p style="color:red;">帘外雨潺潺,春意阑珊。</font></p>
<p style="color:green;">罗衾不耐五更寒。</font></p>
<p style="color:rgb(100,100,100);">梦里不知身是客,一晌贪欢。</font></p>
<p style="color:#C3B2A1;">独自莫凭栏,无限江山,别时容易见时难。</font></p>
<p style="color:rgb(150,150,150);">流水落花春去也,天上人间。</font></p>

步骤4:最后,保存HTML代码,执行代码可以得到以下内容输出。

《浪淘沙·帘外雨潺潺》
帘外雨潺潺,春意阑珊。

罗衾不耐五更寒。

梦里不知身是客,一晌贪欢。

独自莫凭栏,无限江山,别时容易见时难。

流水落花春去也,天上人间。

使用内部CSS

要使用内部级联样式表来更改文本的颜色,按以下步骤,可以轻松实现。

步骤1:在文本编辑器中键入HTML代码或打开现有HTML文件。

步骤2:光标放在Html文档的head标签中,在

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>奔月教程(runoon.com)</title><style>  Body { color:orange;}  p{color:green;}  </style> </head><body><h3>《浪淘沙·帘外雨潺潺》</h3><p>帘外雨潺潺,春意阑珊。</p><p>罗衾不耐五更寒。</p><p>梦里不知身是客,一晌贪欢。</p><p>独自莫凭栏,无限江山,别时容易见时难。</p><p>流水落花春去也,天上人间。</p></body>
</html>

步骤3:必须在要更改颜色的文本之前,定义元素选择器。

步骤4:保存并执行HTML代码,可以看到以下输出。

本文编辑:山东标梵 (https://weibo.com/Biaofun)

如何在HTML中更改文本颜色?相关推荐

  1. html如何设置整体文本颜色,如何在HTML中更改文本颜色?

    在HTML中,我们可以使用以下三种方式更改文本颜色: 使用HTML标签 使用内联样式属性 使用内部CSS 使用HTML标签 使用Html标签更改网页上的文本颜色,按照以下步骤,我们可以轻松完成. 步骤 ...

  2. java jtextarea.setfont_如何在JTextArea中更改文本颜色?

    既然是可能的用途Highlighter(或HTML)用于JTextArea,此api实现了样式文本的简化选项.import java.awt.*; import javax.swing.*; impo ...

  3. 如何在Windows终端中更改文本颜色

    目录 介绍 终端颜色 使用代码 辅助函数 处理对比度 有趣的点 下载 color.zip - 1.9 KB 介绍 终端的默认文本输出是单色的,并且不提供提供上下文的简单方法.例如,您可能希望错误以红色 ...

  4. Illustrator 教程:如何在 Illustrator 中更改图稿颜色?

    欢迎观看illustrator教程,小编带大家学习 illustrator 的基本工具和使用技巧,了解如何在 illustrator 中将颜色应用至使用现有颜色和创建颜色的图稿上. 在 illustr ...

  5. android 文本后图标_如何在Android中更改文本,图标等的大小

    android 文本后图标 Let's face it: no matter how good the screens are on our phones and tablets, the text ...

  6. 如何在PowerPoint中更改文本的大小写

    If you're looking to quickly change the case of the text in a slide of your PowerPoint presentation, ...

  7. 如何在 ggplot2 中更改背景颜色(附示例)

    您可以使用以下语法更改 ggplot2 图中各种元素的背景颜色: p + theme(panel.background = element_rect(fill = 'lightblue', color ...

  8. JAVA中怎么设置文本域位置_java – 如何在JTextArea中更改文本的位置

    通常,在JTextArea中,文本从左上角开始.我希望它在左下角.你怎么能这样做? (如果我的笔迹不可读,请道歉) 解决方法: 您可以将JTextArea锚定到容器的BorderLayout.PAGE ...

  9. python画图修改背景颜色_如何在 Matplotlib 中更改绘图背景的实现

    介绍 Matplotlib是Python中使用最广泛的数据可视化库之一.无论是简单还是复杂的可视化项目,它都是大多数人的首选库. 在本教程中,我们将研究如何在Matplotlib中更改绘图的背景. 导 ...

  10. css可以设置文本框颜色吗,如何在css中设置文本框颜色

    如何在css中设置文本框颜色 发布时间:2021-04-29 15:33:54 来源:亿速云 阅读:72 作者:Leah 如何在css中设置文本框颜色?针对这个问题,这篇文章详细介绍了相对应的分析和解 ...

最新文章

  1. Python 为什么用 # 号作注释符?
  2. AI公开课:19.04.17杨松帆—好未来AI Lab负责人《为人工智能时代打造一个AI老师》课堂笔记以及个人感悟
  3. oracle12154错误 Linux,关于“EXP-00056: ORACLE error 12154 encountered”的解决方法
  4. 数字电路技术可能出现的简答题_数字电子技术复习题(本科)
  5. [python opencv 计算机视觉零基础到实战] 十六、用opencv画画
  6. 推荐算法--推荐系统架构(06)
  7. linux服务器时间不同步解决方法
  8. 杭电acm 1846 Brave Game(巴什博弈)
  9. 数据结构专题:数据结构的学习困境
  10. M产品研发日志(3)--看板,构建,模板,立会
  11. fatal error LNK1104: cannot open file 'libboost_regex-vc100-mt-gd-1_48.lib'
  12. JSON格式化软件 - 开源工具 JSON Viewer
  13. itools苹果录屏大师_录屏大师限免|2019年1月最后一次苹果精选限时免费App 0131...
  14. uniapp H5公众号errMsg: “onMenuShareAppMessage:fail, the permission value is offline verifying“
  15. 【codevs 1329】东风谷早苗
  16. 动名词做主语时的谓语动词问题
  17. 腾达u2无线网卡驱动Linux,腾达U2无线网卡驱动
  18. Elite教程系列(一):快速上手
  19. des加密+base64编码,base64解码+des解密
  20. 【术语】本地部署、云化部署、混合部署

热门文章

  1. stm32学习笔记——电容触摸按键的实现
  2. 微信无法定位 请打开定位服务器,微信定位开了还是无法定位(定位打开了无法获取位置)...
  3. linux查看系统内存
  4. 自动化测试平台(七):头像展示、下拉菜单及用户管理模块增删改功能实现
  5. java十大排序算法
  6. supergo定位软件_super go定位修改下载
  7. 不小心将 pip 卸载了,重新安装pip
  8. python卸载pip重新安装_pip的卸载、重装、升级(from pip19.3 to pip20.1)
  9. php 通过AES加密/解密 bin2hex/hex2bin转换
  10. 自抗扰控制理论(一)ADRC的原理