Khoanglang89
Bạn hãy đăng nhập hoặc đăng ký
Khoanglang89
Bạn hãy đăng nhập hoặc đăng ký
Khoanglang89

NHẬN THIẾT KẾ WEBSITE/ SOFTWARE - LÀM ĐỒ ÁN TỐT NGHIỆP, ĐỒ ÁN CHUYÊN MÔN NGÀNH CÔNG NGHỆ THÔNG TIN


You are not connected. Please login or register

Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down  Thông điệp [Trang 1 trong tổng số 1 trang]

Admin

Admin

Admin
Admin
Loading
Bài 17: Thuộc tính cho thành phần BODY-Phần 2




Trong
bài 10, chúng ta đã nắm một số thuộc tính (properties) cho thành phần
<b><BODY></b> bao gồm: màu nền (bgcolor=), ảnh nền
(background=) và màu chữ (text=). Bài này chúng ta đề cập đến các thuộc
tính còn lại của <b><BODY></b> bao gồm: Lề của trang
Web (margin), màu của các đường liên kết (link).


I-Lề của trang HTML: topmargin= "", leftmargin=""
1-topmargin: cú pháp


<body topmargin="số pixels">


Trong đó:


  • topmargin= :Khai báo khỏang cách trên cùng của trang Web so với trình duyệt. Giá trị là số Pixels


2-leftmargin: cú pháp



<body leftmargin="số pixels">


Trong đó:


  • leftmargin= :Khai báo khỏang cách trái phải của trang Web so với hai biên của trình duyệt. Giá trị là số Pixels


3-Viết gộp 2 thẻ trong thành phần BODY:



<body leftmargin="số pixels" topmargin="số pixels">



4- Ví dụ: Đọan Code xác định khỏang cách trên cùng, khỏang cách 2 biên của trang Web với trình duyệt bằng 5 pixels.


<body leftmargin="5" topmargin="5">


5-a Real World Example: Đọan Codes này xác định khỏang cách trên cùng của trang Web với trình duyệt bằng 0 pixels.





<html>
<head>
<title>TEST MARGIN</title>
</head>
<BODY BGCOLOR="#FFFFFF" text="#000000" leftmagrin="0" topmargin="0">

<TABLE align="center" width="600" height="50" border="1" cellpadding="0" cellspacing="0">
<TR>
<TD align="center" width="140" bgcolor="lime">Banner 1 </TD>
<TD align="center" width="320" bgcolor="yellow">Banner 2 </TD>
<TD align="center" width="140" bgcolor="lime">Banner 3 </TD>
</TR>
</TABLE>
<TABLE align="center" WIDTH="600" HEIGHT="20" cellpadding="0" cellspacing="0" border="1">
<TR bgcolor="#FF00FF">
<TD align="center" HEIGHT="20"><font color="blue" size="1"><b>Đặt Script giờ đăng nhập:</b></TD>
<TD align="center" HEIGHT="20"><font color="blue" size="1"><b>Đặt Script ngày tháng năm</b></TD>
</TR>
</TABLE>


<TABLE align="center" width="600" cellspacing="0" cellpadding="0">
<TR>
<TD align="left" WIDTH="140" VALIGN="TOP">
<TABLE cellpadding="2" cellspacing="2" width="140" border="1" bordercolor="silver">
<TR>
<TD BGCOLOR="#FFCC99">Trang Chính</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Giới thiệu</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Tinhọc</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Âm nhạc</TD>
<TR>
<TD BGCOLOR="#FFCC99">Tiếng Anh</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Kiến Thức</TD>
</TR>
</TABLE>

</TD>

<TD BGCOLOR="#99FFFF" VAlign="tOP" width="320" height="100%" align="center">

<br>
<br>
<CENTER>
Welcome to My First HTML Page!<BR>
Đón chào bạn đến với TRang Web đầu tiên của tôi!
</CENTER>
</TD>

<TD valign=top BGCOLOR="#FFCC99" WIDTH="140">
<TABLE WIDTH="140" border="1" cellspacing="2" cellpadding="2" bordercolor="#FFFFFF">
<TR>
<TD BGCOLOR="#FFCC99" align="right">Truyện dài</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Truyện ngắn</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Truyện cười</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Thơ</TD>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Liên lạc</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Đăng ký </TD>
</TR>
</TABLE>


</TD>
</TR>
</TABLE>
<TABLE ALIGN="CENTER" Border="1" width="600" height="20" cellpadding=0 bgcolor="#8DCFF4">
<TR>
<TD align="Center"><b>All rights reserved-Copyrighted by Me.</TD>
</TR>
</TABLE>
</body>
</html>

Chép đọan codes này và dán vào Coderunner, Click nút Xem trang Web,
bạn thấy rằng bây giờ trang này phía trên cùng nằm sát với thực đơn
trình duyệt. Không có khỏang trống nào. Với Leftmargin vì chúng ta dùng
độ rộng của <TABLE> là 600pixels nên không thấy được khỏang cách.



5-b Real World Example: Đọan Codes này xác định khỏang
cách trên cùng và hai biên của trang Web với trình duyệt bằng 0 pixels.



Đổi lại độ rộng của các bảng (table) trong đọan Codes trên là 100%. Chép đọan Codes dưới đây là lưu vào Notepad với tên tập tin testmargin.html. Mở bằng trình duyệt hoặc Coderunner bạn sẽ thấy kết quả:



<html>
<head>
<title>TEST MARGIN</title>
</head>
<BODY BGCOLOR="#FFFFFF" text="#000000" leftmargin="0" topmargin="0">

