cuốn sách gpt4 ai đã làm

html - Thuộc tính float CSS - sự khác biệt về hành vi giữa float div và đoạn float

In lại Tác giả: Walker 123 Thời gian cập nhật: 28-11-2023 01:04:16 27 4
mua khóa gpt4 Nike

Tôi đang học cách sử dụng CSS trôi nổi tài sản. Tôi muốn hiểu tác dụng cụ thể của tài sản này.

Hãy xem xét phần tử HTML đơn giản sau:

div1

div2

Đây là một đoạn văn


và các quy tắc CSS sau:

div {
chiều cao: 100px;
chiều rộng: 100px;
}

#div1 {
màu nền: xanh lam;
}

#div2 {
màu nền: đỏ;
}

P {
màu nền: xanh lá cây;
}

nếu tôinổi: trái #div1, #div2 không còn hiển thị nữa (vì hiện tại nó bị ẩn sau #div1).

nếu tôi muốn nổi: trái #div2, tôi muốn điều gì đó tương tự xảy ra với đoạn đó.

Nhưng đó không phải là trường hợp. Đoạn văn hoạt động khác với div. Nó không bị ẩn đằng sau #div2 mà nằm ngay bên cạnh nó.

Ai đó có thể giải thích tại sao có sự khác biệt trong hành vi này?

Cảm ơn.

Chỉnh sửa 1:

Đây là Stacksnippet, với mã ban đầu

div {
chiều cao: 100px;
chiều rộng: 100px;
}

#div1 {
màu nền: xanh lam;
}

#div2 {
màu nền: đỏ;
}

P {
màu nền: xanh lá cây;
}
div1

div2

Đây là một đoạn văn

Đây là đoạn được khai báo trong quy tắc CSS #div1 với float: left.

div {
chiều cao: 100px;
chiều rộng: 100px;
}

#div1 {
màu nền: xanh lam;
nổi: trái;
}

#div2 {
màu nền: đỏ;
}

P {
màu nền: xanh lá cây;
}
div1

div2

Đây là một đoạn văn

Đây là điều xảy ra khi tôi sử dụng cùng một khai báo trong quy tắc #div2:

div {
chiều cao: 100px;
chiều rộng: 100px;
}

#div1 {
màu nền: xanh lam;
}

#div2 {
màu nền: đỏ;
nổi: trái;
}

P {
màu nền: xanh lá cây;
}
div1

div2

Đây là một đoạn văn

câu trả lời hay nhất

Phần tử float sẽ loại phần tử này ra khỏi luồng phần tử không float. Nhưng TEXT của các phần tử khác này sẽ nổi xung quanh phần tử float. Hãy thử làm cho div2 của bạn lớn hơn và đặt nhiều văn bản hơn vào đó, sau đó bạn sẽ hiểu ý tôi.

Về sự khác biệt về hành vi giữa thuộc tính html - CSS float - float div và float, chúng tôi đã tìm thấy một câu hỏi tương tự trên Stack Overflow: https://stackoverflow.com/questions/40599533/

27 4 0
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress