The CSS text color design uses the color label and does not need to be written as font-color. For example, blue text can be written as "color:blue", but for other elements such as border colors, border-color , The background color should be marked with background-color . Only the text color is the simplest. You can use color directly. Designers can write the color in the DIV block, span area, hyperlink or even directly in the <body> tag , The following examples are common CSS text color design methods.
CSS color text color basic syntax
color: English or color code of the color;
The color parameter in the grammar can be the English or color code of the color, or even the RGB color code. All mainstream browsers support the color attribute of CSS. The color code on the " Color Code Table " can be used to select the color . If you cannot remember the English names of all colors, it is easier to use the hexadecimal color code table, please refer to: color code table .
CSS color text color example 1. The text color of the entire webpage
<body style="color:blue;">
... web content...
</body>
... web content...
</body>
Most browsers’ default webpage text is black. Designers can mark style in the <body> tag and use the color attribute to modify the basic text color of the entire webpage. For example, the writing in the example will make the text of the webpage The default color becomes blue. If the hexadecimal color code is used, it can be written as "<body style="color:#0000FF">". To put it simply, the original blue is changed to the color code representation of #0000FF. This part is based on the designer’s personal habit. In addition, the color written in the <body> tag can only control the basic text color of the web page, and cannot modify the color of the hyperlink . To modify the text color of the hyperlink , please refer to: Modify Hyperlink Color .
CSS color text color example 2: text color in the span area
<body style="color:blue;">
Text color is blue<span style="color:red;">Text color is red</span>
</body>
Example outputText color is blue<span style="color:red;">Text color is red</span>
</body>
Text color is blue text color is red
In the second example, we reserved the blue text in the <body> tag, and prepared blue and red text effects. The blue text does not require additional design and will be displayed according to the default blue color. The text marked by the span tag can be additionally designed in red, and the browser will use the color marked by the < span > tag as the main display order. In addition to the span tag, the same technique can also be used for the text in the DIV block Color is a very common way of designing colorful web pages.CSS color text color example three, hyperlink text color
<body style="color:blue;">
<a href="#" style="color:red;">The color of the hyperlink text is red</a>
</body>
Example outputThe color of the text hyperlink cannot be directly designed in the <body> tag. It needs to be designed in the <style> area of the CSS through the a selector, or write the color directly into the hyperlink in the writing method in this example In the a href tag, the advantage is that you can write a different color for each hyperlink in the web page . The disadvantage is that when there are a lot of links, it takes a lot of time to write the color of each one. If you want to manage the entire web page in one go the hyperlink colors refer to " modify the color of hyperlinks " paradigm.<a href="#" style="color:red;">The color of the hyperlink text is red</a>
</body>
Post a Comment
0 Comments