CSS設置大小屏幕

現今的網站必須兼容各種屏幕，包括小屏幕如手機，平板電腦等。為實現這個目標，CSS提供了很多解決方案。

首先，我們可以使用媒體查詢（Media Query）來根據屏幕尺寸調整樣式。具體地說，我們可以使用如下代碼：

@media screen and (max-width: 600px) {
body {
background-color: lightblue;
}
}

這段代碼會在屏幕寬度不超過600像素時改變頁面背景色為淺藍色。同樣，我們也可以使用min-width來適應更大的屏幕。

除了使用媒體查詢，我們還可以使用相對單位來設置元素尺寸。比如，我們可以使用viewport單位（vw，vh）來根據屏幕寬度和高度來設置元素尺寸：

.container {
width: 50vw;
height: 50vh;
}

這會讓容器元素的寬度和高度分別等于屏幕寬度和高度的一半。同樣，我們也可以使用rem單位來根據根元素字體大小來設置元素尺寸，而不是使用固定的像素值。

綜上所述，我們需要使用媒體查詢和相對單位來根據不同的屏幕尺寸來調整樣式和元素尺寸，以實現跨平臺的網站布局。