13-12-2016
Hướng dẫn cơ bản các thẻ html cho bạn mới tập tạo lập wapsite, hoặc đã làm được mà không nhớ nổi các thẻ này thì vào top này sẽ nhớ thôi :v
Cấu trúc cơ bản
Một document HTML luôn bắt đầu bằng <html> và kết thúc bằng </html> (trong đó bạn cũng có thể viết nhỏ hoặc viết hoa <html> và </html>). Nhờ có cặp TAG này mà Browser biắt được đó là HTML – document để trình duyệt. Những chữ đó chỉ để dành riêng cho Browser, người đọc chỉ nhận được những gì viết giữa cặp TAG <body> và </body>. Trong một document html, chú thích được dùng như sau:
<!-- Ðây là dòng chú thích, chỉ dành riêng cho bạn, browser bỏ qua dòng này -->
- Như vậy một trang web viết bằng html sẽ có cấu trúc như sau:
Trong “head” ta còn có thể đưa rất nhiều thông tin vào cho browser, search engine… Cái đó sẽ được đề cập đến trong một mục riêng.
Các thẻ cơ bản trong HTML:
- Một tài liệu HTML được tạo nên từ các cặp thẻ html
Thẻ HTML được bắt đầu bằng dấu < (dấu nhỏ hơn) và kết thúc bằng dấu > (dấu lớn hơn)
Nội dung nằm giữa dấu <> là tên thẻ. Ví dụ <b>, ta đọc là thẻ b
Cặp thẻ HTML được tạo nên từ thẻ mở và thẻ đóng
Các tag đầu tiên trong một cặp là thẻ bắt đầu, các thẻ thứ hai là thẻ kết thúc
Thẻ Bắt đầu và thẻ kết thúc còn được gọi là thẻ mở và thẻ đóng
Thẻ đóng kết thúc bằng dấu / (</tenthe>)
Nội dung của thẻ sẽ được nằm giữa thẻ đóng và thẻ mở
Một số thẻ chỉ có thẻ mở mà không có thẻ đóng (như các thẻ <img>, <br />, <hr />)
Ví dụ: Về cặp thẻ: <b>Nội dung thẻ</b>
Các thẻ thường sử dụng trong HTML
Các thẻ tiêu đề (HTML Headings):
Bao gồm các thẻ từ <h1> đến <h6>: thường được sử dụng để thể hiện cho tiêu đề bài viết, bản tin, các mục nhấn mạnh . . .
Font chữ (size) của nội dung trong các thẻ giảm từ <h1> đến <h6> (h1 lớn nhất, h6 nhỏ nhất).
<h1>Nội dung thẻ h1</h1>
<h2>Nội dung thẻ h2</h2>
<h3>Nội dung thẻ h3</h3>
<h4>Nội dung thẻ h4</h4>
<h5>Nội dung thẻ h5</h5>
<h6>Nội dung thẻ h6</h6>
Đoạn văn bản trong HTML (HTML Paragraphs):
Đoạn văn bản trong tài liệu HTML được định nghĩa bằng thẻ <p>
<p>Nội dung đoạn văn bản thứ nhất.</p>
<p>Đoạn văn bản thứ hai.</p>
Liên kết (HTML Links):
Một trang website bao gồm rất nhiều trang web (web page), các web page liên kết lại với nhau để tạo lên website.
Liên kết trong HTML được định nghĩa bằng cặp thẻ <a>
<a href="http://vina4z.xyz" target="_blank"> Diễn đàn wapmaster</a>
href: quy định địa chỉ (url) mà liên kết trỏ tới
target: (đích) thuộc tính này sẽ quy định liên kết sẽ được mở ra ở đâu: _self (trang hiện tại), _blank (cửa sổ mới), . .
HTML Line Breaks
:
Sử dụng <br /> để xuống dòng trong một đoạn văn bản
1
<p>Xuống dòng<br />trong<br />đoạn văn bản</p>
Tuy nhiên chúng ta không nên sử dụng thẻ <br /> trong tài liệu HTML (khuyến cáo)
HTML Lines (<hr />):
Thẻ <hr /> sẽ tạo một đường kẻ ngang trong trang HTML. <hr /> là thẻ đơn không có thẻ đóng
1 <hr/>
HTML images (Hình ảnh):
Để chèn hình ảnh vào tài liệu HTML ta sử dụng thẻ <img>, đây là thẻ HTML không có thẻ đóng
<img src="images.jpg" width="200px" height="100px" />
src=”images.jpg”: Chỉ ra đường dẫn tập tin hình ảnh (có thể là đường dẫn tuyệt đối hoặc tương đối, vấn đề này mình sẽ giải thích ở một topic khác)
alt=”Mô tả ”: Nội dung sẽ được hiển thị khi đường dẫn tới tập tin hình ảnh không tồn tại
title=”Tiêu đề”: Nội dung hiển thị khi đưa trỏ chuột lên hình.
width, height: Độ rộng và độ cao của file hình được tính bằng px, nếu không có thuộc tính width, height thì mặc định sẽ lấy kích thước gốc của file hình
Các thẻ định dạng text (HTML Text Formatting):
<b> chữ in đậm</b>
<u Chữ gạch chân</u>
<big> Chữ lớn hơn</big>
<sub>Chữ thục xuống</sub>
<sup>Chữ cao lên</sup>
<em> Chữ nghiên, hơn cả i</em>
Kết luận: Bài viết này là những kiến thức cơ bản về HTML và cấu tạo cũng như các thẻ hổ trợ trong HTML. Hy vọng bài viết này sẽ là tài liệu bổ ích cho những bạn mới đầu làm quen với thiết kế website. Ở những bài viết sau chúng ta sẽ cũng tìm hiểu các vấn để khác nhằm để xây dựng một giao diện website hoàn chỉnh.