color
设置字体颜色以前,咱们首先了解color
在CSS
中有几种取值方式,一共有4种方式,如有不全还请在评论区告知谢谢,4种方式以下:class
属性值为.box
中的字体颜色设置为红色。代码块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: #FF0000; } </style> </head> <body> <h2 class="box">成功不是击败别人,而是改变本身</h2> </body> </html>
结果图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
中没有浏览器兼容性问题。ui
代码块ssr
<!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>
结果图code
代码块htm
<!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>
结果图blog