在前端開發領域中，CSS是非常重要的一項技能。而在CSS中，使用CSS3新增的配件技能可以讓頁面設計更加炫酷、富有創意，提高用戶體驗。

/*以下為CSS3新增的配件技能*/
/*1. 倒影*/
.box {
position: relative;
}
.box::after {
content: "";
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 50%;
background: linear-gradient(
to bottom, 
rgba(255, 255, 255, 0.8),
rgba(255, 255, 255, 0)
);
transform: scaleY(-1);
}
/*2. 動畫*/
@keyframes shake {
0% {
transform: rotate(0);
}
50% {
transform: rotate(10deg);
}
100% {
transform: rotate(0);
}
}
.box {
animation: shake 0.5s infinite;
}
/*3. 多列布局*/
.container {
display: grid;
grid-template-columns: 1fr 2fr 1fr;
grid-template-rows: auto;
grid-column-gap: 20px;
grid-row-gap: 10px;
}
/*4. 媒體查詢*/
@media screen and (min-width: 720px) {
.box {
font-size: 24px;
}
}

以上便是CSS3新增的配件技能的部分代碼，可以將其應用于不同的項目中，實現不同的效果。