在淘寶店鋪中，美工css的應用非常廣泛。而在代碼實現中，我們可以使用css生成器來快速進行排版設計和樣式設置。

/* 以下為常見的css樣式代碼 */
/* 1. 字體顏色和字號 */
.color {
color: #333;
font-size: 14px;
}
/* 2. 邊框和背景顏色 */
.border {
border: 1px solid #ccc;
background-color: #fff;
}
/* 3. 文字居中 */
.center {
text-align: center;
}
/* 4. 文字加粗 */
.bold {
font-weight: bold;
}
/* 5. 圖片居中 */
.img-center {
display: block;
margin: 0 auto;
}
/* 6. 行內元素居中 */
.inline-center {
text-align: center;
}
/* 7. 無序列表樣式 */
.list {
list-style: none;
padding: 0;
margin: 0;
}
/* 8. 清除浮動 */
.clearfix:after {
display: block;
clear: both;
content: "";
visibility: hidden;
height: 0;
}
.clearfix {
display: inline-block;
}
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
/* 9. 鼠標懸停變色 */
.hover-color:hover {
color: #f00;
}
/* 10. 鼠標懸停動畫效果 */
.hover-animate:hover {
animation: 0.5s ease-out 0s 1 normal none running my-animation;
-webkit-animation: 0.5s ease-out 0s 1 normal none running my-animation;
}
/* 11. 圖片漸變動畫效果 */
.fade-in {
opacity: 0;
visibility: hidden;
transition: opacity 0.5s ease-in-out 0s, visibility 0.5s ease-in-out 0s;
}
.fade-in.on {
opacity: 1;
visibility: visible;
}
.fade-in.animate {
transition: opacity 0.5s ease-in-out 0s;
}

以上是常用的css樣式代碼，可以通過不同的組合和調整，實現豐富的頁面效果。同時，也可以通過引入第三方框架和組件，進一步豐富淘寶店鋪的用戶體驗。