小米公司一直以來都注重用戶體驗的提升，因此在商城官網制作上也下了不少功夫。下面我們來看看關于CSS小米商城制作的視頻。

.video-container {
width: 100%;
position: relative;
padding-bottom: 56.25%; /* 16:9 */
height: 0;
}
.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

視頻的寬度為100%，高度為0，這里使用了padding-bottom來撐起高度，具體寬高比例-16:9。視頻使用了iframe標簽來承載，在CSS中進行定位，使得視頻與容器完全對齊，避免了視頻大小發生變化的情況發生。

在小米商城制作過程中，還使用了大量的CSS渲染技巧來提升用戶體驗。這里我們列舉一些常用的技巧：

/* 字體平滑處理 */
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* 移動端字體處理 */
@media screen and (max-width: 320px) {
body {
font-size: 14px;
}
}

使用CSS字體平滑處理技巧，減少字體鋸齒的情況。針對不同設備，根據屏幕的大小，采用不同字體大小，更容易觀看。

/* 圖片在容器中水平垂直居中 */
.container {
position: relative;
}
.container img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

使用CSS技巧使圖片在容器中水平垂直居中，保證作品呈現更美觀。

以上是小米CSS商城制作的視頻和一些常用的CSS技巧，希望對小米商城官網的開發者有所幫助。