Bài 03: Các thuộc tính trong thẻ HTML

1. Thuộc tính trong HTML

• Các phần tử HTML có thể có các thuộc tính.
• Các thuộc tính cung cấp thêm các thông tin cho một phần tử HTML
• Các thuộc tính luôn luôn được chỉ định trong thẻ bắt đầu.
• Các thuộc tính đi với nhau thành từng cặp là tên/giá trị, ví dụ: name="value"

Cú pháp: property="value"

Trong đó:

• property: Tên thuộc tính
• value: Giá trị thuộc tính

Chú ý: Luôn luôn đặt giá trị của thuộc tính vào dấu ngoặc kép.

Giá trị thuộc tính phải luôn luôn được kèm theo trong dấu ngoặc kép. Thường đặt giá trị thuộc tính giữa hai dấu ngoặc kép " ", nhưng nếu đặt môt dấu ngoặc kép ' cũng được chấp nhận.

Ví dụ:

Đây là một liên kết

Xem kết quả

Lưu ý: Ngoài các thuộc tính được quy định sẵn trong chuỗi thuộc tính của mỗi một thẻ HTML thì bạn có thể khai báo các thuộc tùy chỉnh.

2. Các thuộc tính cơ bản của HTML.

Dưới đây mình sẽ liệt kê cho các bạn một số thuộc tính cơ bản hay được dùng nhất trong HTML.

2.1 Thuộc tính class.

Thuộc tính class chỉ định một hoặc nhiều tên lớp cho một phần tử (tham chiếu tới một class trong css). Trong một phần tử có thể có nhiều class cách nhau bằng một khoẳng trắng.

Ví dụ:

<div class="container">
	<div class="row">
    	<div class="col-xs-12 col-md-12 col-sm-12">
        </div>
    </div>
</div>

2.2. Thuộc tính title

Thuộc tính title sẽ chỉ định thông tin thêm về một phần tử. Thuộc tính title chỉ được hiển thị khi ta di chuột vào phần tử đó

Ví dụ:

<p title="Đây là thuộc tính title">Di chuột vào đây</p>

Xem kết quả

2.3 Thuộc tính href.

Thuộc tính href dành cho thẻ liên kết a. Địa chỉ của liên kết được quy định bằng thuộc tính href. Khi người dùng click vào thẻ liên kết này thì trình duyệt sẽ đưa người dùng vào địa chỉ web page được đặt trong thuộc tính href.

<a href="http://www.chiasephp.net" title="Trang chủ">Click vào đây để di chuyển tới HomePage</a>

Xem kết quả

2.4 Thuộc tính về kích thước

Hình ảnh được hiển thì thông qua thẻ IMG. Kích cỡ của ảnh này được quy xác định bởi hai thuộc tính là awidth và height.

• awidth: Quy định chiều dộng của hình ảnh.
• height: Quy định chiều cao của hình ảnh.

Ví dụ:

<img src="/isocms/skin/images/chiasephp_logo_tryit.png" awidth="174" height="40" />

Xem kết quả

2.5 Thuộc tính alt.

Thuộc tính alt quy định đoạn văn bản thay thế khi một thành phần HTML vì một lý do nào đó không thể hiển thị.

Ví dụ: Khi hình ảnh không được hiển thị thì nó sẽ được thay thế bởi chữ "Chia sẻ PHP".

<img src="" alt="Chia sẻ PHP" awidth="174" height="40" />

Xem kết quả

2.6 Ngoài ra còn có một số thuộc tính khác.

3. Tổng kết.

Qua bài viết này mình đã hướng dẫn bạn một số thuộc tính cơ bản trong HTML. Hy vọng bài viết này hữu ích cho những bạn mới muốn học để tự lập trình cho mình một website của riêng mình.