行高設定 css .line-height-tight { line-height: 1.25; } .line-height-normal { line-he...
CSS 單位說明 絕對單位範例 css .absolute-units {/*絕對單位 像素(最常用) */ width: 300px; height...
Flexbox是一種一維佈局方式,用來分配空間和對齊項目 核心概念 Flex Container (容器):設定display:flex的父元素 Flex...
方向控制:flex-direction 決定項目的排列方向 水平排列(預設): .flex-row { display: flex;/* 啟用 Fle...
.container { margin: 20px 0; padding: 15px; background-color:...
換行控制:flex-wrap 不換行(預設) css .no-wrap { display: flex; flex-wrap: nowrap; } htm...
靠左對齊(預設) css .justify-start { display: flex; justify-content: flex-start;...
css .container { margin: 15px 0; padding: 10px; background-col...
交叉軸對齊:align-items 控制項目在交叉軸上的對齊方式 拉伸填滿(預設)css .align-stretch { display: flex;...
頂部對齊 css .align-start { display: flex; align-items: flex-start; /*在交叉軸方向(預...