Các lớp Layer

Một phần của tài liệu Tài liệu lập trình web căn bản (Trang 88)

Layer là một thành phần mới trong thiết kế Web, nó có thể chứa nội dung văn bản, hình ảnh xếp chồng lên nhau, nổi trên trang và chuyển động rất linh hoạt Layer thường được sử dụng để thiết kế trang có các hiệu ứng đặc biệt như chữ rơi, ảnh bay,…

Điểm bất lợi của Layer là không hiển thị trên các trình duyệt cũ như IE4.0, Nestcape 4.0, đối với các trình duyệt mới thì Layer hiển thị một cách trung thực

1. Cách tạo Layer trên trang:

Cách 1:

 Chọn Standard Mode

 Click nút Draw Layer, drag chuột vẽ Layer

Cách 2:

 Chọn menu Insert Layout Objects  Chọn Layer

2. Hiệu chỉnh Layer:

 Chọn layer, Layer được chọn sẽ xuất hiện 8 Handle xung quanh, khi đó ta thực

hiện các thao tác hiệu chỉnh trên Layer đó a. Di chuyển Layer:

 Chọn Layer cần di chuyển

 Drag chuột kéo Layer đến vị trí mới

Hoặc nhập giá trị toạ độ trong Properies Inspector

b. Thay đối kích thước của Layer:

 Chọn Layer cần hiệu chỉnh kích thước

 Click chuột vào một trong các Handle, Drag chuột để thay đổi kích thước

 Hoặc nhập thông số trực tiếp vào Properties Inspector

c. Chèn nội dung vào Layer:

 Nếu nội dung là văn bản thì nhập trực tiếp vào Layer

 Nếu nội dung là hình ảnh thì drag chuột chọn hình trong thư mục Image thả

vào Layer (hoặc chọn Insert Image)

d. Xếp chồng các Layer:

Khi cần hiển thị nhiều ảnh trên trang, nhưng không đủ chổ, ta có thể xếp chồng lên nhau, sau đó cho xuất hiện từng lớp một hoặc cho từng lớp Layer bay ra khỏi màn hình, điều này có thể thực hiện được khi kết hợp Layer, Timeline và Behaviors

e. Thứ tự các Layer:

Mỗi lớp Layer đều có thuộc tính Z-Index hiển thị thứ tự trước, sau của các lớp Layer, lớp Layer sau sẽ che khuất lớp Layer trước nếu nó có cùng toạ độ, có thể thay đổi trình tự các lớp layer bằng cách:

 Chọn Lớp Layer cần thay đổi thứ tự

 Trong Properties Inspector, nhập thứ tự mới trong mục Z-index

Toạ độ cách biên trái Toạ độ cách biên trên

Độ rộng của Layer Chiều cao của Layer

3. Ẩn hiện một Layer:

Khi không muốn xem Layer nào thì ẩn Layer đó bằng một trong các cách sau: Trong Properties Inspector, tại thuộc tính Vis: chọn Hidden. Hoặc mở Layer Panel:

Một phần của tài liệu Tài liệu lập trình web căn bản (Trang 88)