Override font tag html with css inline

Question

there is a way to override a size and face using only css inline, I have a template for an email and it does not render css en head or functions, either javascript. I have something like this.

<h1><font face="cursive" size="1" style="background-color: rgb(255, 255, 0);">Prueba de descripción</font></h1> 

this part is dynamic, the code receives another html codes with that user creates, i want to maintain my own format.

 <div class="all:unset !important;font-family:unset !important;font-size:unset !important;"> <table style='font-family:"Courier New", Courier, monospace; font-size:80%'> <tr> <td> <span> <b>Current Status</b> </span> </td> <td> <span> <h1><font face="cursive" size="1" style="background-color: rgb(255, 255, 0);">Prueba de descripción</font></h1> </span> </td> </tr> </table> </div>

Answer 1

Use this. The !important may or may not be necessary depending on your stylesheet. The snippet doesn't need it but I figured I would add it anyway. You could also add a class .

 font { font-family: none !important; } /* a way to target only that font if there is more <font> elements */ td:nth-child(2)>span>h1>font { font-family: none; }

 <div class="all:unset !important;font-family:unset !important;font-size:unset !important;"> <table style='font-family:"Courier New", Courier, monospace; font-size:80%'> <tr> <td> <span> <b>Current Status</b> </span> </td> <td> <span> <h1><font face="cursive" size="1" style="background-color: rgb(255, 255, 0);">Prueba de descripción</font></h1> </span> </td> </tr> </table> </div>