<TABLE align="center" width="100%" border="0" cellpadding="0" cellspacing="0">
<TR>
<TD align="center"</TD>


<TABLE align="center" width="100%" height="50" border="1" cellpadding="0" cellspacing="0">
<TR>
<TD align="center" width="140" bgcolor="lime">Banner 1 </TD>
<TD align="center" width="320" bgcolor="yellow">Banner 2 </TD>
<TD align="center" width="140" bgcolor="lime">Banner 3 </TD>
</TR>
</TABLE>

<TABLE align="center" WIDTH="100%" HEIGHT="20" cellpadding="0" cellspacing="0" border="1">
<TR bgcolor="#FF00FF">
<TD align="center" HEIGHT="20"><font color="blue" size="1"><b>Đặt Script giờ đăng nhập:</b></TD>
<TD align="center" HEIGHT="20"><font color="blue" size="1"><b>Đặt Script ngày tháng năm</b></TD>
</TR>
</TABLE>


<TABLE align="center" width="100%" cellspacing="0" cellpadding="0">
<TR>
<TD align="left" WIDTH="140" VALIGN="TOP">
<TABLE cellpadding="2" cellspacing="2" width="140" border="1" bordercolor="silver">
<TR>
<TD BGCOLOR="#FFCC99">Trang Chính</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Giới thiệu</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Tinhọc</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Âm nhạc</TD>
<TR>
<TD BGCOLOR="#FFCC99">Tiếng Anh</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99">Kiến Thức</TD>
</TR>
</TABLE>

</TD>

<TD BGCOLOR="#99FFFF" VAlign="tOP" height="100%" align="center">

<br>
<br>
<CENTER>
Welcome to My First HTML Page!<BR>
Đón chào bạn đến với TRang Web đầu tiên của tôi!
</CENTER>
</TD>

<TD valign=top BGCOLOR="#FFCC99" WIDTH="140">
<TABLE WIDTH="140" border="1" cellspacing="2" cellpadding="2" bordercolor="#FFFFFF">
<TR>
<TD BGCOLOR="#FFCC99" align="right">Truyện dài</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Truyện ngắn</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Truyện cười</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Thơ</TD>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Liên lạc</TD>
</TR>
<TR>
<TD BGCOLOR="#FFCC99" align="right">Đăng ký </TD>
</TR>
</TABLE>


</TD>
</TR>
</TABLE>
<TABLE ALIGN="CENTER" Border="1" width="100%" height="20" cellpadding=0 bgcolor="#8DCFF4">
<TR>
<TD align="Center"><b>All rights reserved-Copyrighted by Me.</TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>

</body>
</html>



II-Màu của các liên kết trong HTML: link= "", alink="", vlink=""
Cho đến giờ chúng ta chưa học đến lệnh liên kết đến trang hoặc
Website trong HTML. Tuy vậy, bài học này cung cấp thông tin để bạn sử
dụng cho các liên kết mà bạn sẽ học trong bài 18. Như bạn biết, ngòai
việc hiển thị thông tin trên trình duyệt, HTML còn cho phép chúng ta
liên kết đến các trang HTML khác, hoặc các Website khác... Để làm được,
chúng ta phải sử dụng Thẻ liên kết(sẽ đề cập đến trong bài 18). Mỗi một
liên kết bao gồm màu chữ của Liên kết khi người dùng chưa Click chuột
lên liên kết đó (Link color). Màu chữ của Liên kết khi liên kết đã được
Click và hiện tại trang liên kết đang mở (active link). Và màu của liên
kết cho biết rằng trang đó chúng ta đã xem(visited link). HTML chỉ cho
chúng ta 3 thuộc tính đó. Ngòai ra, để thực sự điều khiển được thuộc
tính của Liên kết, bạn phải dùng đến CSS. CSS cho phép bạn tất cả các
khả năng mà bạn cần để trang web trở nên sinh động hơn.

Trong HTML để khai báo màu của Link, bạn phải đặt các thuộc tính này trong thẻ <BODY>. Có 3 thuộc tính mà bạn dùng là:


  • link="giá trị màu" :Khai báo màu của chữ đại diện cho Liên kết. Giá trị màu có thể là tên màu hoặc giá trị Hex.
  • alink="giá trị màu" :Khai báo màu của chữ đại diện cho
    Liên kết khi liên kết này được click. Giá trị màu có thể là tên màu hoặc
    giá trị Hex( alink viết tắt của Active Link: Liên kết đang họat động)
  • vlink="giá trị màu" :Khai báo màu của chữ đại diện cho
    Liên kết khi liên kết này được xem. Giá trị màu có thể là tên màu hoặc
    giá trị Hex( vlink viết tắt của Visited Link: Liên kết đã được xem.)


1-Cú pháp:



<BODY LINK="màu" ALINK="màu" VLINK="màu">


2-Ví dụ:


Để khai báo màu chữ của liên kết là Xanh, Active Link là màu Đỏ và Vlink là màu Tím, bạn viết như sau:



<BODY LINK="blue" ALINK="red" VLINK="purple">


Hoặc bạn có thể dùng giá trị HEX:


<BODY LINK="#0000FF" ALINK="#FF0000" VLINK="#9900CC">

Tham khảo bảng màu với các giá trị Hex sẵn có.


Trong bài kế tiếp, bạn sẽ học cách đặt một liên kết trên trang HTML.


Hết Bài 17.




Nguồn: Sưu tầm Internet




https://khoanglang89.forumvi.com

Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang  Thông điệp [Trang 1 trong tổng số 1 trang]

Bài viết mới cùng chuyên mục

      Permissions in this forum:
      Bạn không có quyền trả lời bài viết