HTML and CSS Reference
In-Depth Information
element to be inherited by the page referenced within the
<iframe>
element. Addition-
ally, the
seamless
Boolean attribute allows links clicked on a page referenced within an
<iframe>
element to be opened within the same window as the original page that in-
cludes the
<iframe>
element.
1.
<iframe src="contact.html"
seamless
></iframe>
The
seamless
Boolean attribute is a new attribute introduced in HTML5. Although the
browser support for this attribute is growing, it will not work within older browsers. It's
advisable to test the
seamless
Boolean attribute before using it.
In Practice
Inline frames provide a great way to add dynamic content to a page. Let's give this a shot
by updating our Venue page with some maps.
1.
Before adding any maps or inline frames, let's first prepare our Venue page for a
two-column grid. Below the leading section of the page we'll add a
<section>
element with the class attribute value of
row
to identify a new section of the page,
and we'll include some general styles, such as a white
background
and some
vertical
padding
.
Directly inside this
<section>
element let's add a
<div>
element with the
class
attribute value of
grid
. The class of
grid
centers our content on the
page and prepares for the one-third and two-thirds columns to follow.
So far the main section of our
venue.html
file looks like this:
1.
<section class="row">
2.
<div class="grid">
3.
...
4.
</div>
5.
</section>
2.
Within the
<div>
element with the
class
attribute value of
grid
we'll have
two new sections, one for the conference venue and one for the conference hotel.
Let's add two new
<section>
elements and give each of these
<section>
elements a unique class that corresponds to its content. We'll use these classes to
add margins to the bottom of each section.
Our HTML should now look like this:
Search WWH ::
Custom Search