关于设置img图片大小优先级的问题

　　今天在学jquery时，对于 img 标签引入的图片设置大小时，出现了点问题。初学CSS时，都知道：内联样式优先级>嵌入样式优先级>外部引用样式优先级。首先看如下代码：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4 <meta charset="UTF-8">
 5 <title>test</title>
 6 <style>
 7     img{
 8            height:500px;
 9     }
10 </style>
11 </head>
12 <body>
13 <img height=300px style="height:200px" src="images/11509591.jpg" alt="小狗">
14 </body>
15 </html>

　　代码运行后，图片 height=200px，也就是说内联样式优先级最高。再看如下代码：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>test</title>
 6     <style>
 7         img{
 8             height:500px;
 9         }
10     </style>
11 </head>
12 <body>
13     <img height=200px src="images/11509591.jpg" alt="小狗">
14 </body>
15 </html>

　　代码运行后，图片 height=500px，也就是说嵌入样式优先级高于标签本身的属性。再研究下id选择器丶类class选择器和标签选择器的优先级，代码如下：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>test</title>
 6     <style>
 7         img{
 8             height:200px;
 9         }
10         #pic{
11             height:300px;
12         }
13         .po{
14             height:400px;
15         }
16     </style>
17 </head>
18 <body>
19     <img id='pic' class="po"  src="images/11509591.jpg" alt="小狗">
20 </body>
21 </html>

　　运行后，图片 height=300px，也就是说id选择器优先级最高；再注释掉 10-12行代码，运行后height=400px，也就是类class选择器次之。

　　综上：内联样式>嵌入样式>标签本身属性；

　　选择器的优先级：id选择器>类class选择器>标签选择器