Cơ bản HTML
Mục lục:
Phần 1: Trang trí chữ
Phần 2: Định dạng văn bản
Phần 3: Links
Phần 4: Hình ảnh
Phần 5: Viền
Phần 6: Scroll box
Phần 2: Định dạng văn bản
Phần 3: Links
Phần 4: Hình ảnh
Phần 5: Viền
Phần 6: Scroll box
Phần 1: Trang trí chữ
In đậm = <b>In đậm</b>
Nghiêng = <i>Nghiêng</i>
Gạch dưới = <u>Gạch dưới</u>
Gạch ngang chữ = <s>Gạch ngang chữ</s>
Chữ Sub Script = Chữ <sub>Sub Script</sub>
Chữ Super Script = Chữ <sup>Sub Script</sup>
Để kết hợp 2 kiểu trang trí, bạn nhập như sau:
Ví dụ: In đậm + gạch dưới = <b><u>Text</u></b>
Có nhiều kiểu các bạn cứ thử rồi sẽ thấy kết quả nhé!!
-----------------------------------------
Ví dụ: <font size="7">Text</font>
Có 7 kích thước để bạn lựa chọn: 1 2 3 4 5 6 7
-----------------------------------------
<font face="tên font">Text</font>
In đậm = <b>In đậm</b>
Nghiêng = <i>Nghiêng</i>
Gạch dưới = <u>Gạch dưới</u>
Gạch ngang chữ = <s>Gạch ngang chữ</s>
Chữ Sub Script = Chữ <sub>Sub Script</sub>
Chữ Super Script = Chữ <sup>Sub Script</sup>
Để kết hợp 2 kiểu trang trí, bạn nhập như sau:
Ví dụ: In đậm + gạch dưới = <b><u>Text</u></b>
Có nhiều kiểu các bạn cứ thử rồi sẽ thấy kết quả nhé!!
-----------------------------------------
Thay đổi màu chữ:
<font color="#mã màu">Text</font>
hoặc <font color="tên màu">Text</font>
Ví dụ: <font color="red">Text</font>
Mã màu bạn có thể lấy bằng cách sử dụng Photoshop.
-----------------------------------------
<font size="kích thước bạn muốn">Text</font><font color="#mã màu">Text</font>
hoặc <font color="tên màu">Text</font>
Ví dụ: <font color="red">Text</font>
Mã màu bạn có thể lấy bằng cách sử dụng Photoshop.
-----------------------------------------
Ví dụ: <font size="7">Text</font>
Có 7 kích thước để bạn lựa chọn: 1 2 3 4 5 6 7
-----------------------------------------
<font face="tên font">Text</font>
Một vài font phổ biến: Arial, Arial black, Book Antiqua, Century Gothic, Courier new, Garamound, Georgia, Impact, Lucida Console, Monotype Corsiva, Small Fonts, Tahoma, Times New Roman, Trebuchet Ms, Verdana
Ví dụ: <font face="Impact">Text</font>
-----------------------------------------
Làm nền cho chữ:
<font style="background-color: #mã màu">Text</font>
Ví dụ: <font style="background-color: #c4c4c4">Text</font>
Để làm cho nền chữ linh hoạt hơn khi xuống dòng, bạn thêm "display:block" vào mã.
Ví dụ: <font style="background-color: #c4c4c4; display:block">Text</font>
----------------------------------------------------------------------------------------------------
Phần 2: Định dạng văn bản
<marquee> <img src="Link hình ảnh"> </marquee>
+ Google
+ Facebook
+ Twiter
+ Yahoo!!
<ul><li>+ Google
<li>+ Facebook
<li>+ Twiter
<li>+ Yahoo!!
</ul>
----------------------------------------------------------------------------------------------------
Phần 3: LinksTạo 1 đường link: <a href=" URL link của bạn"> Văn bản </a>
Để mở link ở trang khác: <a href=" URL link của bạn " target="_blank">Văn bản </a>
Tạo 1 đường link "email me":
<a href="mailto:Emailyour@mail.com">E-mail Me</a>
----------------------------------------------------------------------------------------------------
Phần 4: Hình ảnh
Trước tiên bạn phải up hình bạn muốn share trên blog ở 1 host nào đó (như xuanliemblog ) và lấy link.
Show hình: <img src="link hình">
Để hình thành đường dẫn: <a href="đường link"><img src="link hình" border=0></a>
Chữ bao bọc hình:
<img src="link hình" align="left"> = hình nằm bên trái chữ
<img src="link hình" align="right"> = chữ nằm bên trái hình
----------------------------------------------------------------------------------------------------
Phần 5: Viền
Để tạo viền xung quanh 1 ảnh, bạn làm như sau:
<img style="border-style: solid; border-width: 1px; border-color: #000000" src="URL hình ảnh">
- Chỗ màu đỏ, bạn có thể thay bằng: solid , dotted , dashed , double, groove. Đây là kiểu dáng của đường viền của bạn.
- Chỗ màu cam, bạn có thể thay bằng: 2px, 3px, v.v... Đây chính là độ dày hay mỏng của đường viền.
- Chỗ màu xanh, bạn có thể thay bằng mã màu bạn thích. Lấy mã màu tại đây.
----------------------------------------------------------------------------------------------------
Phần 6: Scroll box
Scroll box tức là tạo ra 1 cái hộp có thanh kéo lên kéo xuống ý! Scroll box giúp site của bạn vừa đẹp vừa gọn lại vừa pro.
<div style="
height: 200px; *chiều cao*
width: 100px; *chiều rộng*
overflow: auto; *cho phép kéo trượt*
border-color: #mã màu;
borderã màu;
scrollbar-face-color: #mã màu;
scrollbar-highlight-color: #mã màu;
scrollbar-darkshadow-color: #mã màu;
scrollbar-3dlight-color:#mã màu;
scrollbar-shadow-color: #mã màu;">
scrollbar-face-color: #mã màu;
scrollbar-highlight-color: #mã màu;
scrollbar-darkshadow-color: #mã màu;
scrollbar-3dlight-color:#mã màu;
scrollbar-shadow-color: #mã màu;">
Nội dung của bạn ở đây nhé. </div>
Nếu bạn dùng Firefox thì các phần scrollbar-x-y không cần thiết, cứ để mặc định.
Đây là minh họa cho scroll box.
Đây là minh họa cho scroll box.
Code = <div style="width: 200px; height: 100px; overflow: auto; border-color: #000000; border-style: solid; border-width: 1px;">Nội dung của bạn </div>
Chúc các bạn vui vẻ =)))
0 nhận xét: