Một số tag HTML thường sử dụng

<span> </span>: Dùng để xác định 1 dòng text, có thể kết hợp với id và class để tạo style cho dòng text (Xem thêm về CSS)

<p> </p>: Dùng để xác định 1 đoạn văn bản

Điểm khác biệt giữa <span> và <p> :

image Ở đây ta cùng qui định thuộc tính background màu đỏ cho tag <span> (trên) và tag <p> (dưới).

Như ta thấy tag <span> có ảnh hưởng đến từng dòng text, trong khi tag <p> ảnh hưởng đến toàn bộ paragraph.

Nếu bạn có điều kiện tìm hiểu hơn, bạn sẽ biết rằng tag <span> có thuộc tính là display:inline, còn tag <p> có thuộc tính là display:block

Ứng dụng: tag <span> thường được ứng dụng để áp thuộc tính cho 1 đoạn văn bản ngắn.

<div> </div>: Thường được dùng để thiết kế, giàn trang trong những web site ngày nay, gần giống tag <p> và <span>, nhưng có thể chứa được nhiều thành phần hơn, và có nhiều thuộc tính hơn.

<span>, <p>, <div> : điều thú vị của chúng ta là ở 3 tag này, tag <p> được ra đời đầu tiên ^^, sau đó khi HTML 4.0 ra đời, tag <span> và tag <div> được giới thiệu, với 2 thuộc tính <span> display:inline và <div> display:block. Chính tag <span> và tag <div> đã góp phần không nhỏ trong công nghệ web ngày nay, có thể nói 2 tag này đã tạo lên 1 cuộc “cách mạng” mới trong công nghệ thiết kế web, WEB 2.0. Nếu view source của các trang web lớn, ta sẽ thấy các tag này được ứng dụng rất nhiều :D .

<h1> đến <h6>: Dùng để định header cho các đoạn văn bản mà không cần phải chình font-size.

<ul> </ul>: Bắt đầu 1 danh sách không đánh số thứ tự.

<ol> </ol>: Bắt đầu 1 danh sách có đánh số thứ tự.

<li> </li>:  Liệt kê các items trong 1 danh sách.

VD:

   1: <ul>
   2: <li>Danh mục 1</li>
   3: <li>Danh mục 2</li>
   4: <li>Danh mục 3</li>
   5: <li>Danh mục 4</li>
   6: </ul>
   7: <ol>
   8: <li>Danh mục 1</li>
   9: <li>Danh mục 2</li>
  10: <li>Danh mục 3</li>
  11: <li>Danh mục 4</li>
  12: </ol>

Ta sẽ có kết quả:

image

Ngoài chức năng trên, ta còn có thể ứng dụng tag <ul> và <li> để tạo menu ^^, nhưng ở bài khác JaL sẽ hướng dẫn các bạn sau

<img>: Chèn hình ảnh ^^.

VD:

   1: <img src="http://hieu.info/phong/sign.jpg" />

Các bạn lưu ý, phía sau của tag img, ngay trước dấu > ta phải có 1 dấu /, đây là qui tắc của XHTML.

<a> </a>: Chèn 1 đường link đến trang khác

VD:

   1: <a href="http://j3ltl24cy.wordpress.com/"> Link đến trang của JaL </a>

Sẽ có kết quả : Link đến trang của JaL

Bài thực hành sẽ có sớm, mong các bạn đón đọc.

Có mộ phản hồi tới “Một số tag HTML thường sử dụng”

  1. vietjc nói:

    Các bạn có thể thảo luận về form trong html không . Mình đang muốn viết một form submit và cần giúp đỡ!


Để lại hồi âm