Các ví dụ cơ bản về HTML

Trong bài HTML trước các bạn đã biết được nên dùng công cụ nào để viết code HTML, cách lưu và mở file HTML.

Bài viết này sẽ đưa ra một số ví dụ cơ bản về văn bản HTML. Đừng lo lắng nếu bạn thấy các thẻ đánh dấu chưa được học. Bạn sẽ sớm biết về chúng trong các bài học tới.

Văn bản HTML

  • Tất cả các văn bản HTML đều phải bắt đầu bằng <!DOCTYPE html>
  • Còn nguyên nội dung văn bản HTML thì bắt đầu bằng <html> và kết thúc là </html>
  • Phần văn bản HTML sẽ hiển thị là phần nằm trong 2 thẻ <body></body>

Ví dụ

<!DOCTYPE html>
<html>
<body>

<h1>Học lập trình HTML</h1>
<p>HTML là ngôn ngữ đánh dấu siêu văn bản.</p>

</body>
</html>

Tiêu đề HTML

Tiêu đề của văn bản HTML được xác định bằng các thẻ đánh dấu <h1></h1>

<h1> cho biết đó là tiêu đề quan trọng nhất, còn <h6> cho biết đó là tiêu đề ít quan trọng nhất.

Ví dụ

<h1>Học HTML trên Quantrimang.com</h1>
<h2>Bài hướng dẫn học HTML</h2>
<h3>Học HTML không khó</h3>

Các đoạn văn bản trong HTML

Đoạn văn được xác định bằng thẻ đánh dấu <p> và kết thúc bằng </p>

Ví dụ

<p>Học viết trang web bằng HTML</p>
<p>Đây là ví dụ về đoạn văn trong HTML</p>

Đường dẫn trong HTML

Các đường dẫn được xác định bằng thẻ <a></a>

Ví dụ

<a href="https:quantrimang.com">Trang Quản trị mạng</a>
  • Đích đến của đường dẫn này được chỉ định trong thuộc tính href.
  • Thuộc tính được dùng để cung cấp thêm thông tin cho phần tử trong HTML.
  • Bạn sẽ học về các thuộc tính và phần tử của HTML ở bài học sau.

Hình ảnh trong HTML

Hình ảnh được xác định bằng thẻ <img>

Tập tin nguồn (src), văn bản thay thế (alt), widthheight là các thuộc tính của hình ảnh.

Ví dụ

<img src-"quantrimang.jpg" alt="quantrimang.com" width="540" height="200">

Nút bấm trong HTML

Nút bấm được xác định bằng thẻ <button>

Ví dụ

<button>Click vào đây</button>

Danh sách trong HTML

Danh sách được xác định bằng thẻ <ul> (danh sách có dấu đầu dòng/không theo thứ tự) hoặc <ol> (danh sách có số đầu dòng/theo thú tự), theo sau đó là thẻ <li> (liệt kê từng mục)

Ví dụ

<ul>

<li>Giới thiệu về HTML</li>
<li>Công cụ soạn thảo HTML</li>
<li> Các ví dụ cơ bản về HTML</li>

</ul>

Bài trước: Công cụ soạn thảo HTML

Bài sau: Các phần tử trong HTML

Thứ Sáu, 10/05/2019 12:36
31 👨 609