tôi đã không thực hiện bất kỳ phiên bản iPhone nào, vì vậy tôi có câu hỏi này,Phiên bản trang web dành cho iPhone, khuyên bạn nên làm việc trong px hoặc bằng%?
Để có thể duyệt các trang web đúng -even nếu người dùng quay 90º điện thoại của mình:
Tôi có nên đặt CSS bằng px hoặc bằng% không?
Nếu bạn đang programatically nhắm mục tiêu các thiết bị iOS như iPhone & iTouch sau đó tôi sẽ sử dụng pixel trái ngược với tỷ lệ phần trăm, nhưng nếu bạn không nhắm mục tiêu các thiết bị như vậy và muốn trang web di động một điểm dừng cho tất cả (hầu hết các điện thoại thông minh) thì tôi sẽ xem xét sử dụng tỷ lệ phần trăm.
bạn có thể chỉ định min-width max-width and min-device-width and max-device-width trong các truy vấn phương tiện của mình.
Dưới đây là một chút thông tin khác về truy vấn phương tiện và kết hợp mà bạn có thể thực hiện;
/* Target iPhone Portrait */
@media screen and (max-width: 320px) and (orientation: portrait) { body{background:#F0F;} }
/* Target Android Portrait larger than 320px Width */
@media screen and (min-width: 321px) and (max-width: 480px) and (orientation: portrait) { body{background:#F00;} }
/* Target iPhone Landscape */
@media screen and (max-width: 480px) and (orientation: landscape) { body{background:#0F0;} }
/* Target Android Landscape */
@media screen and (min-width: 481px) and (max-width: 800px) and (orientation: landscape) { body{background:#FF0;} }
Cá nhân tôi sẽ sử dụng%, chứ không phải là px ...
Bạn sẽ muốn trang để trở thành 100% trong đó bao giờ theo cách này có thể xoay, và sau đó chuyển nội dung xung quanh cho phù hợp.
Thời báo New York sử dụng%, vì bạn có thể thấy trang ở đâu là Cảnh mà bạn được phóng to hơn Chân dung.
Bạn có thể sử dụng% với một lớp css và kích thước của các thành phần sẽ được điều chỉnh tự động.
Bạn cũng có thể sử dụng px với hai lớp, một cho chân dung, một cho cảnh quan:
body[orient="portrait"] {
property: value;
}
body[orient="landscape"] {
property: value;
}
là nó định hướng hoặc định hướng? –
đó là định hướng, xu hướng được sử dụng với @media – malinois
lạ, cố gắng mà và không hiển thị bất kỳ ảnh hưởng nào; s –
Nếu bạn đang xây dựng một trang web không cụ thể cho iPhone (tên miền phụ như iphone.mywebsite.com) Tôi khuyên bạn nên sử dụng Truy vấn phương tiện CSS như Xavier đề xuất. Nó cho phép bạn làm nhiều hơn là chỉ định một số min-width và max-width!
Bạn có thể chỉ định các loại thiết bị (nhưng nhiều thiết bị không được công nhận như họ nên ...) như: screenhandheldprinttv và nhiều người khác Nhưng quan trọng nhất là bạn cũng có thể thiết lập nếu cửa sổ trình duyệt đang trong portait hoặc landscape , đó là resolution hoặc aspect-ratio và cứ thế ...
Đối với% hoặc px tôi chắc chắn sẽ tìm px, rất khó để có thứ gì đó hoạt động như bạn muốn bằng%. Vì bạn không nhất thiết muốn có cùng một loại thông tin nếu người dùng của bạn đi kèm với iPhone hoặc với thiết bị khác. Ví dụ, bạn có thể đưa ra tất cả các hình ảnh nặng từ trang web của bạn cho người dùng iPhone bởi vì họ có thể sẽ sử dụng kết nối 3G và do đó làm cho trang web của bạn tải nhanh hơn rất nhiều!
Một thực sự nice example về những gì bạn có thể làm với CSS Truyền thông Queries ... không may it0s không công việc của tôi ... :-(
Vâng, tôi đang nhắm mục tiêu các thiết bị IOS –
có vẻ như sử dụng pixel là cách tiến lên rồi! – Xavier
vì vậy chiều rộng tối đa thiết bị sẽ áp dụng cho cảnh quan? và chiều rộng tối đa sẽ áp dụng cho ảnh chân dung? –