hiskio

    超完美CSS設計風格指南

    ★一口氣搞懂Web開發現場應該要懂的CSS相關知識

    Collecting
    US$16.52

    內容簡介


    ★一口氣搞懂Web開發現場應該要懂的CSS相關知識
    ★解決您在開發時遇到的困難
    ★解決團隊協作開發的溝通問題

    隨著前端開發的複雜度增加，出現各種以React、Vue.js 等處理CSS的方法，HTML套用樣式的手法也是五花八門。因此，開發人員肯定會對CSS感到頭大，該怎麼應用CSS？該使用哪種工具才好？

    本書為網站製作和前端開發領域的設計師與開發人員提供了易於理解的CSS設計指引，您可藉由本書學到最新的觀念與CSS方法論，做出符合專案需求的最佳CSS設計。

    作者介紹


    高津戶壯
    曾經參與眾多網站、網頁應用程式的HTML、CSS、JavaScript實作，現主要負責承攬案件的前端相關實作、設計、技術指導，擅長領域包括可擴充性的HTML模板設計與實作、Javascript使用者介面的進階設計與實作。

    目錄


    第1章 關於編寫CSS
    第2章 缺少CSS設計會遇到的困擾
    第3章 先來瞭解BEM
    第4章 BEM的B＝區塊
    第5章 BEM的E＝元素
    第6章 BEM的M＝修飾符
    第7章 BEM的其他內容
    第8章 SMACSS：基礎規範
    第9章 SMACSS：布局規範
    第10章 SMACSS：主題規範
    第11章 功能類別
    第12章 命名空間式前綴詞
    第13章 設計區塊間的留白：前篇
    第14章 區塊間的留白設計：中篇
    第15章 區塊間的留白設計：後篇
    第16章 在專案中應對自如
    第17章 推薦設計指引
    第18章 使用建置製作CSS：不直接使用完成的CSS
    第19章 使用建置製作CSS：Sass
    第20章 使用建置製作CSS：Autoprefixer
    第21章 使用建置製作CSS：PostCSS
    第22章 進階元件：通用型區塊、限定型區塊
    第23章 進階元件：區塊嵌套
    第24章 功能優先

    Content

    • 1-1
      封面頁
    • 1-2
      書名頁
    • 1-3
      序言
    • 1-4
      目錄
    • 1-5
      Ch01 關於編寫CSS
    • 1-6
      編寫CSS 很難嗎？
    • 1-7
      本書討論的內容／不討論的內容
    • 1-8
      CSS 設計
    • 1-9
      Ch02 缺少CSS 設計會遇到的困擾
    • 1-10
      總之先寫再說
    • 1-11
      CSS 方法論
    • 1-12
      Ch03 先來瞭解BEM
    • 1-13
      何謂BEM？
    • 1-14
      何謂元件？
    • 1-15
      為何要介紹BEM？
    • 1-16
      BEM 的粗略概要
    • 1-17
      專欄 BEM 並非僅限定於HTML 和CSS
    • 1-18
      Ch04 BEM 的B ＝區塊
    • 1-19
      劃分區塊的例子
    • 1-20
      何謂區塊？
    • 1-21
      這樣該怎麼決定區塊呢？
    • 1-22
      區塊的編寫方式
    • 1-23
      Ch05 BEM 的E ＝元素
    • 1-24
      何謂元素？
    • 1-25
      元素的編寫方式
    • 1-26
      元素的規範
    • 1-27
      冗長的程式碼
    • 1-28
      1. 防止樣式發生衝突
    • 1-29
      2. 僅由HTML 便可理解設計人員所想的架構
    • 1-30
      3. CSS 選擇器變得相當單純
    • 1-31
      專欄 元素後面不會再加上元素
    • 1-32
      Ch06 BEM 的M ＝修飾符
    • 1-33
      何謂修飾符？
    • 1-34
      區塊的修飾符例子
    • 1-35
      元素的修飾符例子
    • 1-36
      省略寫法①
    • 1-37
      省略寫法②
    • 1-38
      Ch07 BEM 的其他內容
    • 1-39
      怎麼編寫區塊名稱、元素名稱
    • 1-40
      專欄偏好大駝峰式命名法
    • 1-41
      BEM 帶來的好處
    • 1-42
      選擇器的編寫方式
    • 1-43
      區塊的補充內容
    • 1-44
      Ch08 SMACSS：基礎規範
    • 1-45
      SMACSS
    • 1-46
      SMACSS 中的CSS 規範集
    • 1-47
      編寫HTML 和CSS 要先做什麼是？
    • 1-48
      normalize.css
    • 1-49
      Reset CSS
    • 1-50
      設計基礎規範
    • 1-51
      normalize 或者reset
    • 1-52
      以normalize 輕微重置
    • 1-53
      Ch09 SMACSS：布局規範
    • 1-54
      編寫區塊前的準備
    • 1-55
      布局規範的程式碼範例
    • 1-56
      應該使用id 選擇器嗎？
    • 1-57
      定義類似BEM 形式的布局
    • 1-58
      有關小粒度布局的規範
    • 1-59
      Ch10 SMACSS：主題規範
    • 1-60
      具有主題功能的網站
    • 1-61
      主題功能的應用
    • 1-62
      不同語言的樣式調整
    • 1-63
      依照頁面種類調整
    • 1-64
      主題規範與修飾符
    • 1-65
      Ch11 功能類別
    • 1-66
      何謂功能類別
    • 1-67
      功能類別的使用範例
    • 1-68
      !important
    • 1-69
      功能類別的好處
    • 1-70
      功能類別的缺點
    • 1-71
      應該使用功能類別嗎？
    • 1-72
      Ch12 命名空間式前綴詞
    • 1-73
      規範發生衝突
    • 1-74
      迴避規範衝突
    • 1-75
      何謂命名空間式：JavaScript 的情況
    • 1-76
      何謂命名空間式：CSS 的情況
    • 1-77
      怎麼使用命名空間式前綴詞
    • 1-78
      應該使用命名空間式前綴詞嗎？
    • 1-79
      Ch13 設計區塊間的留白：前篇
    • 1-80
      何謂留白的問題？
    • 1-81
      留白設計
    • 1-82
      留白的方向
    • 1-83
      決定留白的變化
    • 1-84
      Ch14 區塊間的留白設計：中篇
    • 1-85
      上方想要設定較多留白的情況
    • 1-86
      表達頁面大致結構的留白設計
    • 1-87
      Ch15 區塊間的留白設計：後篇
    • 1-88
      怎麼在區塊設定留白？
    • 1-89
      實作方法1：對區塊本身設定留白
    • 1-90
      實作方法2：製作留白專用的區塊
    • 1-91
      實作方法3：準備留白用的功能類別
    • 1-92
      專欄 不採用margin 的抵銷
    • 1-93
      決定實作方法的關鍵
    • 1-94
      不需要考慮區塊間留白的情況
    • 1-95
      Ch16 在專案中應對自如
    • 1-96
      只要有技術就行了嗎？
    • 1-97
      為何不能夠單獨一人？
    • 1-98
      編寫HTML 和CSS 時的難處
    • 1-99
      Atomic Design
    • 1-100
      即便採用瀑布式開發
    • 1-101
      Ch17 推薦設計指引
    • 1-102
      何謂設計指引？
    • 1-103
      設計指引的內容與意義
    • 1-104
      程式碼的規範
    • 1-105
      超簡易的元件清單
    • 1-106
      元件清單有什麼用處？
    • 1-107
      以元件清單為前提的編寫流程
    • 1-108
      維護元件清單
    • 1-109
      進階設計指引
    • 1-110
      Ch18 使用建置製作CSS：不直接使用完成的CSS
    • 1-111
      何謂建置？
    • 1-112
      壓縮（minify）
    • 1-113
      嘗試壓縮手邊的檔案
    • 1-114
      各種建置處理
    • 1-115
      Ch19 使用建置製作CSS：Sass
    • 1-116
      何謂Sass ？
    • 1-117
      內嵌選擇器
    • 1-118
      進階&（Parent Selector）
    • 1-119
      變數
    • 1-120
      mixin
    • 1-121
      轉換Sass 的程式碼
    • 1-122
      專欄 SCSS syntax 還是Sass syntax ？
    • 1-123
      使用應用程式來建置
    • 1-124
      有助於CSS 設計的Sass
    • 1-125
      與Sass 的交流方式
    • 1-126
      Ch20 使用建置製作CSS：Autoprefixer
    • 1-127
      Can I use
    • 1-128
      Vendor Prefix
    • 1-129
      輪到Autoprefixer 出場
    • 1-130
      應該使用Autoprefixer 嗎？
    • 1-131
      Ch21 使用建置製作CSS：PostCSS
    • 1-132
      何謂PostCSS ？
    • 1-133
      插件
    • 1-134
      常用的方式
    • 1-135
      應該使用PostCSS 嗎？
    • 1-136
      Ch22 進階元件：通用型區塊、限定型區塊
    • 1-137
      該取什麼名稱呢？
    • 1-138
      通用型還是限定型？
    • 1-139
      通用型名稱的優點
    • 1-140
      通用型名稱的缺點
    • 1-141
      究竟該怎麼辦？
    • 1-142
      Enduring CSS
    • 1-143
      Ch23 進階元件：區塊嵌套
    • 1-144
      何謂區塊嵌套？
    • 1-145
      區塊嵌套的優缺點
    • 1-146
      應該作成嵌套區塊嗎？
    • 1-147
      作不作成區塊嵌套的範例
    • 1-148
      Ch24 功能優先
    • 1-149
      功能優先的思維
    • 1-150
      僅使用功能類別的範例
    • 1-151
      功能優先的特徵
    • 1-152
      HTML 和CSS 幾乎沒有元件
    • 1-153
      Tailwind CSS 中的元件
    • 1-154
      一定要使用React、Vue.js 嗎？
    • 1-155
      粒度更細微的抽象化
    • 1-156
      是否應該導入功能優先的設計？
    • 1-157
      結語
    • 1-158
      索引
    • 1-159
      版權頁
    • 1-160
      封底頁

    FAQ

    您可以透過手機、平板或是電腦登入 HiSKIO 平台，在【我的學習】＞【我的書籍】頁面，選擇想看的電子書。

    Recommendations

    Reviews

    | Collecting

    Sales Plans