Your ad can be in a database, static file output with server side programming, or retrieved via jQuery/AJAX (?)
Say you have this in your html that sits in a column:
<div id="ad-block-one">
</div>
#ad-block-one,
#ad-block-two,
#ad-block-three {
width: 250px;
height: 125px;
border: 1px solid #000;
}
Then from the database, or text file, ad 1 consists of
<h3>Buy My Widgets</h3>
<p>My widgets simply rock, can be used for:</p>
<ul>
<li>Moving Islands</li>
<li>Cleaning Tile Grout</li>
<li>Deflowering</li>
</ul>
<p><a href="http ://www.example.com">Buy Now</a></p>
Then you'd control h3, ul, li, p with CSS. In one scenario I've done this, the ads are controlled by logged in users via simple text fields (head, intro, list items, link) and they can choose among several layouts. Each layout applies a different CSS to the ad.
If you do it dynamically server side (PHP, etc., but not likely as you said
.html) you'd do
<div id="ad-block-one">
[AD-ONE-PLACEHOLDER]
</div>
and sub out ad one for the placeholder. With jQuery, just as easy, fetch with AJAX, write to the div with jQuery.
Or you could hard code it in and dispense with JS entirely. The advantage with dynamically output ads using either method is you can randomize - or set - specific ad positions on the pages (i.e., ad at upper left costs more.) So many ways to go. :-)
