引入CSS文件和页面填写css代码的优先问题
如题,哪个优先级更高一点.
<HEAD>
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
<LINK rel=stylesheet href="mycss.css" type="text/css">
</HEAD>
如果link 在 style下面,那么哪个优先?
CSS文件和页面填写css代码的优先问题，首先我们需要理解的是，在页面填写的CSS的优先级是高于引入文件的优先级的，因为那个css的样式更靠近要影响的元素，我们可以通过代码来理解一下：
html中：
<html>
<head>
<style>
table tr{
width:200px;
height:100px;
color:blue;
}
</style>
<link rel='stylesheet' type='text/css' href='./css/index1.css'>
</head>
<body>
<table>
<tr style="">
<td>我i是测试文字</td>
</tr>
</table>
</body>
</html>
css文件中：
table tr{
width:300px;
height:200px;
color:red;
}
这里写了2个CSS样式，唯一不同的就是文字的颜色，因为css的优先级，在在这里是不会执行外部文件的css样式，而是会去执行更加靠近这个tr的css样式，因而color会执行blue。
html中：
<html>
<head>
<style>
table tr{
width:200px;
height:100px;
color:blue;
}
</style>
<link rel='stylesheet' type='text/css' href='./css/index1.css'>
</head>
<body>
<table>
<tr style="">
<td>我i是测试文字</td>
</tr>
</table>
</body>
</html>
css文件中：
table tr{
width:300px;
height:200px;
color:red;
}
这里写了2个CSS样式，唯一不同的就是文字的颜色，因为css的优先级，在在这里是不会执行外部文件的css样式，而是会去执行更加靠近这个tr的css样式，因而color会执行blue。
温馨提示：内容为网友见解，仅供参考
第1个回答 2008-10-30
标签里面的 style="" 这个优先最高；其次是继承的；最后是外面的。
第2个回答 2008-10-30
----------------
补充
----------------
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
<LINK rel=stylesheet href="mycss.css" type="text/css">
这样的话，服从 mycss.css 的规则
也就是说 总是服从最后被定义的样式
mycss.css的 样式 是位于 <style></style> 的后面
所以服从 mycss.css 的样式
但是一般说来。
都是把 <LINK rel=stylesheet href="mycss.css" type="text/css"> 放在前面。 定义 公共普通的样式
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
放在后面，作为特殊页面的特殊样式的补充！
------------------------------------------
后者更高～～
由高到低
<div style="这里的最高">
<style type="text/css">
这里的其次
</style>
<link href="这个最低.css"/>
补充
----------------
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
<LINK rel=stylesheet href="mycss.css" type="text/css">
这样的话，服从 mycss.css 的规则
也就是说 总是服从最后被定义的样式
mycss.css的 样式 是位于 <style></style> 的后面
所以服从 mycss.css 的样式
但是一般说来。
都是把 <LINK rel=stylesheet href="mycss.css" type="text/css"> 放在前面。 定义 公共普通的样式
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
放在后面，作为特殊页面的特殊样式的补充！
------------------------------------------
后者更高～～
由高到低
<div style="这里的最高">
<style type="text/css">
这里的其次
</style>
<link href="这个最低.css"/>
第3个回答 推荐于2018-03-13
近水楼台先得月！
==============================
还是这句话“近水楼台先得月！”本回答被提问者和网友采纳
==============================
还是这句话“近水楼台先得月！”本回答被提问者和网友采纳
第4个回答 2008-10-30
一、CSS的优先级
1、标有"!important"的规则有最高优先级
一个样式规则可以有一个"important"附带标签，表示该样式规则具有最高优先级。例如下面例子中，前景色被标为important。
H1{color:black !importan; font-family:sans-serif}
注意：这种声明容易引起混乱，因此通常使用得较少。
2、创作者规则优先级高于浏览者规则
浏览器允许浏览者创建样式规则以覆盖系统缺省值。在此情况下，由网页创作者明确设定得样式优先级较高，而浏览者设置得样式规则优先级较低。
3、更特殊得规则优先于不够特殊的规则
在决定特殊性时，selector中的ID属性有最高优先级。基于ID selector的优先级可通过计数Selector中类属性的数量确定，数量越多优先级越高。假如规则仍然无法确定优先级，则HTML元素名的数量决定了特殊性。
4、在同一个级别的情况下，最后指定的规则有优先权
假如两个或更多的规定在应用了前三个规定具有相同优先级，则后给出的规则优先于早先给出的规则。
如果在网页的HEAD标记中同时使用了STYLE标记符（指定嵌入式样式）和LINK标记符（指定链接式样式），并且这两个样式指定中同时应用了具有同一优先级别的样式，则STYLE标记符和LINK标记符的先后顺序将决定样式的优先级。
例如，如果在LINK所链接的样式表（mycss.css）中定义了以下一条样式规则：
H1{color:red}
同时在嵌入式样式定义中也定义了一条规则：
H1{color:yellow}
在网页中的样式定义如下所示：
<HEAD>
<LINK rel=stylesheet href="mycss.css" type="text/css">
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
</HEAD>
由于STYLE标记符中定义的样式后出现，因此它具有更高的优先级，所以网页中H1标记符的内容将显示为黄色（yellow)。同样，如果将Link标记符的位置移动到<STYLE></STYLE>标记符之后，则网页中H1标记符的内容将显示为红色（red)。
另外，由于直插式样式（使用HTNL标记的style属性设置的样式）的位置最接近于样式作用的标记符，因此它通常具有高优先级。
1、标有"!important"的规则有最高优先级
一个样式规则可以有一个"important"附带标签，表示该样式规则具有最高优先级。例如下面例子中，前景色被标为important。
H1{color:black !importan; font-family:sans-serif}
注意：这种声明容易引起混乱，因此通常使用得较少。
2、创作者规则优先级高于浏览者规则
浏览器允许浏览者创建样式规则以覆盖系统缺省值。在此情况下，由网页创作者明确设定得样式优先级较高，而浏览者设置得样式规则优先级较低。
3、更特殊得规则优先于不够特殊的规则
在决定特殊性时，selector中的ID属性有最高优先级。基于ID selector的优先级可通过计数Selector中类属性的数量确定，数量越多优先级越高。假如规则仍然无法确定优先级，则HTML元素名的数量决定了特殊性。
4、在同一个级别的情况下，最后指定的规则有优先权
假如两个或更多的规定在应用了前三个规定具有相同优先级，则后给出的规则优先于早先给出的规则。
如果在网页的HEAD标记中同时使用了STYLE标记符（指定嵌入式样式）和LINK标记符（指定链接式样式），并且这两个样式指定中同时应用了具有同一优先级别的样式，则STYLE标记符和LINK标记符的先后顺序将决定样式的优先级。
例如，如果在LINK所链接的样式表（mycss.css）中定义了以下一条样式规则：
H1{color:red}
同时在嵌入式样式定义中也定义了一条规则：
H1{color:yellow}
在网页中的样式定义如下所示：
<HEAD>
<LINK rel=stylesheet href="mycss.css" type="text/css">
<STYLE>
<!--
H1{color:yellow}
-->
</STYLE>
</HEAD>
由于STYLE标记符中定义的样式后出现，因此它具有更高的优先级，所以网页中H1标记符的内容将显示为黄色（yellow)。同样，如果将Link标记符的位置移动到<STYLE></STYLE>标记符之后，则网页中H1标记符的内容将显示为红色（red)。
另外，由于直插式样式（使用HTNL标记的style属性设置的样式）的位置最接近于样式作用的标记符，因此它通常具有高优先级。
相似回答
