GAP：超簡單設定區塊間隔

.gap{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:20px;
}

Smooth Scrolling：實現不需JS、純css就可做到的錨點滑動

務必要在html先設定好物件id及指向該物件id的href：

接著就只要在你的css寫上就可以了！！

html{
    scroll-behavior: smooth;
}

Scroll Snapping：讓左右滑動的區塊貼齊邊邊

此css設定的是當你的滑動是有區塊性的時候，css可以幫你自動貼齊每個區塊的邊邊。例如像以下這樣：

html寫法大概會長這樣：

css首先要設定每塊的寬高、顯示方式則是flex，並且左右超出時設定為x軸滾動，其次放這些容器的視窗（div）要設定最小寬度（跟容器寬度一樣）：

接著區塊的css加上一行

.container{
    scroll-snap-type: x mandatory;
}

.container div{
    scroll-snap-align: center;
}

Truncate：限制文字顯示行數

例如這樣的區塊：

讓他改成內文指顯示三行只要寫

.box p{
    display:-webkit-box;
    -webkit-line-clamp:3; /*顯示行數*/
    -webkit-box-orient:vertical;
    overflow:hidden;
}

就會變成這樣：