iT邦幫忙

鐵人檔案

第 12 屆 iT 邦幫忙鐵人賽
回列表
Modern Web

30天CSS&Bootstrap排版統整 系列

實驗室椅子被拿走了 咩噗

鐵人鍊成 | 共 30 篇文章 | 8 人訂閱 訂閱系列文 RSS系列文 團隊nutc imac 惠靈頓牛排
DAY 21

Day21--Bootstrap Flex使用(10)

設置.align-content-*可定義flex items在flex容器的縱軸方向上的對齊方式,使用上與Day15說過的.align-items-*有相同...

2020-10-06 ‧ 由 zxc29019009 分享
DAY 22

Day22--Bootstrap Navbar&Dropdown合併使用

範例 html,body{ height: 100%; } .custom_fi...

2020-10-07 ‧ 由 zxc29019009 分享
DAY 23

Day23--Bootstrap&CSS文字排版&樣式(1)

對元素設置.text-left可向左對齊。 <p class="p-1 border border-danger text-left&quo...

2020-10-08 ‧ 由 zxc29019009 分享
DAY 24

Day24--Bootstrap&CSS文字排版&樣式(2)

對元素設置word-break:normal可根據瀏覽器預設來換行(通常會保留完整單詞)。 <p class="p-1 border bor...

2020-10-09 ‧ 由 zxc29019009 分享
DAY 25

Day25--Bootstrap&CSS文字排版&樣式(3)

對元素設置word-wrap:normal可根據瀏覽器預設來拆行(通常是當一單詞超過容器寬度時,保留完整單詞)。 <div class="c...

2020-10-10 ‧ 由 zxc29019009 分享
DAY 26

Day26--Bootstrap&CSS文字排版&樣式(4)

對元素設置white-space:normal可將連續空白字元合併成一個,在超過容器寬度時或碰到<br>標籤時會換行。 <p class=...

2020-10-11 ‧ 由 zxc29019009 分享
DAY 27

Day27--Bootstrap&CSS文字排版&樣式(5)

對元素設置.text-lowercase可將所有英文字母轉為小寫。 <p class="p-1 border border-danger t...

2020-10-12 ‧ 由 zxc29019009 分享
DAY 28

Day28--Bootstrap&CSS文字排版&樣式(6)

對元素設置.font-weight-normal可以讓文字和符號以預設呈現。 <p class="p-1 border border-dan...

2020-10-13 ‧ 由 zxc29019009 分享
DAY 29

Day29--Bootstrap&CSS文字排版&樣式(7)

對元素設置user-select-all可在點擊時全選該文本。 <p class="p-1 border border-danger use...

2020-10-14 ‧ 由 zxc29019009 分享
DAY 30

Day30--Bootstrap&CSS文字排版&樣式(8)

對元素設置.text-monospace可將字體轉為等寬體(中文字寬度沒什麼差,英文字有些寬度差很多,可能會造成排版困擾)。 <p class=&qu...

2020-10-15 ‧ 由 zxc29019009 分享