Tài liệu Cơ bản html p2 pdf

Basic html
Cơ bản html
Thẻ html – html tags

Tag(thẻ) là thành phần chứa thông tin mà nhờ đó, trình duyệt biết được trang web sẻ như thế
nào!

Trình duyệt đọc trang web từ trên xuống dưới, từ trái qua phải, cứ thế từng chữ từng chữ như ta
đọc bài, đa phần ta trình bày cái gì trước thì nó sẽ hiện ra trước, trình bày cái gì sau thì nó sẻ
hiện ra sau! Đoạc tới đâu, trình duyệt phân tích tới đó, bằng những thẻ nhất định, trình duyệt sẽ
biết:" à cái này là...", điều tiếp theo chúng ta phải học là các thẻ đó!

quay lại bài HMTL Elements tý:

Một phần tử cơ bản bao gồm tag(thẻ) mở, nội dung tag, và tag đóng.

1. <p> - opening paragraph tag
2. Element Content - paragraph words (thẻ <p> có sẻ đáng dấu đây là đoạn(paragraph))
3. </p> - closing tag

thẻ <p> ở đây có ý báo cho trình duyệt biết:"đây là đoạn văn bản thưa anh trình duyệt". Có rất
nhiều tag được viết ra với công dụng tương tự, ví dụ như <b> có nghĩa là in đậm, <i> có nghĩa
là in nghiêng.....

Chú ý: Như đả nói với các bạn, html là một ngôn ngữ khá lỏng lẻo, nó lỏng lẻo qua ví dụ này:
Để in ra màn hình một dòng chử vừa in đậm vừa in nghiêng như thế này, mình có thể viết:
Code: [Select]
<b><I>vừa in đậm vừa in nghiêng.</B></i>

Điều nay không có gì là sai trong html, nhưng cũng như mình đả nói, html đả không còn được
phát triễn nữa, nó cổ quá rồi, người ta đăng nhiên cứu để đưa ra những ngôn ngữ khác, mạnh mẽ

hơn, và thực tế là đả có: XML, và một dạng đang được phát triễn giữa cả hai ngôn ngữ, gọi là
XHTML, cho tới giờ, cái XHTML này vẫn chưa có gì đặc biệt hơn HTML ngoại trừ việc cứng
rắn trong nguyên tác viết:
Để in ra màn hình một dòng chử vừa in đậm vừa in nghiêng như thế này trong XHTML, mình
phải viết viết:
Code: [Select]
<b><i>vừa in đậm vừa in nghiêng.</i></b>
Nhìn kĩ các bạn sẽ thấy một vài điểm khác biệt:
 Thẻ <b> mở trước thẻ <i> và nội dung thì phải đóng sau thẻ đóng </i> , bao lấy tất cả
 Thẻ mở là ta viết chữ thưởng, thì đóng củng phải vậy, không có chuyện chữ In chữ
thường trong hai thẻ, để phù hợp vớ mọi quy tắc, từ nay ta thống hất chỉ dùng chữ thường
cho mọi thẻ.
Basic html

Tuy ngoài rắc rối ra, XHTML chưa có gì là hữu dụng, nhưng hãy cứ châp nhận nó từ từ, biết
đâu trong tương lai gần..................


Những thẻ không có thẻ đóng

từ trước tới giờ mình chỉ nói về thẻ có 3 phần, nhưng có một số thẻ không có đủ ba phần đó! Ví
như một số thẻ không có chứa nội dung, như là thẻ ngắt dòng <br>, thẻ chứa hình ảnh, thẻ input:
Code: [Select]
Đây là thẻ image,<br> src là thuộc tính(sẻ nói đến sau), link trong dấu ngoặc
kép là link tới ảnh<br><img
src=" >Image Tag<br> Còn đây là
thẻ xuống dòng, các bạn hãy để ý là đoạn này mình viết không hề xuống
dòng<br><input type="text" size="12" >lát nữa cái này bạn sẽ hiểu!

Kết quả hiện ra màn hình sẽ là:

Đây là thẻ image,
src là thuộc tính(sẻ nói đến sau), link trong dấu ngoặc kép là link tới ảnh
Image Tag
Còn đây là thẻ xuống dòng, các bạn hãy để ý là đoạn này mình viết không hề xuống dòng
Thẻ input nè lát nữa cái này bạn sẽ hiểu!
Chú ý: lại nột số quy tắc XHMTL với các thẻ không có thẻ đóng như <br> thì ta phải viết <br/>,
viết như thế nào thì trình duyệt đều hiểu được, thỉnh thoảng khi làm biếng, mình vẫn bỏ qua quy
tác này, nhưng mà nói chung là ta nên tuân thủ các quy tắc quấc tế!


HTML - Attributes - Thuộc tính
Trong bài html - tags, mình đả có đề cập qua thẻ img và src là một rong những thuộc tính của
nó. thuộc tính dùng dể....à....ờ...à khó nói quá, nói chung là thuộc tính sẻ bổ sung thêm thông tin
cho thẻ, xem ví dụ cho dễ hiểu
Code: [Select]
<p align="center">
Như đã dùng trong các ví dụ trước, thẻ p định dạng nội dung chứa bên trong là
đoạn văn bản, và đoạn văn abn3 sẽ chứa những thuộc tính gì: canh lề trái,
canh lề phải, canh giữa......
Ví dụ này mình đả canh giữa có đoạn văn bản này, đừng lo nếu bạn cưa biết hết
các thuộc tính và giá trị của chúng, ta sẻ đề cập tới ngay thôi!
</p>

kết quả:
Như đã dùng trong các ví dụ trước, thẻ p định dạng nội dung chứa bên trong là đoạn văn bản, và
đoạn văn abn3 sẽ chứa những thuộc tính gì: canh lề trái, canh lề phải, canh giữa......
Basic html
Ví dụ này mình đả canh giữa có đoạn văn bản này, đừng lo nếu bạn cưa biết hết các thuộc tính và
giá trị của chúng, ta sẻ đề cập tới ngay thôi!

Chú ý: một thẻ có thể cùng lúc chứa nhiều hoặc không chứ thuộc tính nào, đó là tuỳ ở bạn!

Một số thuộc tính cơ bản và ví dụ
tước hết, mình liệt kê ra luôn, rồi xem ví dụ sau!
Basic html

Chú ý: thuộc tính name hơi khác biệt với thuộc tính id và class, sau này nếu có học qua PHP hay
ASP hay một ngôn ngữ lập trình web nào đó, bạn sẽ thấy rỏ điều đó!

Theo các quy tắc XHTML, để đặt giá trị cho các thuộc tính:
Basic html

thuộc tính+=+"+giá trị+"

Cặp dấu ngoặc là bắt buộc