在Vue中使用CSS计算可以更方便地适应不同的设备和不同的屏幕大小。Vue提供了一种叫做响应式设计的解决方案，它允许您在CSS中使用JavaScript表达式来计算样式。

例如，如果您想要在不同屏幕大小下调整元素的宽度，您可以通过以下代码实现：

<template>
<div :style="{ width: screen.width >= 768 ? '50%' : '100%' }">
<p>内容</p>
</div>
</template>
<style>
p {
font-size: 20px;
}
</style>

在上面的代码中，我们使用了Vue的style绑定属性，将一个对象传递给了样式。这个对象具有一个名为width属性的键，它的值是一个JavaScript表达式：如果屏幕宽度大于或等于768像素，则元素的宽度为50%，否则为100%。这个表达式使用一个三元运算符，根据条件返回不同的值。

另一个值得注意的地方是我们使用了一个带有响应式属性的变量：screen.width。这意味着当屏幕大小改变时，这个表达式会自动重新计算，并更新元素的样式。

通过这种方式，您可以使用Vue和CSS结合编写更灵活和适应性更强的样式。