Code Tu Tam

Các tag html cơ bản cần biết.

Rate this post

Headings (Tiêu đề).

Phần tử này được sử dụng để trình bày tiêu đề cho phần nội dung hiển thị trên trang web.

Những phần tiêu đề được hiển thị to và in đậm hơn để phân biệt chúng với các phần còn lại của văn bản. Chúng ta cũng có thể hiển thị phần tiêu đề theo một trong sáu kích thước từ h1 đến h6. Tất cả những gì chúng ta làm là định rõ kích thước h1, h2… Thẻ H1 dành cho các tiêu đề quan trọng nhất và giảm dần đến h6

<h1>This is a heading</h1>

<h2>This is a heading</h2>

<h3>This is a heading</h3>

<h4>This is a heading</h4>

<h5>This is a heading</h5>

<h6>This is a heading</h6>

Thẻ <p> Paragraphs

Phần tử HTML <p> xác định một đoạn văn.

Một đoạn văn luôn bắt đầu trên một dòng mới và các trình duyệt sẽ tự động thêm một số khoảng trắng (lề) trước và sau một đoạn văn.

<p> This is a paragraph </p>

<p>This is a heading</p>

 

Thẻ khối <span>, <div>

Có những trường hợp chúng ta muốn chia văn bản trong một trang web thành những khối thông tin logic khi đó phần tử div và span được sử dụng để nhóm nội dung lại với nhau. Thẻ div rất thường được sử dụng trong thiết kế website.

Code ví dụ.

Các phần tử định dạng văn bản.

<b> – phần tử xác định văn bản in đậm.

<strong> – phần tử xác định văn bản có tầm quan trọng mạnh mẽ. làn in đậm chữ.

<i> – Nội dung bên trong thường được hiển thị bằng chữ nghiêng.

<em> – Nội dung bên trong thường được hiển thị bằng chữ nghiêng.

<small> – Làm cho chữ nhỏ hơn.

<del> – phần tử xác định văn bản đã bị xóa khỏi tài liệu. Các trình duyệt thường sẽ gạch một dòng qua văn bản.

<ins> – phần tử xác định một văn bản đã được chèn vào tài liệu. Các trình duyệt thường sẽ gạch chân được chèn.

<sub> – phần tử xác định văn bản chỉ số. Văn bản chỉ số xuất hiện nửa ký tự bên dưới dòng bình thường và đôi khi được hiển thị bằng phông chữ nhỏ hơn.

Ví dụ:

<sup> – phần tử xác định văn bản chỉ số trên. Văn bản siêu chỉ số xuất hiện nửa ký tự trên dòng bình thường và đôi khi được hiển thị bằng phông chữ nhỏ hơn.

Định dạng danh sách

Danh sách không thứ tự

Đây là loại danh sách đơn giản nhất mà bạn có thể thêm vào tài liệu HTML. Danh sách không thứ tự là một “bulleted list”. Các mục được bắt đầu bằng dấu chấm tròn “bullet”. Danh sách không thứ tự được nằm trong cặp thẻ <ul>…</ul>. Mỗi mục trong danh sách được đánh dấu bằng thẻ <li>. li được viết tắt của từ list Item. Thẻ kết thúc </li> là tùy chọn (không bắt buộc).

Danh sách có thứ tự

Danh sách có thứ tự nằm trong cặp thẻ <ol>…</ol>. Danh sách có thứ tự cũng hiển thị các mục danh sách. Sự khác nhau là các mục danh sách hiển thị theo thứ tự được tạo ra một cách tự động.

Danh sách định nghĩa.

Danh sách định nghĩa được dùng để tạo ra một danh sách các điều khoản và các định nghĩa của chúng. Danh sách định nghĩa nằm trong cặp thẻ <dl>…</dl>. Thẻ <dt> được dùng để chỉ ra điều khoản còn thẻ <dd> được dùng để chỉ ra định nghĩa cho điều khoản đó.

Sử dụng màu sắc

Chúng ta có thể thêm màu vào trang và vào các phần tử trong trang. COLOR là thuộc tính có thể được sử dụng với nhiều phần tử như phần tử FONT và BODY.

Có 3 kiểu màu chính: đỏ, xanh và xanh da trời. Mỗi màu chính được xem như một bộ hai số của hệ 16.

#RRGGBB

Số thập lục phân 00 chỉ 0% của màu trong khi đó số thập lục phân FF chỉ 100% của màu. Giá trị cuối cùng là một mã sáu chữ số chỉ màu.

Mã thập lục phân Màu
#FF0000 Red
#00FF00 Green
#0000FF Blue
#000000 Black
#FFFFFF White

Sử dụng hình ảnh trong tài liệu HTML

Thẻ IMG dùng để chèn những ảnh vào trong tài liệu HTML. Chúng ta cũng có thể đặt thẻ IMG tại vị trí mà ảnh được hiển thị. Thẻ IMG không có nội dung, nó hiển thị nội dung bằng cách xác định thuộc tính SRC.

Cú pháp là:

<IMG SRC=”logo-codetutam.png”>

Trong đó SRC (source) là thuộc tính và giá trị là một URL, chỉ vị trí chính xác của file ảnh.

Đôi khi, chỉ hình ảnh không thể nói lên tất cả. Chúng ta cần phải cung cấp cho người dùng một vài giới thiệu về mục đích của hình ảnh.

Bài viết liên quan:

Giới thiệu chung về HTML.

Hi vọng với bài viết này, Các bạn có hiểu hơn về HTML. Nếu bạn thấy bài viết hay và có ý nghĩa hãy like và chia sẻ bài viết này để mọi người cùng nhau học tập nhé. Cảm ơn các bạn đã ghé thăm codetutam.com

Exit mobile version