Trong phiên bản mới nhất, kéo sang trái và kéo phải đã được thay thế bằng .pull- {xs, sm, md, lg, xl} - {left, right, none}Điều gì đã xảy ra với các lớp .pull-left và .pull-right trong Bootstrap 4?
Điều đó có nghĩa là thay vì viết một đơn giản class="pull-right", tôi sẽ có ngay bây giờ để viết class="pull-md-right pull-xl-right pull-lg-right pull-sm-right pull-xs-right"
Có cách nào ít tẻ nhạt hơn để làm điều đó không?
Trở lại vào năm 2016 khi câu hỏi này được hỏi ban đầu, câu trả lời là:
$('.pull-right').addClass('pull-xs-right').removeClass('pull-right')
Nhưng bây giờ câu trả lời chấp nhận nên Robert Went của.
'.float- {sm, md, lg, xl} - {left, right, none}' hiện đang trôi qua trái/phải/không trong khi '.pull-left' và' .pull-right' đã bị xóa. – Mirko
kéo-phải là trở lại, nhưng nếu đó sẽ là trường hợp chỉ cần sử dụng css '''.pull-right{@extend .pull-xs-right;} '' ' – Alexis
JS DOM thao tác vì lợi ích của phong cách là một lớn không. – Archonic
Đối với bất cứ ai khác tìm này:
Các lớp hiện đang float-rightfloat-sm-right, vv
Các truy vấn phương tiện truyền thông di động đầu tiên, vì vậy sử dụng float-sm-right sẽ ảnh hưởng đến kích thước màn hình nhỏ và bất cứ điều gì rộng lớn hơn, do đó (hiện tại) có không có lý do để thêm một lớp cho mỗi chiều rộng. Chỉ cần sử dụng màn hình nhỏ nhất bạn muốn ảnh hưởng hoặc float-right cho tất cả chiều rộng màn hình.
Docs chính thức:
Lớp học: https://getbootstrap.com/docs/4.0/utilities/float/
Cập nhật: https://getbootstrap.com/docs/4.0/migration/#utilities
tài liệu về điều này: https://getbootstrap.com/docs/4.0/migration/#utilities và https://getbootstrap.com/docs/4.0/utilities/float/ – lasec0203
Cảm ơn bạn đã giải thích –
Đối với bất cứ ai khác và chỉ cần một sự bổ sung cho Robert, Nếu nav của bạn có giá trị hiển thị flex, bạn có thể nổi phần tử mà bạn cần phải, bằng cách thêm điều này vào css của nó
{
margin-left: auto;
}
Tôi đã có thể thực hiện việc này bằng cl lừa trong dự án của tôi
d-flex justify-content-end
<div class="col-lg-6 d-flex justify-content-end">
Thay đổi để float-rightfloat-leftfloat-xx-left và float-xx
Dường như bạn đã không hoàn toàn hiểu được cách tiếp cận di động đầu tiên. '.pull-xs-right' sẽ làm cho đối tượng trôi nổi ngay trên tất cả các kích cỡ màn hình, vì css xếp chồng lên các thiết bị lớn hơn. P.s Có lẽ nó đã thay đổi trong các phiên bản gần đây nhưng bạn nên sử dụng '.logger-right' thay vì' .pull-right'. –