Kết nối

[HTML/HTML5] Phần 3: Các ví dụ cơ bản HTML

4.676 lượt xem 
 Cập nhật lần cuối: 10/06/2017 lúc 13:47:26
Thể loại: HTML/HTML5, Thiết kế Web 

Bài viết trình bày một số ví dụ cơ bản HTML. Nếu bạn chưa học về HTML, đừng quá lo lắng, nội dung bài này rất đơn giản và giúp bạn có cái nhìn ban đầu về HTML.

Tài liệu HTML
Tất cả tài liệu HTML phải bắt đầu bằng một chỉ thị dạng tài liệu: <!DOCTYPE html>. Tài liệu HTML phải bắt đầu với thẻ mở <html> và kết thúc bằng thẻ đóng </html>. Phần mã HTML hiển thị trên giao diện được nằm giữa cặp thẻ <body> và </body>.

<!DOCTYPE html>
<html>
<body>
<h1>Tiêu đề h1 --- dammio.com</h1>
<p>Đoạn văn bản đầu tiên.</p>
</body>
</html>

Tiêu đề HTML
Các tiêu đề HTML được định nghĩa là các thẻ <h1>, <h2>, <h3>, <h4>, <h5>, và <h6>. Các tiêu đề này có kích thước font chữ từ lớn đến nhỏ. Thẻ <h1> định nghĩa phần tiêu đề quan trọng nhất với kích thước chữ lớn nhất, ngược lại thẻ <h6> định nghĩa tiêu đề ít quan trọng nhất với kích thước chữ nhỏ nhất. Chúng ta cùng đến ví dụ xem các tiêu đề từ h1 đến h6 dưới đây như sau.

<!DOCTYPE html>
<html>
<body>
<h1>Tiêu đề số 1</h1>
<h2>Tiêu đề số 2</h2>
<h3>Tiêu đề số 3</h3>
<h4>Tiêu đề số 4</h4>
<h5>Tiêu đề số 5</h5>
<h6>Tiêu đề số 6</h6>
</body>
</html>

Đoạn văn bản HTML
Đoạn văn bản HTML được định nghĩa bằng thẻ <p>:

<!DOCTYPE html>
<html>
<body>
<p>Đây là 1 đoạn văn bản.</p>
<p>Đây là đoạn văn bản khác.</p>
</body>
</html>

Liên kết HTML
Liên kết được định nghĩa bằng thẻ mở <a> với thuộc tính href là đường dẫn liên kết khi người dùng nhấp chuột lên dòng chữ liên kết và thẻ đóng </a>.

<!DOCTYPE html>
<html>
<body>
<a href="https://www.dammio.com">Liên kết đến website dammio.com</a>
</body>
</html>

Hình ảnh HTML
Hình ảnh HTML được định nghĩa với thẻ <img>, trong đó thuộc tính src định nghĩa đường dẫn tập tin hình ảnh, thuộc tính alt định nghĩa văn bản hiển thị nếu hình ảnh bị lỗi và hai thuộc tính width, height là chiều rộng và chiều cao của hình ảnh.

Liên quan:  [HTML/HTML5] Phần 22: Đường dẫn tập tin

<!DOCTYPE html>
<html>
<body>
<img src="https://www.dammio.com/wp-content/uploads/2016/11/no-image-870x600.png" alt="dammio.com" width="200" height="150">
</body>
</html>

Mời các bạn theo dõi các bài tiếp theo về bắt đầu học về HTML.

Trích dẫn bài viết
  • APA:
    Dammio. (2017). [HTML/HTML5] Phần 3: Các ví dụ cơ bản HTML. https://www.dammio.com/2017/06/08/htmlhtml5-phan-3-cac-vi-du-co-ban-html.
  • BibTeX:
    @misc{dammio,
    author = {Dammio},
    title = {[HTML/HTML5] Phần 3: Các ví dụ cơ bản HTML},
    year = {2017},
    url = {https://www.dammio.com/2017/06/08/htmlhtml5-phan-3-cac-vi-du-co-ban-html},
    urldate = {2024-11-06}
    }
Theo dõi
Thông báo của
guest
1 Bình luận
Cũ nhất
Mới nhất Được bỏ phiếu nhiều nhất
Phản hồi nội tuyến
Xem tất cả bình luận
1
0
Rất thích suy nghĩ của bạn, hãy bình luận.x