Dự án bố cục trang thực chiến (phần 3)

Thiết lập kích thước ban đầu cho page

Bạn đã học về các dạng thiết kế bố cục trang ở học phần sau:

https://giaiphapwebtl.vn/cac-dac-tinh-phuong-thuc-bo-cuc-trang-phan-2/

Và làm việc với width và height ở học phần sau:

https://giaiphapwebtl.vn/cac-dac-tinh-phuong-thuc-bo-cuc-trang-phan-3/

Để thiết lập kích thước ban đầu cho page:
1. Quay trở lại file pc_home.css trong editor của bạn và thêm quy tắc style sau vào phần
Body Styles:

body {
max-width: 960px;
min-width: 640px;
width: 95%;
}

2. Bên trong phần Body Header Styles điền quy tắc style sau để thiết lập dạng display và độ
rộng của ảnh logo:

body > header > img {
display: block;
width: 100%;
}

3. Lưu thay đổi của bạn vào file và sau đó mở file pc_home.html trong trình duyệt của bạn. Ảnh
dưới thể hiện bố cục hiện tại của page bodylogo.

body và logo

4. Thay đổi độ rộng của cửa sổ trình duyệt của bạn và thẩm định rằng kích cỡ của page bodykích
cỡ của logo thay đổi lại kích cỡ khi cần bên trong phạm vi từ 640 đến 960 pixels.

Chia sẻ

Leave a Reply

Your email address will not be published. Required fields are marked *