Cách tạo DIV tương đối định vị trong Adobe Dreamweaver CS6 - núm vú

Sự định vị chính xác và vị trí của các thanh AP (các vị trí tuyệt đối) trong Adobe Dreamweaver CS6 có thể khá giải phóng cho các nhà thiết kế, đặc biệt những người thích tính linh hoạt của bố cục in.

Tuy nhiên, trong một số trường hợp, bạn có thể muốn các hộp tương thích với nội dung khác trên trang. AP Các phần nổi trên các phần tử khác, vì vậy việc chuyển nội dung trang khác không ảnh hưởng đến vị trí của chúng, điều này có thể là một điều tốt hay xấu.

Để có các hành vi nội tuyến truyền thống hơn, bạn có thể tạo DIVs sử dụng vị trí tương đối . Điều này cho phép một phần tử được thay đổi cùng với nội dung xung quanh nó, làm cho bố cục lỏng hơn. Loại định vị này rất quan trọng đối với nội dung lồng nhau hoặc bất kỳ tình huống nào mà các mục nên rơi phù hợp với nội dung trang khác.

Đối với tác vụ này, sử dụng công cụ Insert Div Tag, bạn có thể tìm thấy trong danh mục Chung và Giao diện của bảng Chèn.

Làm theo các bước sau để tạo một DIV tương đối:

1. Nhấp vào bên trong trang của bạn để định vị con trỏ bên trong một Dạng AP hiện có và sau đó nhấp vào công cụ Insert Div Tag trong Common and Layout của bảng Insert Thể loại.

2. Khi hộp thoại Insert Div Tag xuất hiện, tinh chỉnh vị trí của DIV mới bằng cách chọn một vị trí từ danh sách Insert thả xuống.

   Ví dụ: chọn Sau khi bắt đầu Thẻ để đặt nó trong thẻ DIV hiện có trong trang của bạn.

   Bạn cũng có thể sử dụng danh sách thả xuống của hộp thoại Insert Div Tag để đặt DIV trước, sau hoặc bên trong các phần tử hiện có trên trang. Để danh sách thả xuống Chèn được đặt là Điểm chèn vào để rời khỏi hộp nơi bạn đã vẽ hoặc chọn vị trí khác nơi bạn muốn tạo DIV.

   

3. Nếu bạn có một bộ chọn lớp hiện có mà bạn muốn áp dụng, hãy chọn nó từ danh sách thả xuống Lớp; nếu không, để trống.

4. Nếu ID hiện tại không có sẵn, hãy nhập tên mới vào trường ID và nhấp vào nút Quy tắc CSS mới để tạo một ID.

5. Khi hộp thoại Quy tắc CSS mới xuất hiện, hãy chắc chắn rằng bộ chọn mới của bạn được đặt thành ID và tên đó có một dấu hiệu (#) ở phía trước của nó. Nhấp OK.

6. Khi hộp thoại Định nghĩa Quy tắc CSS xuất hiện, hãy nhấp và chọn Định vị từ danh mục Danh mục ở bên trái để xem thuộc tính định vị CSS.

7. Trong vùng Định vị, chọn Tương đối từ menu Vị trí, nhập giá trị độ rộng và chiều cao vào các hộp văn bản Chiều rộng và Chiều cao và nhập Giá trị trên cùng và Dưới thuộc tính Định vị.Nhấp OK.

8. Nhấn OK để đóng hộp thoại Insert Div Tag.

   Một DIV mới, tương đối được hiển thị với văn bản giữ chỗ.

   

Các giá trị Top và Left tương đối khác nhau đối với DIVs tuyệt đối so với vị trí tương đối. Trong trường hợp định vị tương đối, các giá trị này chỉ ra một sự bù đắp từ nội dung xung quanh, trái ngược với một vị trí đã được đặt trong trang.