CSS按照屏幕尺寸計算，是一個重要的響應式設計的概念，它讓網站能夠根據不同屏幕尺寸，自動調整布局，以便為用戶提供更好的瀏覽體驗。以下是一些關于如何使用CSS按照屏幕尺寸計算的例子。

/* 使用媒體查詢設置不同屏幕尺寸下的背景顏色 */
body {
background-color: #F2F2F2; /* 默認背景顏色 */
}
@media only screen and (min-width: 600px) {
body {
background-color: #FFFFFF; /* 在600px以上的屏幕寬度下，將背景顏色更改為白色 */
}
}
@media only screen and (min-width: 1200px) {
body {
background-color: #000000; /* 在1200px以上的屏幕寬度下，將背景顏色更改為黑色 */
}
}

以上CSS代碼中，我們使用了媒體查詢，根據不同的屏幕寬度，來修改頁面的背景顏色。我們使用了三個不同的媒體查詢，在不同的屏幕寬度下，分別設置了不同的背景顏色。

/* 使用媒體查詢隱藏或顯示特定元素 */
.hidden {
display: none; /* 默認隱藏該元素 */
}
@media only screen and (min-width: 600px) {
.hidden {
display: block; /* 在600px以上的屏幕寬度下，顯示該元素 */
}
}

以上CSS代碼使用了媒體查詢，控制了特定元素在不同的屏幕寬度下的顯示和隱藏。這樣，當屏幕尺寸較小時，我們可以將一些不必要的元素隱藏起來，以免占用頁面空間。

總而言之，CSS按照屏幕尺寸計算，是在響應式設計中非常重要的概念。我們可以通過媒體查詢和其他CSS屬性來修改頁面的布局和樣式，以適應不同的屏幕寬度。