Structure and semantics of HTML5 (2): Structure_html5 tutorial skills
WBOY
Release: 2016-05-16 15:51:47
Original
1223 people have browsed it
Even well-formed HTML pages can be difficult to process due to a lack of structure. The level of the heading must be analyzed to see how the sections are divided. Sidebars, footers, headers, navigation bars, main content areas, and individual articles are all represented by common div elements. HTML 5 adds some new elements specifically to identify these common structures:
· section: This can be a chapter or section in a book, in fact anything that has its own title in HTML 4 · header: the header that appears on the page; separate from the head element Same · footer: footer; can display signature in email · nav: a set of links to other pages · article: an article in a blog, magazine, article compilation, etc.
Let’s consider a typical blog homepage, which has a header at the top, a footer at the bottom, several articles, a navigation area and a sidebar. See Code 1 for a typical blog page.
"/blog/birding/2007/04/23/spring-comes-and-goes-in-sussex-county/"> Spring Comes (and Goes) in Sussex County
Yesterday I joined the Brooklyn Bird Club for our annual trip to Western New Jersey, specifically Hyper Humus, a relatively recently discovered hot spot. It started out as a nice winter morning when we arrived at the site at 7:30 A.M., progressed to Spring around 10:00 A.M., and reached early summer by 10:15.
"/blog/birding/2007/04/23/but-does-it-count-for-your-life -list/"> But does it count for your life list?
Seems you can now go href="http: //www.wired.com/science/discoveries/news/ 2007/04/cone_sf">bird watching via the Internet. I haven't been able to test it out yet (20 user limit apparently) but this is certainly cool. Personally, I can't imagine it replacing actually being out in the field by any small amount. On the other hand, I've always found it quite sad to meet senior birders who are no longer able to hold binoculars steady or get to the park. I can imagine this might be of some interest to them. At least one elderly birder did a big year on TV, after he could no longer get out so much. This certainly tops that.
Even with the correct indentation, these nested divs still feel very confusing. In HTML 5, these elements can be replaced with semantic elements, see Code 2 for a typical blog page written in HTML5
"/blog/birding/2007/04 /23/spring-comes-and-goes-in-sussex-county/"> Spring Comes (and Goes) in Sussex County
Yesterday I joined the Brooklyn Bird Club for our annual trip to Western New Jersey, specifically Hyper Humus, a relatively recently discovered hot spot. It started out as a nice winter morning when we arrived at the site at 7:30 A.M., progressed to Spring around 10:00 A.M., and reached early summer by 10:15.
"/blog/birding/2007/04/23/but-does-it-count-for-your-life-list/"> But does it count for your life list?
Seems you can now go href="http://www.wired.com/science/discoveries/news/ 2007/04/cone_sf">bird watching via the Internet. I haven't been able to test it out yet (20 user limit apparently) but this is certainly cool. Personally, I can't imagine it replacing actually being out in the field by any small amount. On the other hand, I've always found it quite sad to meet senior birders who are no longer able to hold binoculars steady or get to the park. I can imagine this might be of some interest to them. At least one elderly birder did a big year on TV, after he could no longer get out so much. This certainly tops that.
Now the div is no longer needed. You no longer need to set the class attribute yourself, the meaning of each part can be inferred from the standard element name. This is especially important for audio browsers, mobile browsers, and other non-standard browsers.
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn