2011-07-28 41 views
6

Kiểm tra: http://thinkvitamin.com/CSS: Ẩn một cột khi chiều rộng giảm

Khi bạn giảm kích thước trình duyệt, tại một số điểm, cột bên phải sẽ biến mất. Giảm khá đẹp, và điều này làm cho thiết kế khá linh hoạt. Tuy nhiên, tôi không thấy bất kỳ CSS đặc biệt nào đang diễn ra. Javascript này, hoặc có thể bằng cách này bằng cách nào đó đạt được chỉ với CSS?

Trả lời

9

Điều này đang được thực hiện bằng CSS thuần túy, cụ thể là với Truy vấn phương tiện của CSS3.

Các spec: http://www.w3.org/TR/css3-mediaqueries/

Một hướng dẫn: http://webdesignerwall.com/tutorials/css3-media-queries

Hỗ trợ trình duyệt: http://caniuse.com/css-mediaqueries (chỉ hoạt động "ở khắp mọi nơi" trừ IE8 và thấp hơn)

+1

Một số liên kết tương tự có thể được tìm thấy tại http://css-tricks.com/ - Chris Coiyer đã viết một vài bài viết tuyệt vời về chủ đề: http: // css- tricks.com/6731-css-media-queries/, http://css-tricks.com/6206-resolution-specific-stylesheets/ – Nightfirecat

0

Lý do mà các phần bên phải biến mất là vì họ có điều này trên css của họ:

width: 24%; 
float: right; 

nếu chiều rộng có thể đã được thiết lập để có chiều rộng cố định các phần có thể đã giảm xuống dưới cùng của bài báo.

+0

Tôi không thấy lý do tại sao điều này sẽ biến mất ...? Nó sẽ chỉ nhận được vô cùng nhỏ như kích thước giảm, tôi sẽ nói. Giống như: http://jsfiddle.net/mWYBX/ – user852091

Các vấn đề liên quan