判斷屏幕長寬比的 CSS 代碼示例如下：

在 CSS 中，可以使用 `width` 和 `height` 屬性來設置容器元素的寬和高，但是有時候容器元素的寬高可能不是固定的，而是取決于屏幕的長寬比。在這種情況下，我們需要使用 `screen` 對象來判斷屏幕的長寬比，然后將容器元素的寬高根據屏幕長寬比進行縮放。

下面是一個使用 `screen` 對象來判斷屏幕長寬比并設置容器元素的寬高的例子：

```html

<div style="width: 100%; height: 100vh; background-color: blue;">

<div style="display: flex; flex-direction: column; justify-content: space-between; height: 50px;">

<div>1</div>

<div>2</div>

<div>3</div>

</div>

</div>

在這個例子中，我們使用 `display: flex` 將容器元素設置為彈性盒子，并使用 `flex-direction: column` 將容器元素的內容按照水平方向排列。我們使用 `justify-content: space-between` 來設置子元素的相對布局，使得它們能夠彼此居中并排列成一行。最后，我們使用 `height: 50px;` 來設置每個子元素的相對高度為 50 像素。

當屏幕的長寬比是 1:1 時，我們可以看到容器元素和子元素都居中并排列成一行。當屏幕的長寬比不是 1:1 時，我們可以看到容器元素和子元素根據屏幕長寬比自適應高度。例如，如果屏幕的長寬比是 1.5:1 時，容器元素將高度為屏幕寬度的 1.5 倍，而如果屏幕的長寬比是 2:1 時，容器元素將高度為屏幕寬度的 2 倍。

總之，使用 `screen` 對象來判斷屏幕長寬比并設置容器元素的寬高，可以幫助我們在不同的屏幕長寬比下自適應容器元素的布局，從而使網頁更加適應各種屏幕大小。