Tag aside là gì | Ý nghĩa và cách sử dụng thẻ aside trong html 5
logo-alantien
banner-header

Tag aside là gì | Ý nghĩa và cách sử dụng thẻ aside trong html 5

Tác giả: Alan Tiến

Thẻ tag aside là gì?

Tag aside là một thẻ tag mới trong html 5 giúp định nghĩa nội dung bên ngoài nội dung chính. Chúng ta thường thấy tag aside bên phần sidebar của website. Nó có thể chứa tất cả các tag định dạng khác trong html.

Ý nghĩa của tag aside trong html 5

Thông thường tag aside được sử dụng cho phần nội dung liên quan đến nội dung chính. Nó được áp dụng cho thiết kế sidebar, bài viết liên quan…

Tag aside rất quan trọng trong website được thiết kế bằng html 5. Ngoài việc hiện thị những thông tin liên quan cho nội dung chính. Nó còn tạo những nội dung liên quan hấp dẫn, giữ chân độc giả của bạn.

tag-aside-la-gi

Thẻ tag aside trong html 5

Cấu trúc

<aside></aside>

Việc sử dụng tag aside cũng giống như các tag html. Các bạn chú ý có mở html thì phải đống lại nha. Tránh trường hợp bị lỗi layout vì quên đóng thẻ tag.

Các trình duyệt hổ trợ tag aside

HTML Tag
<aside> Yes Yes Yes Yes Yes

Hầu hết các duyệt trình web hiện nay đều hỗ trợ tốt cho tag aside. Nhưng với các phiên bản ie thấp hơn ie 9 cần có css và  javascript hỗ trợ.

Đoạn css hỗ trợ ie

article {
    display: block;	
}

Đoạn javascript hỗ trợ ie.

Với đoạn javascript này các bạn có thể ứng dụng cho các tag khác như <section>, <article>, <hgroup>, <header>, <footer>, <nav>, <aside>, <figure>, <mark>, <time>, <ruby>, <rt>, <rp>.

(function (){
    var els = [	'section', 'article', 'hgroup', 'header', 'footer', 'nav', 'aside', 
	'figure', 'mark', 'time', 'ruby', 'rt', 'rp' ];
    for (var i=0; i<els.length; i++){
        document.createElement(els[i]);
        }
})();
the-aside-trong-html-5jpg

Tag side là gì trong html 5

Cách sử dụng tag html aside trong html 5

Mẫu ví dụ về sử dụng tag aside trong sidebar

<aside>
<h2>Tiêu đề cho sidebar</h2>
<p>Nội dung cho sidebar</p>
</aside>

Ví dụ khác về sử dụng aside trong bài viết liên quan

<aside>
<h2>Bài viết liên quan</h2>
<ul class="list-content">
<li> <a href="https://alantien.com/tag-article-la-gi.html">Tag article là gì</a></li>
<li> <a href="https://alantien.com/tag-address-la-gi.html">Tag address là gì</a></li>
<li> <a href="https://alantien.com/a-href-la-gi-tao-lien-ket-bang-the-a-trong-html.html">Tag a href là gì</a></li>
</ul>
</aside>

Kết quả:

 

Việc sử dụng tag aside đúng cách giúp website của bạn cần thân thiện hơn. Các bạn có thể kết hợp với các thuộc tính css, sự kiện để trang trí đẹp hơn.

Các thuộc tính của tag aside trong html 5.

Các thuộc tính của html 5 đều sử dụng được cho tag aside. Các bạn có thể tự do thiết kế website theo ý muốn của mình.

Với những ví dụ trên mình mong rằng các bạn có thể thành thạo và hiểu tag aside hơn. Có rất nhiều bạn không quen sử dụng html trong thiết kế. Nhưng sau bài viết này, các bạn có thể tập thay đổi thói quen. Chúc các thành công, đừng quên đánh giá 5 sao nếu bài viết hữu ích nhé.

 

Tag aside là gì | Ý nghĩa và cách sử dụng thẻ aside trong html 5
4.2 (84%) 5 votes

Bạn có thể tìm thấy bài viết Tag aside là gì | Ý nghĩa và cách sử dụng thẻ aside trong html 5 với các từ khóa sau:-,

like

Gửi bình luận

  • Dịch Vụ

    Khóa Học Viết Bài Chuẩn SEO Tại Nhà TPHCM

    Viết 5 bài chuẩn seo với hơn 1000 từ trong một...

    Khóa học thiết kế website WordPress tại nhà

    Khóa học thiết kế website WordPress tại nhà dành cho những...

    Thiết kế website wordpress giá rẻ: dịch vụ chuyên nghiệp – chuẩn #1

    Bạn đang muốn tìm dịch vụ thiết kế website wordpress giá...

  • Tự học wordpress

    Tạo nút gọi điện thoại đẹp đơn giản với Plugin Call Now Animate

    Hôm nay mình sẽ hướng dẫn các bạn tạo nút gọi...

    Cài đặt wordpress trên xampp bảo mật nhất

    Cài đặt wordpress trên xampp rất đơn giản những hôm nay...

    Hướng dẫn tạo form liên hệ với Contact Form 7 đơn giản

    Với form liên hệ đẹp sẽ giúp website của bạn trở...

    Plugin kk star ratings tạo đánh giá 5 sao trên kết quả tìm kiếm google

    Chắc nhiều bạn thắc mắc tại sao website của người khác...

    Sửa lỗi Briefly Unavailable for Scheduled Maintenance trên WordPress

    Hiện nay rất nhiều bạn đang gặp lỗi “Briefly Unavailable for...

  • Học HTML Căn Bản

    Tag basefont là gì | thẻ basefont trong html

    Tag basefont là gì Tag basefont là một thẻ html căn...

    Tag base là gì | Thẻ Base và thuộc tính target trong html

    Tag base là gì Tag Base là một thẻ html được...

    Thẻ định dạng font chữ và văn bản trong html 5

    Trong bài này mình sẽ tổng hợp các thẻ định dạng font...

    Tag audio là gì | Thẻ audio chèn âm thanh trong html 5

    Tag audio là gì Tag audio là một tag đặc biệt...

    Tag aside là gì | Ý nghĩa và cách sử dụng thẻ aside trong html 5

    Thẻ tag aside là gì? Tag aside là một thẻ tag...

    Tag article là gì | Cách sử dụng thẻ article trong html 5

    Tag article là gì Tag article là một thẻ mới trong html 5...

    Tag area là gì | Cách sử dụng thẻ Area trong html

    Tag area là gì Tag area là một thẻ html xác...

    Tag Address là gì | Cách sử dụng thẻ Address trong HTML

    Tag Address là gì Tag Address là một thẻ html được...

    Tag acronym là gì | cách sử dụng tag acronym trong html

    Tag Acronym là gì Tag Acronym là một tag html được...

  • Key đang SEO Top