Is there a way to remove the <i> tag in italics using CSS?

Question

How to remove the effect of italics from <i> so that I can do this:

 <span> test<i>test</i> </span> 

I fill some text in <i> with jQuery innerHtml, so it is italicized, but I don't want the italic to have an effect.

Is it possible to somehow remove the italic effect using CSS?

I can not use another tag. I can only use <i> .

Answer 1

You just need to use this CSS code:

 .no-italics { font-style: normal; } 

HTML code:

 <span> test <i class='no-italics'>test</i> </span> 

Answer 2

Use the font style:

 i{font-style:normal;} 

Answer 3

You can do any formatting using CSS.

Like:

 b { font-weight: normal; } 

change bold text to plain text.

Same,

 i { font-style: normal; } 

make the font style <i> normal (not in italics).

Answer 4

You can use the font-style: normal CSS font-style: normal to get this effect. Then you can do your jQuery to put the text in the tag:

 $('i#replace').html('this text isn\'t italicized either . . . '); 

 i { font-style: normal; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <span>text text <i id="replace">this is NOT italic</i> text text</span> 

Answer 5

I have a similar scenario. But italics still persist .. Please tell me how to remove italics.