Các phần tử mới trong HTML 5 Sự phát triển của HTML đã dừng lại vào năm 1999 với HTML 4. W3C đã tập trung nỗ lực của mình vào việc thay đổi cú pháp cơ bản của HTML từ Standard Generalized Markup Language (SGML - Ngôn ngữ đánh dấu tổng quát hóa tiêu chuẩn) sang XML, cũng như các ngôn ngữ đánh dấu hoàn toàn mới như Scalable Vector Graphics (SVG - Các đồ họa vector co giãn được), XForms và MathML. Các nhà cung cấp trình duyệt đã tập trung vào các tính năng trình duyệt như các ô tab và các trình đọc RSS. Các nhà thiết kế web đã bắt đầu tìm hiểu ngôn ngữ CSS và JavaScript™ để xây dựng các ứng dụng riêng của họ trên đỉnh của các khung công tác hiện có bằng cách sử dụng Ajax (JavaScript không đồng bộ + XML). Nhưng chính HTML hầu như đã không phát triển trong những năm tiếp theo. Các từ viết tắt thông dụng  CSS: Cascading Style Sheets (Các bản định kiểu xếp chồng)  HTML: Hypertext Markup Language (Ngôn ngữ đánh dấu siêu văn bản)  W3C: World Wide Web Consortium (Hiệp hội Mạng toàn cầu)  XML: Extensible Markup Language (Ngôn ngữ đánh dấu mở rộng) Gần đây, HTML dường như đang hồi sinh. Ba nhà cung cấp trình duyệt chính—Apple, Opera và Mozilla Foundation—đã hợp tác tạo nên nhóm WhatWG (Web Hypertext Application Technology Working Group – Nhóm làm việc công nghệ ứng dụng siêu văn bản Web) để phát triển một phiên bản cập nhật và nâng cấp của HTML cổ điển. Gần đây hơn, W3C đã lưu ý đến những phát triển này và đã bắt đầu những nỗ lực HTML thế hệ mới riêng của mình với những thành viên tương tự. Cuối cùng, nhiều khả năng là hai nỗ lực sẽ được hợp nhất. Mặc dù nhiều chi tiết vẫn còn được tranh luận, nhưng các phác thảo về phiên bản tiếp theo của HTML đang trở nên rõ ràng hơn. Phiên bản mới HTML này—thường được gọi là HTML 5, mặc dù nó cũng mang tên Web Applications 1.0 (Các ứng dụng Web 1.0)—ngay lập tức sẽ phải được ghi nhận với nhà thiết kế Web. Không có các namespace hoặc các lược đồ schema nào. Các phần tử không cần bắt buộc phải được đóng lại. Trình duyệt sẽ bỏ qua các lỗi. Một p vẫn là một p, và một table (bảng) vẫn sẽ là một table. Tuy vậy, các nhà thiết kế Web có thể sẽ gặp phải một số phần tử mới và khó hiểu. Các phần tử cũ như div vẫn còn, nhưng bây giờ HTML còn có thêm section, header, footer và nav nữa. em, code và strong cũng vẫn còn, nhưng cũng có thêm meter, time và m. img và embed vẫn còn và cũng có thêm cả video và audio. Tuy nhiên, nếu bạn xem xét kỹ hơn thì sẽ phát hiện rằng những phần tử này không khác lắm. Nhiều phần tử trong đó có thể là những thứ mà các nhà thiết kế cần từ năm 1999 nhưng không có. Tất cả những phần tử mới này có thể học dễ dàng bởi sự tương đồng đơn giản với các phần tử mà nhà thiết kế đã hiểu. Trong thực tế, chúng dễ học hơn nhiều so với Ajax hoặc CSS. Cuối cùng, nếu người dùng sử dụng máy tính xách tay có tốc độ 300MHz chạy Windows 98 thì họ có thể ngạc nhiên khi nhận ra rằng các trang mới hiển thị tốt trong Netscape 4 và Windows® Internet Explorer® 5. Bởi vì trình duyệt sẽ không ghi nhận hoặc làm bất cứ điều gì với các phần tử mới, nhưng trang vẫn hiển thị và tất cả nội dung vẫn ở đó. Đó không phải là sự trùng hợp ngẫu nhiên. HTML 5 được thiết kế để có thể tương thích với các trình duyệt không hỗ trợ nó. Lý do rất đơn giản: Chúng ta tất cả đều là những người ở hang ra. Hiện nay các trình duyệt có các ô tab, CSS và XMLHttpRequest, nhưng các trình biểu diễn hình ảnh (renderer) của HTML của chúng đang bị kẹt lại ở năm 1999. Web không thể tiến lên phía trước mà không tính đến cơ sở đã cài đặt. HTML 5 hiểu điều này. Nó cung cấp các lợi ích thực sự cho tác giả trang web hôm nay đồng thời hứa hẹn nhiều hơn cho các độc giả trang web ngày mai khi các trình duyệt đang dần dần được nâng cấp. Với ý nghĩ đó, chúng ta hãy xem xét những gì HTML 5 mang đến cho bạn. Cấu trúc Ngay cả các trang HTML đúng định dạng cũng khó xử lý hơn so với mong đợi vì thiếu cấu trúc. Bạn phải tìm ra nơi nào là các ngắt đoạn bằng cách phân tích các mức header. Các thanh Sidebar, footer, header, các trình đơn điều hướng, các phần nội dung chính và những đoạn riêng lẻ được đánh dấu bằng phần tử div chứa mọi thứ. HTML 5 thêm các phần tử mới để xác định rõ ràng từng cái trong số các cấu kiện chung ấy:  section: Một phần hoặc chương trong một cuốn sách, một phần trong một chương hoặc về cơ bản là bất cứ thứ gì có tựa đề riêng của nó trong HTML 4.  header: Đầu trang được hiển thị trên trang; không giống như phần tử head (phần đầu).  footer: Chân trang, nơi hiển thị chữ nhỏ; chữ ký trong một bức thư điện tử.  nav: Một bộ sưu tập các liên kết đến các trang khác.  article: Một mục độc lập trong một blog, tạp chí, bản tóm tắt và v.v. Ví dụ, hãy xem xét một trang đầu blog điển hình với một header ở đỉnh trang, một footer ở dưới đáy, một số mục, một phần điều hướng và thanh sidebar, như thể hiện trong Liệt kê 1. Liệt kê 1. Một trang blog điển hình hiện nay <html> <head> <title>Mokka mit Schlag </title> </head> <body> <div id="page"> <div id="header"> <h1><a href="http://www.elharo.com/blog">Mokka mit Schlag</a></h1> </div> <div id="container"> <div id="center" class="column"> <div class="post" id="post-1000572"> <h2><a href= "/blog/birding/2007/04/23/spring-comes-and-goes-in-sussex-county/"> Spring Comes (and Goes) in Sussex County</a></h2> <div class="entry"> <p>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. </p> </div> </div> <div class="post" id="post-1000571"> <h2><a href= "/blog/birding/2007/04/23/but-does-it-count-for-your-life-list/"> But does it count for your life list?</a></h2> <div class="entry"> <p>Seems you can now go <a href="http://www.wired.com/science/discoveries/news/ 2007/04/cone_sf">bird watching via the Internet</a>. 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.</p> </div> </div> </div> <div class="navigation"> <div class="alignleft"> <a href="/blog/page/2/">&laquo; Previous Entries</a> </div> <div class="alignright"></div> </div> </div> <div id="right" class="column"> <ul id="sidebar"> <li><h2>Info</h2> <ul> <li><a href="/blog/comment-policy/">Comment Policy</a></li> <li><a href="/blog/todo-list/">Todo List</a></li> </ul></li> <li><h2>Archives</h2> <ul> <li><a href='/blog/2007/04/'>April 2007</a></li> <li><a href='/blog/2007/03/'>March 2007</a></li> <li><a href='/blog/2007/02/'>February 2007</a></li> <li><a href='/blog/2007/01/'>January 2007</a></li> </ul> </li> </ul> </div> <div id="footer"> <p>Copyright 2007 Elliotte Rusty Harold</p> </div> </div> </body> </html> Ngay cả việc thụt đầu dòng thích hợp, đó là một đống khá lộn xộn của các div lồng nhau. Trong HTML 5, bạn có thể thay thế chúng bằng các phần tử ngữ nghĩa trực tiếp hơn, như trong Liệt kê 2. Liệt kê 2. Một trang blog điển hình theo HTML 5 <html> <head> <title>Mokka mit Schlag </title> </head> <body> <header> <h1><a href="http://www.elharo.com/blog">Mokka mit Schlag</a></h1> </header> <section> <article> <h2><a href= "/blog/birding/2007/04/23/spring-comes-and-goes-in-sussex-county/"> Spring Comes (and Goes) in Sussex County</a></h2> <p>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. </p> </article> <article> <h2><a href= "/blog/birding/2007/04/23/but-does-it-count-for-your-life-list/"> But does it count for your life list?</a></h2> <p>Seems you can now go <a href="http://www.wired.com/science/discoveries/news/ 2007/04/cone_sf">bird watching via the Internet</a>. 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.</p> </article> <nav> <a href="/blog/page/2/">&laquo; Previous Entries</a> </nav> </section> <nav> <ul> <li><h2>Info</h2> <ul> <li><a href="/blog/comment-policy/">Comment Policy</a></li> <li><a href="/blog/todo-list/">Todo List</a></li> </ul></li> <li><h2>Archives</h2> <ul> <li><a href='/blog/2007/04/'>April 2007</a></li> <li><a href='/blog/2007/03/'>March 2007</a></li> <li><a href='/blog/2007/02/'>February 2007</a></li> <li><a href='/blog/2007/01/'>January 2007</a></li> </ul> </li> </ul> </nav> <footer> <p>Copyright 2007 Elliotte Rusty Harold</p> </footer> </body> </html> Không cần thiết có các div nào nữa. Thay vì sử dụng các thuộc tính class đặc trưng cho trang, ý nghĩa của các phần khác nhau có thể được suy ra từ các tên tiêu chuẩn. Điều này đặc biệt quan trọng đối với âm thanh, điện thoại di động và các trình duyệt không chuẩn khác. Về đầu trang Các phần tử ngữ nghĩa khối Cũng như các phần tử cấu trúc, HTML 5 thêm một số phần tử mức-khối thuần ngữ nghĩa:  aside  figure  dialog Tôi sử dụng hai phần tử đầu tiên suốt trong các bài viết như bài này và trong các cuốn sách của tôi. Phần tử thứ ba, bản thân tôi không sử dụng nhiều lắm, nhưng nó phổ biến trong nhiều văn bản viết. Phần tử aside Phần tử aside mô tả một lưu ý, một lời khuyên, một thanh bên, một nội dung trích dẫn, một nhận xét trong ngoặc đơn hoặc một cái gì đó chỉ ở bên ngoài luồng chính của câu chuyện. Ví dụ, trong các bài viết trên developerWorks, bạn thường tìm thấy các thanh bên được mã hóa thành các bảng, như thể hiện trong Liệt kê 3. Liệt kê 3. Một thanh bên của HTML 4 trên developerWorks <table align="right" border="0" cellpadding="0" cellspacing="0" width="40%"> <tbody><tr><td width="10"> <img alt="" //www.ibm.com/i/c.gif" height="1" width="10"></td> <td> <table border="1" cellpadding="5" cellspacing="0" width="100%"> <tbody><tr><td bgcolor="#eeeeee"> <p><a name="xf-value"><span class="smalltitle">.xf-value</span></a></p> <p> The <code type="inline">.xf-value</code> selector used here styles the input field value but not its label. This is actually inconsistent with the current CSS3 draft. The example really should use the <code type="inline">::value</code> pseudo-class instead like so: </p> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tbody><tr><td class="code-outline"> <pre class="displaycode">input::value { width: 20em; } #ccnumber::value { width: 18em } #zip::value { width: 12em } #state::value { width: 3em }</pre> </td></tr></tbody></table><br> <p> However, Firefox doesn't yet support this syntax. </p> </td></tr></table> Trong HTML 5, bạn có thể viết phần tử này hợp lý hơn nhiều, như thể hiện trong Liệt kê 4. Liệt kê 4. Một thanh bên của HTML 5 trên developerWorks <aside> <h3>.xf-value</h3> <p> The <code type="inline">.xf-value</code> selector used here styles the input field value but not its label. This is actually inconsistent with the current CSS3 draft. The example really should use the <code type="inline">::value</code> pseudo-class instead like so: </p> <pre class="displaycode">input::value { width: 20em; } #ccnumber::value { width: 18em } #zip::value { width: 12em } #state::value { width: 3em }</pre> <p> However, Firefox doesn't yet support this syntax. </p> </aside> Trình duyệt có thể tìm ra nơi đặt thanh bên, có thể với sự giúp đỡ chút ít từ CSS. Phần tử figure Phần tử figure mô tả một hình ảnh mức-khối, cùng với một lời chú thích. Ví dụ, trong nhiều bài viết trên developerWorks, bạn thấy cách đánh dấu giống như Liệt kê 5; các kết quả được hiển thị trong Hình 1. Liệt kê 5. Một phần tử figure của HTML 4 trên developerWorks <a name="fig2"><b>Figure 2. Install Mozilla XForms dialog</b></a><br /> <img alt="A Web site is requesting permission to install the following item: Mozilla XForms 0.7 Unsigned" nstalldialog.jpg" border="0" height="317" hspace="5" vspace="5" width="331" /> <br /> Hình 1. Hộp thoại cài đặt của XForms Mozilla Trong HTML 5, bạn có thể viết phần tử này có ngữ nghĩa hơn, như thể hiện trong Liệt kê 6. Liệt kê 6. Một phần tử figure của HTML 5 trên developerWorks <figure id="fig2"> <legend>Figure 2. Install Mozilla XForms dialog</legend> <img alt="A Web site is requesting permission to install the following item: Mozilla XForms 0.7 Unsigned" src="installdialog.jpg" border="0" height="317" hspace="5" vspace="5" width="331" /> </figure> Quan trọng hơn, các trình duyệt—đặc biệt là các trình đọc màn hình—có thể ghi kèm lời chú thích với hình một cách rõ ràng mà không nhập nhằng. Phần tử figure không chỉ giới hạn cho các bức ảnh. Bạn cũng có thể sử dụng nó để chú thích các phần tử audio, video, iframe, object và embed. Phần tử dialog Phần tử dialog mô tả một cuộc trò chuyện giữa một số người. Người ta nạp chồng lên phần tử dt của HTML 5 để chỉ ra người nói và nạp chồng lên phần tử dd của HTML 5 để chỉ ra tiếng nói. Điều này cho phép hiển thị hợp lý ngay cả trong các trình duyệt cũ. Liệt kê 7 cho thấy một đoạn đối thoại nổi tiếng từ "Đối thoại liên quan đến Hai hệ thống thế giới chính" của Galileo. Liệt kê 7. Một cuộc đối thoại của Galileo trong HTML 5 <dialog> <dt>Simplicius </dt> <dd>According to the straight line AF, and not according to the curve, such being already excluded for such a use.</dd> <dt>Sagredo </dt> <dd>But I should take neither of them, seeing that the straight line AF runs obliquely. I should draw a line perpendicular to CD, for this would seem to me to be the shortest, as well as being unique among the infinite number of longer and unequal ones which may be drawn from the point A to every other point of the opposite line CD. </dd> <dt>Salviati </dt> <dd><p> Your choice and the reason you adduce for it seem to me most excellent. So now we have it that the first dimension is determined by a straight line; the second (namely, breadth) by another straight line, and not only straight, but at right angles to that which determines the length. Thus we have defined the two dimensions of a surface; that is, length and breadth. </p> <p> But suppose you had to determine a height—for example, how high this platform is from the pavement down below there. Seeing that from any point in the platform we may draw infinite lines, curved or straight, and all of different lengths, to the infinite points of the pavement below, which of all these lines would you make use of? </p> </dd> </dialog> Người ta vẫn còn đang tranh cãi về cú pháp chính xác của phần tử này. Một số người muốn nhúng văn bản bổ sung không phải đối thoại (chẳng hạn như các hướng dẫn biểu diễn) vào trong phần tử dialog và những người khác không hài lòng với việc nạp chồng lên dt và dd. Tuy nhiên, hầu hết mọi người đều đồng ý rằng một số trình bày đối thoại ngữ nghĩa như vậy là một điều tốt, ngay cả khi họ chưa đồng ý về cú pháp chính xác. Về đầu trang Các phần tử ngữ nghĩa nội dòng HTML 4 có năm phần tử nội dòng khác nhau để mô tả các biến thể tinh tế khác nhau của mã máy tính: var, code, kbd, tt và samp. Tuy nhiên, nó không có cách nào để chỉ ra các đặc tính cơ bản như thời gian, các số hoặc lời mỉa mai. HTML 5 nhằm mục đích chỉnh lý lại sự thiếu cân đối giữa các chuyên gia và những người viết bình thường bằng một số phần tử nội dòng mới. Phần tử mark Phần tử m cho biết văn bản đó được "đánh dấu" bằng cách nào đó nhưng không nhất thiết phải nhấn mạnh. Bạn có thể tưởng tượng nó như là các đoạn được làm nổi bật trong một cuốn sách. Trường hợp sử dụng kinh điển là các trang được lưu trong bộ nhớ đệm của Google. Khi bạn đi theo một liên kết đến các bản sao được lưu trong bộ nhớ đệm, các thuật ngữ tìm kiếm được đánh dấu. Ví dụ, nếu bạn tìm kiếm "Egret" (con cò), thì một trang Google được lưu trữ trong bộ nhớ đệm có thể được đánh dấu như sau: The Great <m>Egret</m> (also known as the American <m>Egret</m>) is a large white wading bird found worldwide. The Great <m>Egret</m> flies with slow wing beats. The scientific name of the Great <m>Egret</m> is <i>Casmerodius albus</i>. Tên của phần tử này hiện đang còn phải thảo luận một chút. Có thể thay đổi nó thành mark thay cho m trước khi đặc tả được phát hành. Phần tử time Phần tử time cho biết một thời điểm cụ thể trong lịch sử, chẳng hạn như 05:35 chiều, giờ chuẩn ở miền đông Bắc Mỹ (EST), 23.04. 2007. Ví dụ, <p>I am writing this example at <time>5:35 P.M. on April 23rd</time>. </p> Phần tử time giúp các trình duyệt và những người khác nhận ra các vùng thời gian trong các trang HTML. Nó không đòi hỏi bất kỳ định dạng đặc biệt nào về nội dung của phần tử. Tuy nhiên, mỗi phần tử time nên có một thuộc tính datetime bao gồm thời gian dưới dạng dễ chấp nhận với máy tính, như sau: <p>I am writing this example at <time datetime="2007-04-23T17:35:00-05:00">5:35 P.M. on April 23rd</time>. </p> Các vùng thời gian dễ đọc với máy tính có thể có ích cho các công cụ tìm kiếm, các chương trình lịch biểu và v.v. Phần tử meter Phần tử meter biểu diễn một giá trị số trong một phạm vi đã quy định. Ví dụ, bạn có thể sử dụng nó với tiền lương, tỷ lệ phần trăm các cử tri Pháp đã bỏ phiếu cho Le Pen hoặc các điểm thi. Ở đây, tôi sử dụng phần tử meter để đánh dấu một số dữ liệu mà tôi đã nhận được từ một lập trình viên của Google tại Software Development 2007: [...]... data); }; Phần tử menu và command Phần tử menu đã thực sự có mặt trong HTML ít nhất là từ phiên bản 2 Nó đã bị phản đối trong HTML 4, nhưng nó quay lại trong HTML 5 với một ý nghĩa mới Trong HTML 5, một phần tử menu chứa các phần tử command, mỗi phần tử command trong số đó gây ra một hành động ngay lập tức Ví dụ, Liệt kê 12 là một phần tử menu bật lên các cảnh báo Liệt kê 12 Phần tử menu của HTML 5 ... HTML khác Ví dụ, Liệt kê 9 cho thấy một phần tử datagrid hoặc một nhóm các phần tử HTML khác Trong ví dụ này, phần tử datagrid được điền dữ liệu từ một table Một phần tử datagrid một chiều đơn giản hơn có thể được điền dữ liệu bởi một phần tử select Nếu các phần tử HTML khác được sử dụng, thì mỗi phần tử con trở thành một hàng trong lưới đó Liệt kê 9 Một tờ bảng điểm datagrid JonesAllisonA-B+A... tác HTML 5 cũng nằm trong chuyên mục Các ứng dụng web 1.0 Hướng tới mục tiêu đó, một số phần tử mới được tập trung vào các trải nghiệm tương tác nhiều hơn cho các trang web:     details datagrid menu command Tất cả các phần tử này đều có khả năng thay đổi những gì được hiển thị dựa trên hành động và sự lựa chọn của người dùng mà không cần tải một trang mới từ máy chủ Phần tử details Phần tử details... Sự phận biệt giữa phần tử này với một bảng (table) thông thường là ở chỗ người dùng có thể chọn các hàng, các cột và các ô; che bớt các hàng, các cột và các ô; chỉnh sửa các ô; xóa các hàng, các cột và các ô; sắp xếp lưới; và mặt khác tương tác với các dữ liệu trực tiếp trong trình duyệt trên máy khách Mã JavaScript theo dõi các bản cập nhật Giao diện HTMLDataGridElement (Liệt kê 10)... thành phần điều khiển lưới Nó được dự kiến dành cho các cây, các danh sách và các bảng có thể được cập nhật bởi cả người dùng lẫn các kịch bản lệnh Ngược lại, các bảng truyền thống chủ yếu được dự kiến dành cho dữ liệu tĩnh Một phần tử datagrid nhận dữ liệu ban đầu của nó từ các nội dung của nó, đó là một table, select (chọn) hoặc một nhóm các phần tử HTML khác Ví dụ, Liệt kê 9 cho thấy một phần tử datagrid... đầu trang Kết luận HTML 5 là một phần tương lai của Web Các phần tử mới của nó cho phép đánh dấu rõ ràng hơn, đơn giản hơn, làm cho các trang hiển nhiên hơn Phần tử div và span vẫn có chỗ của chúng, nhưng những chỗ đó sẽ bị hạn chế nhiều hơn nhiều so với trước đây Nhiều trang sẽ không còn cần sử dụng chúng nữa Mặc dù không phải tất cả các trình duyệt đều sẽ hỗ trợ những phần tử mới này từ lúc đầu,... đúng đối với hầu hết các phần tử được đưa vào sau khi HTML lần đầu tiên được phát minh: img, table, object và nhiều hơn nữa Sự hỗ trợ sẽ đến với thời gian Trong khi đó, hành vi phải-bỏ qua của HTML đối với các phần tử chưa được nhận biết có nghĩa là những người dùng với các trình duyệt cũ vẫn sẽ có thể đọc các trang HTML 5 Chúng có thể làm như vậy hiện nay Những người dùng với các trình duyệt hiện... gian dài chờ đợi những tính năng mới, đặc biệt là trong thế giới chuyển động nhanh của các trang web HTML 5 khôi phục một số sự phấn khích của những ngày đầu khi Netscape, Microsoft và những công ty khác đã giới thiệu các phần tử mới mỗi tuần Đồng thời, nó dùng một cách tiếp cận thận trọng hơn để định nghĩa những phần tử này để cho mọi người có thể sử dụng chúng một cách tương thích với nhau Tương lai... entry level programmer in Silicon Valley can expect to start around $90,000 per year Phần tử meter giúp các trình duyệt và các máy khách khác nhận ra các số lượng (amounts) trong các trang HTML Nó không đòi hỏi bất kỳ định dạng đặc biệt nào với nội dung của phần tử Tuy nhiên, mỗi phần tử meter có thể có nhiều nhất lên đến sáu thuộc tính cung cấp thông tin về số lượng này dưới một dạng... đã nhận được là 65 Điểm cao nhất mà có người đã nhận được là 96, mặc dù điểm lý tưởng đương nhiên là 100 Các chương trình đại lý người dùng có thể hiển thị thông tin này bằng cách sử dụng một số loại kiểm soát thước đo hoặc cung cấp thêm dữ liệu trong phần chú giải công cụ, nhưng hầu hết có thể sẽ tạo kiểu dáng cho nó giống như bất kỳ phần tử nội dòng khác nào Phần tử progress Phần tử progress mô tả . Phần tử menu và command Phần tử menu đã thực sự có mặt trong HTML ít nhất là từ phiên bản 2. Nó đã bị phản đối trong HTML 4, nhưng nó quay lại trong HTML 5 với một ý nghĩa mới. Trong HTML 5, . một phần tử menu chứa các phần tử command, mỗi phần tử command trong số đó gây ra một hành động ngay lập tức. Ví dụ, Liệt kê 12 là một phần tử menu bật lên các cảnh báo. Liệt kê 12. Phần tử. giữa phần tử này với một bảng (table) thông thường là ở chỗ người dùng có thể chọn các hàng, các cột và các ô; che bớt các hàng, các cột và các ô; chỉnh sửa các ô; xóa các hàng, các cột và các