Yêu cầu thg 1 16, 2020 4:01 SA 737 0 5
  • 737 0 5
+1

lỗi về responsive @media

Chia sẻ
  • 737 0 5

Mình bị lỗi về responsive @media. Khi @media trên 900px thì nó nhận css, nhưng khi @media nhỏ hơn thì k nhận css. Đã có bác bào bị chưa, cảm ơn các bác giúp đỡ.

thg 1 16, 2020 4:14 SA

Bạn có thể show code lên không ? ví dụ như thế này thì đoạn css bên trong @media của bạn chỉ nhận khi kích thước màn > 900px thôi

@media only screen and (min-width: 900px){
  .image{
      display: none;
  }
}

5 CÂU TRẢ LỜI


Đã trả lời thg 1 17, 2020 7:02 SA
+1

@media only screen and (min-width: 900px){ // }

Với cấu hình như này, css sẽ hoạt động trong phạm vi màn rộng từ 900px trở lên.

Còn cấu hình như dưới, css sẽ hoạt động trong phạm vi màn rộng từ 900px trở xuống.

@media only screen and (max-width: 900px){ // }

Chia sẻ
Đã trả lời thg 1 16, 2020 4:04 SA
0

Tức là bạn viết reponsive cho màn dưới 900px nó không nhận? Có thể đang có đoạn code nào đó đè lên chăng, bạn thử bật f12 lên xem thử đi

Chia sẻ
Đã trả lời thg 1 16, 2020 4:07 SA
0

tốt nhất để đảm bảo chắc chắn thì bạn chia màn hình ra một số cỡ phổ biết rồi @media theo từng cái một, như các Boostrap làm a

Chia sẻ
Đã trả lời thg 1 17, 2020 6:11 SA
0

Bác bật f12 lên xem nó nhận đúng class và css các kiểu chưa, nếu nhận rồi mà nó bị gạch ngang ở các đoạn css đó thì bác có thể thêm thuộc tính !important

Chia sẻ
Đã trả lời thg 3 19, 2021 9:40 SA
0

bạn thêm link <meta name="viewport" content="width=device-width, initial-scale=1"> này vào chưa

Chia sẻ
Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí