title: Adding simple css to iframe/html
body: <p>I have got some HTML code from investing.com below:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;iframe frameborder="0" height="380" width="230" src="https://ssltools.forexprostools.com/currency-converter/index.php?from=17&amp;to=12&amp;force_lang=1"&gt;&lt;/iframe&gt;&lt;br /&gt;&lt;table width="197"&gt;&lt;tr&gt;&lt;td&gt;&lt;span style="font-size: 11px;color: #333333;text-decoration: none;"&gt;The Currency Converter is powered by &lt;a href="https://www.investing.com/" rel="nofollow" target="_blank" style="font-size: 11px;color: #06529D; font-weight: bold;" class="underline_link"&gt;Investing.com&lt;/a&gt;&lt;/span&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The output is look like the picture below:</p>
  
  <p><a href="https://i.stack.imgur.com/3m11t.png" rel="nofollow noreferrer">enter image description here</a></p>
  
  <p>And I would like to add css to make the background like below:
  Rounded rectangle, 30 opacity with light green, maybe 10 px for margins </p>
  
  <p><a href="https://i.stack.imgur.com/Spceu.jpg" rel="nofollow noreferrer">enter image description here</a></p>
  
  <p>Can anybody help me. I am new for html and css. Thank you very much.</p>
  
  <p>Lawrence</p>