css3 - ratio - 什麼是媒體查詢的最佳寬度範圍




min width max width (2)

您可以在這裡查看更長的屏幕尺寸列表和相應的媒體查詢。

或者去Bootstrap媒體查詢

/* Large desktop */
@media (min-width: 1200px) { ... }

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { ... }

/* Landscape phone to portrait tablet */
@media (max-width: 767px) { ... }

/* Landscape phones and down */
@media (max-width: 480px) { ... }

另外,您可能需要使用以下默認設置來查看Foundation的媒體查詢

// Media Queries

$screenSmall: 768px !default;
$screenMedium: 1279px !default;
$screenXlarge: 1441px !default;

有人可以告訴我什麼是響應式設計中檢測媒體查詢的最佳寬度範圍?

我想涵蓋所有台式機/筆記本電腦顯示器(一個方向)在4媒體查詢,但我不知道是否有可能例如:小型顯示器,中型顯示器,大型和超大型顯示器。

例如在這個代碼中

/* Desktops and laptops ----------- */
 @media only screen and (min-width : 1224px) {}

/* Large screens ----------- */
 @media only screen and (min-width : 1824px) {}

我認為我們仍然需要將台式電腦和筆記本電腦的媒體設備分成三個小型媒體(像13“到14”筆記本電腦),中等(15到17)和大(超過22“),我知道瀏覽器的分辨率是不同的比屏幕分辨率,但讓我們說,我們的瀏覽器在全屏模式下的所有格式。

謝謝你的幫助


最好的辦法是針對功能,而不是設備,除非你必須,引導做得很好,你可以延長他們的斷點,例如目標像素密度和1920以上的大屏幕





media-queries