Home > Web Front-end > CSS Tutorial > How many ways are there to reference css in the page?

How many ways are there to reference css in the page?

云罗郡主
Release: 2018-11-23 16:05:40
forward
3522 people have browsed it


The content of this article is about several ways to reference css on the page. It has certain reference value. Friends in need can For reference, I hope it will be helpful to you.

Priority: External style < Internal style sheet < Inline style sheet;

Priority, that is: the right side of the selector with the same name will overwrite the left side

1. Internal style sheet

<head>
<style>
/*内部样式表,一般用于覆盖公用样式*/
#headTip {
color: 0xff5;
}
</style>
</head>
Copy after login

2. Use the link tag to declare the use of external resources in the document, which is the most common way.

@CHARSET="utf-8"; that specifies the encoding of the css external style sheet needs to be placed on the first line.

<head>
<link href="./divcss8.css" rel="stylesheet" media="screen" type="text/css"/>
</head>
Copy after login

3.@ Method, introduce css. Note that this is loaded asynchronously. It is loaded after the entire html is loaded, which will cause the page to flicker. Not recommended.

<head>
<style>
@import &#39;my-common.css&#39;;
</style>
</head>
Copy after login

4. Inline style sheets have the highest priority and are the most straightforward, but they cannot be reused and are not easy to maintain.

<body>
<input type="text" style="color:0x550;font-size:30px;"/>
</body>
Copy after login

The above is a complete introduction to several ways to reference css in pages. If you want to know more about CSS3 tutorial, please pay attention to the PHP Chinese website.



The above is the detailed content of How many ways are there to reference css in the page?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:divcss8.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template