如何使用CSS圆只显示一半？这种效果很常见，可以让页面看起来更加美观。事实上，这种效果非常简单。只需要使用CSS3的border-radius和overflow属性就可以轻松实现。

/* 定义一个长宽相等的div，并设置圆角 */
div {
width: 100px;
height: 100px;
border-radius: 50px;
overflow: hidden;
}
/* 设置背景颜色和位置 */
div:first-child {
background-color: #ffa500;
float: left;
}
div:last-child {
background-color: #4169e1;
float: right;
}

首先，需要定义一个长宽相等的div，并设置圆角。为了只显示一半，需要用到overflow属性。通过设置为hidden，可以隐藏超出div的内容。接着，通过设置背景颜色和位置，可以让两个半圆显示不同的颜色。

需要注意的是，当分割线处于浏览器的右侧时，右边的半圆可能会被截断。这时候，可以通过继续使用border-radius属性来解决。例如，在右边的div中设置border-top-right-radius和border-bottom-right-radius，就可以确保半圆完整显示。

总的来说，只需要几行CSS代码就可以实现圆只显示一半的效果。如果您需要在网页上实现这个效果，不妨试试以上代码。