Analysis and solutions for reasons why CSS files externally referenced by HTML do not take effect

This article mainly introduces the analysis and solutions to the reasons why the HTML external reference css file does not take effect. The introduction in this article is very detailed and has reference value. Friends who are interested can learn together

As a front-end editor Bai, tinkered with the front end for a few days. . Today I suddenly discovered that something I believed in had a problem. . For example, I wrote a css style document under the css directory: style.css. At this time there is only one sentence in it:

XML/HTML CodeCopy the content to the clipboard

body {    
background-color: #ddd;    
}

Then import it into my html file This external css:

XML/HTML CodeCopy content to the clipboard

<link rel="stylesheet" type="text/css" href="css/style.css">

Refresh the browser. . Wow, kao. It didn't respond, it didn't work. . I checked this path several times to make sure there was no problem, and opened chrome's F12 debugger. Confirmed that the browser loaded the css file, and then I opened the file and saw:

was garbled. . There should be something wrong with the encoding or the format, but I can't figure it out. . After consulting a front-end partner, I checked the current encoding of the web page:

shows UTF-16LE encoding. .

I tried it later and used the sublime editor to modify the local css file encoding format to this utf-16LE:

Rewritten the css code. Save and run. . Sure enough, that's it. .

But my html is specified as utf-8, and the css is utf-16, which makes me very unhappy. . So I asked for a solution again. It can be solved, and it's simple. .

Change the css to utf-8 and edit the code inside. Just declare the encoding format when introducing this css in html:

That is, add an attribute to the link tag: charset="utf-8" Enough. . . It's really that simple. . .

Regarding the analysis and solutions to the reasons why CSS files externally referenced by HTML do not take effect, I will introduce them here. I hope it will be helpful to everyone!

Related recommendations:

htmlTwo methods to disable clearing the input text input cache

The above is the detailed content of Analysis and solutions for reasons why CSS files externally referenced by HTML do not take effect. For more information, please follow other related articles on the PHP Chinese website!