I. Use the STYLE attribute
Add the STYLE attribute directly to individual component labels. <component (label) STYLE = "property (attribute) 1: Set value 1; property (attribute) 2: value 2 ;...}
For example:
<Td style = "COLOR: BLUE; font-size: 9pt; font-family:" "; line-height: 150%>
The advantage of this usage is that the style can be applied to various labels smartly, but the disadvantage is that there is no "uniformity" of the entire file 』.
II. Use STYLE labels
Write the STYLE rules in the <STYLE>... </STYLE> label.
| The code is as follows: | Copy code |
| <Style type = "text/css"> <! -- Style rule table --> </STYLE> |
|
For example:
| The code is as follows: | Copy code |
| <Style type = "text/css"> <! -- BODY { Color: BLUE; Background: # FFFFCC; Font-size: 9pt} TD, P { COLOR: GREEN; Font-size: 9pt} --> |
|
</STYLE>
Generally, the entire <STYLE>... </STYLE> Structure is written in the <HEAD> </HEAD> section of the webpage. The advantage of this usage is the uniformity of the entire file. As long as there is a declared component, this style rule will be applied. The disadvantage is that the flexibility of individual components is insufficient.
3. Use LINK labels
Write the style rules in the. Css style file, and then introduce them with the <LINK> label.
Assume that we save the sample rules into an example.css file. We only need to add
<Link rel = stylesheet type = "text/css" HREF = "example.css">
You can apply the style specified in the style file.
The LINK tag is usually written in the 4. Use @ import to introduce
It is similar to LINK usage, but it must be placed in <STYLE>... </STYLE>.
| The code is as follows: | Copy code |
| <Style type = "text/css"> <! -- @ Import url (the address, path, and file name of the imported style sheet ); --> </STYLE> For example: <Style type = "text/css"> <! -- @ Import url (http: // yourweb/example.css ); --> </STYLE> |
|
Note that the semicolon at the end of the line is absolutely indispensable!
5. Use the <span> </span> label to introduce the style.
Example: <span style = "font: 12px/20px #000000;"> Webpage Tutorial network </span>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
