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属性来修改页面的布局和样式，以适应不同的屏幕宽度。