HTML5 and CSS3, Second Edition

The default styling in most browsers works pretty well, as you can see in the

following figure; each answer is indented underneath each question.

Figure 5—Our usnstyled FAQ

With this markup in place, we can apply styles without adding classes to the

HTML elements. It’s also easy for us to collapse the entries in the FAQ with

JavaScript if we want to save real estate on smartphones.

Every browser supports the <dl> tag; the only thing that changed in HTML5 is

how we’re supposed to use it with content. There’s no need for a fallback solution.

2.1 The Future

You can do some interesting things with these new tags and attributes. For

example, we can easily identify and disable navigation and article footers

using print style sheets:

nav,article>footer{display:none}

We can use scripting languages to quickly identify all of the articles on a page

or on a site. But most important, we can mark up content with appropriate

tags that describe it so we can write better style sheets and better JavaScript.

Take a look at the specification, and you’ll find a few more elements that

browsers will eventually implement, including markup for dialog boxes (<dia-

log>), highlighted text (<mark>), and more.

Custom data attributes give developers the flexibility to embed all sorts of

information in their markup. In fact, we’ll use them again in Chapter 6,

Drawing in the Browser, on page 111.

We can use them with JavaScript to determine whether a form tag should

submit via Ajax, by simply locating any form tag with data-remote=true. We can

also use them to display dates and times in a user’s time zone while still

caching the page. Simply put the date on the HTML page as UTC, and convert

it to the user’s local time on the client side. These attributes allow you to

embed real, usable data in your pages, and you can expect to see more and

more frameworks and libraries taking advantage of them. I’m sure you’ll find

lots of great uses for them in your own work.

And we can help wipe out Divitis once and for all!

report erratum • discuss

The Future • 35

Download from Wow! eBook <www.wowebook.com>