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.
Click here to view code image
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