当前位置:懂科普 >

IT科技

> 如何更改HTML中的文本颜色

如何更改HTML中的文本颜色

目录

方法1:使用CSS1、打开HTML文件。2、将光标放在<head>标签内。3、输入<style>来创建一个内部样式表。4、输入要更改其文本颜色的元素。5、在元素选择器中输入color:6、输入文本颜色。7、添加其他选择器来更改不同元素的颜色。8、定义一个CSS类而不是去更改一个元素。方法2:使用级联样式属性1、打开HTML文件。2、在文件中找到要更改的元素。3、将样式属性添加到元素。4、在内输入color:5、输入要将文本更改为的颜色。在超文本中可以使用 <font> 标签来改变文本的颜色,然而新版本HTML5不再支持这种方法。你需要改为使用CSS来自定义网页中各元素的文本颜色。这样将确保网页能与各种浏览器兼容。

方法1:使用CSS

如何更改HTML中的文本颜色

1、打开HTML文件。更改文本颜色的最佳方法是使用CSS。HTML5不支持旧版HTML的 <font> 属性。因此,最好是使用CSS来定义各元素的样式。这种方法同样适用于外部样式表(单独的CSS文件)。下面是一些使用内部样式表的HTML文件示例。

如何更改HTML中的文本颜色 第2张

2、将光标放在<head>标签内。如果你使用的内部样式表,那就能在该标签中定义自己的样式。

如何更改HTML中的文本颜色 第3张

3、输入<style>来创建一个内部样式表。当<style>标签在<head>标签中时,<style>标签内部的CSS将被应用于页面上任何适用的元素。当您完成时,HTML文件的开头部分看起来就像是下面这样:

<!DOCTYPE html><html><head><style></style></head>

如何更改HTML中的文本颜色 第4张

4、输入要更改其文本颜色的元素。您会使用<style>部分来定义页面上不同元素的外观。比如说,要更改页面所有正文的样式,则输入以下内容:

<!DOCTYPE html><html><head><style>body {}</style></head>

如何更改HTML中的文本颜色 第5张

5、在元素选择器中输入color:属性。color:属性将告诉页面对该元素使用哪种文本颜色。在本例中,它将更改所有正文文本的颜色,而这些文本也是页面上所有文本的默认元素:

<!DOCTYPE html><html><head><style>body {color:}</style></head>

如何更改HTML中的文本颜色 第6张

6、输入文本颜色。输入颜色的方法分为三种:名称、十六进制值或RGB值。例如,要设为蓝色,则可以输入bluergb(0, 0, 255)#0000FF

<!DOCTYPE html><html><head><style>body {color: red;}</style></head>

如何更改HTML中的文本颜色 第7张

7、添加其他选择器来更改不同元素的颜色。你可以使用不同的选择器来更改页面不同部分的文本颜色:

<!DOCTYPE html><html><head><style>body {color: red;}h1 {color: #00FF00;}p {color: rgb(0,0,255)}</style></head><body><h1>This header will be green.</h1><p>This paragraph will be blue.</p>This body text will be red.</body></html>

如何更改HTML中的文本颜色 第8张

8、定义一个CSS类而不是去更改一个元素。你可以定义一个类,然后将其应用于整个页面上的任何元素,从而马上添加这种类样式。例如,在以下文件中,".redtext"类会让应用于的所有元素都使用红色文本:

<!DOCTYPE html><html><head><style>.redtext {color: red;}</style></head><body><h1 class="redtext">This heading will be red</h1><p>This paragraph will be normal.</p><p class="redtext">This paragraph will be red</p></body></html>

方法2:使用级联样式属性

如何更改HTML中的文本颜色 第9张

1、打开HTML文件。你可以使用级联样式属性来更改页面中某个元素的样式。这种方法对快速更改一两处样式很有用,但不建议用于大范围更改。如果是全面的样式更改,还是要用上一种方法。

如何更改HTML中的文本颜色 第10张

2、在文件中找到要更改的元素。你可以使用级联样式属性来更改任何元素的文本颜色。例如,你想更改特定标题的文本颜色,则要在文件中找到它:

<!DOCTYPE html><html><body><h1>This is the header you want to change</h1></body></html>

如何更改HTML中的文本颜色 第11张

3、将样式属性添加到元素。在要更改的元素的开始标记内输入style=";;";;"img-ratio-box" style="width: 640px;">如何更改HTML中的文本颜色 第12张

4、内输入color:属性""例如:

<!DOCTYPE html><html><body><h1 style="color:;">This is the header you want to change</h1></body></html>

如何更改HTML中的文本颜色 第13张

5、输入要将文本更改为的颜色。表示颜色的方法有三种。你可以输入颜色的名称、RGB值或者十六进制值。例如,要把颜色更改为黄色,你可以输入yellow;rgb(255,255,0);#FFFF00;

<!DOCTYPE html><html><body><h1 style="color:#FFFF00;">This header is now yellow</h1></body></html>

小提示

你可以通过以下链接来查看支持的颜色名称及其十六进制值的列表:http://www.w3schools.com/colors/colors_names.asp

标签: 文本 html
  • 文章版权属于文章作者所有,转载请注明 https://dongkepu.com/itkeji/539or9.html