嘗試在頁面上實現「分成兩半」；相對面有兩半」；相對面有兩半種顏色？幸運的是，有多種方法可以實現此效果，具體取決於您的瀏覽器支援要求。
如果必須支援舊版瀏覽器，您需要使用額外的固定 div 來填充一半螢幕並設定其背景顏色。
<pre class="brush:php;toolbar:false">position: fixed; top: 0; left: 0; width: 50%; height: 100%; background-color: pink;
}
如果較新的瀏覽器是您唯一關心的，您還有更多選項：
<pre class="brush:php;toolbar:false">height: 100%; background: linear-gradient(90deg, #FFC0CB 50%, #00FFFF 50%);
}
<pre class="brush:php;toolbar:false">height: 100%; background-color: cyan;
}
身體 {
height: 100%;
background-image: url('http://i.imgur.com/9HMnxKs.png');
background-repeat: repeat-y;
background-size: 50% auto;}
pre>
不要忘記將兩者的高度設定為100% html 和body元素以確保背景覆蓋整個視窗。
以上是如何在 CSS 中建立雙色分割背景？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
