CSS是前端开发中的重要一环，它可以让我们实现各种视觉效果，其中一项重要的功能就是让控件居中显示。

/* 水平居中 */
.container {
display: flex;
justify-content: center;
}
/* 垂直居中 */
.container {
display: flex;
align-items: center;
}
/* 水平垂直居中 */
.container {
display: flex;
justify-content: center;
align-items: center;
}

上述代码中，使用了flex布局实现控件居中显示。其中justify-content属性用于水平居中，可以设置为center；align-items属性用于垂直居中，同样可以设置为center。若需要水平和垂直同时居中，则需在容器上同时设置两个属性。

除了使用flex布局，还可以使用其他的方法实现控件居中，如使用绝对定位来实现居中显示，具体代码如下：

.container {
position: relative;
}
.child {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

上述代码中，父级容器.container设置为相对定位，子元素.child设置为绝对定位，并使用top: 50%;和left: 50%;将其定位到父容器的中心位置。接着使用transform属性将其向上和向左移动50%的距离，就可以实现居中显示。

CSS能够让我们灵活地实现各种效果，这里只是展示了其中一种常见的控件居中显示方法。在实际开发中，可以根据需求选择不同的方法来实现控件的居中显示。