CSS优先级样式之内联宽度覆盖（在不改变当前代码的情况下，使这张图片宽度为300px)

在不改变当前代码的情况下，使这张图片宽度为300px，此处考察的是一个css优先级的知识点。

<img src="./logo.png" style="width: 480px !important;">

1、<img src="./logo.png" style="width: 480px !important; max-width: 300px;">

将最大宽度限制为300px，这种方式不需要注意样式的顺序。

 2、<img src="./logo.png" style="width: 480px !important;width: 300px !important;">

通过样式覆盖的方式，后面的样式会覆盖前面的样式，这种方式需要注意样式的顺序。

 3、    <img src="./logo.png" style="transform: scale(0.625, 1); width: 480px !important;">

通过缩放宽度比例的方式，这种也不需要注意样式代码的顺序。

4、document.getElementsByTagName('img')[0].setAttribute('style', 'width: 300px !important;')

这种方式其实跟第二种方式事一样的原理，都是利用后来的样式覆盖前面的样式。