3 ways to set style properties with CSS
You can write css styles into the style attribute of an element:
1. Write the style directly into the style attribute. This style is called inline style. Inline style only works for the content in the current element.
eg:
<p style="color:blue; font-size: 50px;" > When is the moon, the wine asked the sky! </p>
2. You can also write CSS styles into the style TAB in the head, called internal styles. Write the style sheet into the style tag, and then select the specified element through the CSS selector
<head> <style type="text/css"> p{ color:green; font-size:40px; } </style> </head> <body> <p> When is the moon, the wine ask the sky! </p> </body>
3. You can also write a style sheet into an external CSS file, and then introduce the external CSS file into the current page through the link tag. The href sets the relative path of the external css file, so that the structure and presentation are completely separated.
<link rel="stylesheet" href="css/style.css" />
Other: In CSS, the style of the ancestor element is also inherited by its descendants; With inheritance, you can set some basic styles to ancestor elements so that all descendant elements will automatically inherit these styles. However, not all styles are inherited by the quilt element. For example, background related styles are not inherited.
eg:
<! DOCTYPE html> <html> <head> <style type="text/css"> body{ font-size: 25px; } </style> </head> <body> <p> When is the moon? </p> <p class="p1"> When is the moon? </p> <p> When is the moon? </p> <p> When is the moon? </p> </body> </html>
To this article about the 3 methods of CSS setting style property is introduced to this, more related CSS setting style property content please search the script home previous articles or continue to browse the following related articles, I hope you will support the script home in the future!
Related article
-
Implementation of the marked list-style-type attribute in front of a CSS ordered or unordered list
This article mainly introduces the realization of the marked list-style-type attribute in front of the CSS ordered or unordered list. The article introduces the example code in great detail, which has certain reference learning value for everyone's study or work, and is needed2020-02-24 -
How to use the CSS list-style-type attribute
This article mainly introduces the CSS list-style-type attribute use method, need friends can refer to the next2023-05-16 -
CSS list-style Modifies the list attribute to control the li label style
The list_style attribute is used to modify the list attribute, list-style-type is used to set the type of the list item, list-style-position is used to set the position of the list item, and list-style-image is used to set the use of image to replace the list item tag2014-07-29 -
The CSS list-style attribute controls the li label style sample code
list_style attribute is used to modify the list attribute. The following introduces the specific implementation of CSS list-style attribute control li tag style. Interested friends can understand the following2014-03-03 -
This article mainly introduces the font style under css, font properties and writing, need friends can refer to the next2014-01-28
-
JavaScript CSS Style attribute mapping table
To achieve a particular effect we need to dynamically change the Css properties of a tag using Javascript.2010-01-18 -
CSS border-style attribute usage
Value :2009-07-15{1,4} | inherit {1,4} | inherit {1,4}: inherit: none Inheritance: No Applicable to: -
Styleneat helps you easily read and update CSS files
It organizes and standardizes CSS files - selectors, sub-selectors, and their properties. It is different from the CSS optimization tools seen before, styleneat is more optimized to clean up the CSS structure.2009-04-02
Latest comments