Override css width

问题

How can I override a css width so that a competing width HTML attribute defines the computed size?

The following example is rendered with a width of 500px, but I want 100px. Assume that the css rule cannot be changed - just masked by a stronger rule.

Edit for clarification: I don't want to set an explicit size inline or somewhere else.

img {
  width: auto;
}

<img src="http://placekitten.com/500/500" width="100px">

回答1:

You can use inline style to set width

img {
  width: auto;
}

<img src="http://placehold.it/500x500" style="width: 100px">

回答2:

Take a look at the !important tag:

More info here

回答3:

You can use inline css:

<img src="http://placekitten.com/500/500" style="width:100px">

or you can just remove the px from your current code:

<img src="http://placekitten.com/500/500" width="100">

回答4:

you can use !important annotation : width: 100px!important;

回答5:

Simply use like this

img {
width: auto;}

<img src="http://placekitten.com/500/500" style="width: 100px;">

回答6:

Try this.

img { width: auto; } <img src="http://placehold.it/500x500" style="width: 100px !important;">

来源：https://stackoverflow.com/questions/40216455/override-css-width