Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to insert a style sheet in CSS

2025-01-31 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "how to insert a style sheet in CSS". The editor shows you the operation process through an actual case. The operation method is simple, fast and practical. I hope this article "how to insert a style sheet in CSS" can help you solve the problem.

CSS is a computer language used to represent file styles such as HTML (an application of the standard general markup language) or XML (a subset of the standard general markup language). CSS can not only modify the web page statically, but also format the elements of the web page dynamically with various scripting languages.

How to insert a style sheet

There are three ways to insert a style sheet: 1. External style sheet (External style sheet) 2. Internal style sheet (Internal style sheet) 3. Inline style (Inline style)

External style sheet

External stylesheets are ideal when styles need to be applied to many pages. With an external stylesheet, you can change the appearance of the entire site by changing a file. Each page uses tags to link to the stylesheet. The tag is in the header (of the document):

"stylesheet" type= "text/css" href= "mystyle.css" >

The browser reads the style declaration from the file mystyle.css and formats the document based on it.

External style sheets can be edited in any text editor. The file cannot contain any html tags. Stylesheets should be saved with a .css extension. Here is an example of a stylesheet file:

Hr {color:sienna;} p {margin-left:20px;} body {background-image:url ("/ images/back40.gif");} Internal style sheets internal style sheets should be used when a single document needs a special style. You can use it.

The tag defines the internal style sheet at the head of the document, like this:

Hr {color:sienna;} p {margin-left:20px;} body {background-image:url ("images/back40.gif");} inline styles lose many of the advantages of stylesheets because they mix presentation with content. Use this method with caution, such as when the style needs to be applied only once to an element.

To use inline style, you need to use the style attribute within the associated tag. The Style property can contain any CSS attribute. This example shows how to change the color and left margin of a paragraph:

This is a paragraph. Multiple styles if some properties are defined by the same selector in different stylesheets, the property values will be inherited from the more specific stylesheet.

For example, an external stylesheet has three properties for the h4 selector:

H4 {color:red; text-align:left; font-size:8pt;} while the internal stylesheet has two properties for the h4 selector:

H4 {text-align:right; font-size:20pt;} if this page with an internal stylesheet is linked to an external stylesheet at the same time, the style obtained by h4 is:

Color:red;text-align:right;font-size:20pt; means that the color attribute is inherited from the external stylesheet, while the text arrangement (text-alignment) and font size (font-size) are replaced by the rules in the internal stylesheet.

Multiple style priority stylesheets allow style information to be specified in several ways. Styles can be specified in a single HTML element, in the header element of the HTML page, or in an external CSS file. You can even reference multiple external stylesheets within the same HTML document.

In general, the priorities are as follows:

* * inline style) Inline style > (internal style) Internal style sheet > (external style) External style sheet > browser default style * *

/ * Internal style * / h4 {color:green;} test! Note: if the outer style is placed after the inner style, the outer style overrides the inner style.

This is the end of the introduction to "how to insert style sheets in CSS". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report