Sử dụng màu sắc trong thiết kế

Một phần của tài liệu Giáo trình thiết kế website (Trang 52 - 57)

• Một màu ñược tổng hợp từ ba thành phần màu chính là: ðỏ (Red), Xanh lá cây (Green), Xanh nước biển (Blue), viết tắt là RGB

• Trong HTML một giá trị màu là một số nguyên dạng hexa (hệ ñếm cơ số 16) có ñịnh dạng như sau: #RRGGBB

• Màu sắc có thể ñược xác ñịnh qua thuộc tính bgcolor= hay color=, sau dấu bằng có thể là giá trị RGB hay tên tiếng Anh của màu. Với tên tiếng Anh, ta chỉ có thể chỉ ra 16 màu trong khi với giá trị RGB ta có thể chỉ tới 256 màu.

• Một số giá trị màu cơ bản:

Màu sắc Giá trị Tên tiếng anh

ðỏ #FF0000 RED

ðỏ sẫm #8B0000 DARKRED RED

Xanh lá cây #00FF00 GREEN

Xanh nhạt #90EE90 LIGHTGREEN

Xanh nước biển #0000FF BLUE

Vàng #FFFF00 YELLOW

Vàng nhạt #FFFFE0 LIGHTYELLOW

Da cam #FFA500 ORANGE

Nâu #A52A2A BROWN

Màu xanh hải quân #000080 NAVY

ðen #000000 BLACK

Xám #808080 GRAY

Tím #FF00FF MAGENTA

Tím nhạt #EE82EE VIOLET

Hồng #FFC0CB PINK

Màu xanh hải quân #4169E1 ROYALBLUE

Màu xanh hải quân #7FFFD4 AQUAMARINE

III.4.4 Các thẻ liên kết

a. Siêu văn bn

• Cú pháp:

• Các thuộc tính của thẻ

Tên thuộc tính Ý nghĩa

HREF Quy ñịnh ñịa chỉ (url) mà liên kết trỏ tới

NAME ðặt tên cho vị trí ñặt thẻ

TABINDEX Thứ tự di chuyển khi nhấn phím tab

TITLE Văn bản hiển thi khi di chuyển chuột trên siêu liên kết

TARGET Quy ñịnh liên kết sẽ ñược mở ra ở ñâu: _self (trang hiện tại), _blank (cửa sổ mới), .

• Ví dụ

Mã nguồn Kết quả

<body>

<a href="http://www.dct.udn.vn/news.asp">CðCN</a> </body>

o Khi liên kết từ tài liệu này sang tài liệu khác ở cùng chung thư mục, chỉ cần chỉ ra tên file trong thông số HREF là ñủ

o Khi liên kết từ tài liệu này sang tài liệu khác không ở cùng chung thư mục, cần phải cung cấp ñường dẫn tuyệt ñối hoặc tương ñối.

Ví dụ: ðường dẫn tương ñối là <a href=”…\index.html”>Dantri</a> ðường dẫn tuyệt ñối là <a href=”D:\Web\index.html”>Dantri</a>

b. Kết ni mail

Mã nguồn Kết quả

<body>

<address> Vui lòng gởi mail cho tôi qua

ñịa chỉ

<a href="mailto: buudung@gmail.com">

buudung@gmail.com </a> </address> </body>

Vui lòng gởi mail cho tôi qua ñịa chỉbuudung@gmail.com

III.4.5Các thẻ chèn hình ảnh

a. Th <img … />

• Cú pháp

• Các thuộc tính của thẻ <img…/>

Tên thuộc tính Ý nghĩa

ALIGN Căn hàng văn bản bao quanh ảnh ALT

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, hoặc chức năng show picture của trình duyệt bị tắt ñi hay trên trình duyệt không hỗ trợ ñồ họa

BORDER ðặt kích thước ñường viền cho ảnh

WIDTH ðộ rộng của ảnh. 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.

HEIGHT ðộ cao của ảnh

HSPACE Chỉ ñịnh khoảng trống bên trái và phải của ảnh VSPACE Chỉ ñịnh khoảng trống bên trên và dưới của ảnh TITLE Nội dung hiển thị khi ñưa trỏ chuột lên hình. • Ví dụ

Mã nguồn Kết quả

<body>

<img src = "baby.jpg" alt = "baby" title = "Baby2012" border = "1" width = "100" height= "100" /> </body>

Lưu ý

o Nếu ảnh không hiện lên trang web thì thay vào ñó sẽ hiện tiêu ñề ảnh.

o Ảnh cho vào trang web nên lưu dưới dạng .PNG (hỗ trợ tính năng trong suốt, nhưng không hiển thị tốt trên IE6.) hoặc .JPEG (hỗ trợ màu sắc sâu và sắc nét hơn) và dung lượng file hình ảnh không nên lớn quá.

o Tên của các file nên sử dụng chữ thường. Ví dụ: myphoto.jpg

b. Image Map

• Cú pháp:

• Thuộc tính của thẻ

Tên thuộc tính Ý nghĩa

SHAPE Kiểu hình (Rect / Circle / Poly)

COORDS

Tọa ñộ của hình

Hình chữ nhật: Tọa ñộ ñiểm ñầu, ñiểm cuối

Hình tròn: Tọa ñộ tâm, ñộ dài bán kính

ða giác: Các ñỉnh của vùng hình ña giác

ALT Chỉ ñịnh văn bản sẽ hiển thị nếu chức năng show picture của trình duyệt bị tắt ñi hoặc trên trình duyệt không hỗ trợ ñồ họa HREF ðịa chỉ của file cần chèn vào tài liệu

• Ví dụ:

Mã nguồn Kết quả

<body>

<map name="planetmap">

<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm" />

<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm" />

<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm" />

</map>

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap" />

</body>

Khi kích chuột vào vùng chứa:

mặt trời trên hình sẽ hiển thị hình mặt trời ñược phóng lớn

sao thủy trên hình sẽ hiển thị hình sao thủy ñược phóng lớn

III.4.6 Các thẻ chèn âm thanh

• Một số ñịnh dạng video: .avi, .wmv, .mpg / .mpeg, .mov, .rm / .ram, .swf / .flv, .mp4 • Một số ñịnh dạng âm thanh: .mp3 / .mpga, .wma, .wav, .mid / .midi

Một phần của tài liệu Giáo trình thiết kế website (Trang 52 - 57)

Tải bản đầy đủ (PDF)

(94 trang)