%
Xe đạp thể thao Road Vivente 700C-LINE 27.5 inch [ Màu cam ]
Xe Đạp
Thể Thao
%
XE ĐẠP THỂ THAO KHUNG NHÔM VÀNH 26 INCH
Xe Đạp
Thể Thao
%
Sạc dự phòng mini YM300S 20000mAh kèm dây cáp, 4 cổng kết nối tiện dụng
Pin Sạc
Dự Phòng
%
Sạc dự phòng 20000mAh sạc nhanh 18W QC3.0/PD mã ONC Flash Titan hiển thị LCD
Pin Sạc
Dự Phòng

Phụ lục code html - CSS cơ bản Phần 1

1. Đánh dấu (Bookmark) đến một vị trí nhanh trong bài viết :

<a href="LINK_bài_viết#Tên_gán_cho_vị_trí ">Nội_dung</a><br/>
<a name="Tên_gán_cho_vị_trí ">Nội_dung</a>


2. Code Font chữ :

<font size="4" face="Courier New" color="green">Đây là chữ có font là Courier New, kích thước= 4, màu xanh lá.</font> 3. Code làm đẹp Text :
In đậm, in nghiệng gạch dưới :
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>
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
Kích thước chữ :
<font size="kích thước bạn muốn">Text</font>
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
Thay đổi font chữ :

<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>


3. Tạo Nền 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>

4. Định dạnh văn bản :

Để hình ảnh hoặc dòng chữ của bạn bắt đầu ở 1 dòng mới, dùng lệnh <br>
Căn giữa: <center> Văn bản </center>
Căn lề phải: <p align="right"> Văn bản </p>
Căn lề trái: <p align="left"> Văn bản </p>
Chữ chạy chạy: <marquee> Văn bản </marquee>
<marquee> <img src="Link hình ảnh"> </marquee>
Tạo một danh sách, ví dụ:
+ Google
+ Facebook
+ Twiter
+ Yahoo!!
<ul><li>+ Google
<li>+ Facebook
<li>+ Twiter
<li>+ Yahoo!!
</ul>

5. Link : 

Tạ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>

6. 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

7. Khung 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.

8. 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;">
Nội dung của bạn ở đây nhé. </div>


Ví dụ :


<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>
Sạc dự phòng tích hợp màn hình Led Dung Lượng 10000MAH

Xem sản phẩm,...

Đăng nhận xét

Mới hơn Cũ hơn
Shop Mua Sắm Online Công Nghệ 4.0