CSS href vs inline stylesheet difference
I have a small CSS file with contents:
<style type="text/css">
li {
padding: 10px;
font-family: Arial;
}
</style>
Supposed to leave some space between list elements and change the font. Now, If I include this CSS file in the HTML like below:
<link rel="stylesheet" href="./css/lists.css" type="text/css" />
it does not work :(.
However, if I include the actual CSS code inside the h开发者_JS百科tml "head" block, it works.
I really prefer sourcing CSS (so different files can share the code). Any idea whats wrong and how to fix?
regards, JP
You are supposed to omit the
<style type="text/css">
and
</style>
tags from your .css files, as those are tags used only in HTML to denote CSS styles if you're including them in your page <head>. If you include them, the browser will attempt to treat them as CSS code, which it isn't, and that causes your stylesheet to not work.
You shouldn't use script tag in your css files. Just li {..} is enough.
Also, checking path (./css/lists.css) might help. If it has mistake, nothing will be included.
加载中,请稍侯......
精彩评论