第一章 概述

第一章 概述

1. CSS世界的「世界觀」

   將抽象的CSS直接和具體的現實世界相對應

2. 世界都是創造出來的

   1. CSS世界的誕生就是爲圖文信息展現服務的。

3. CSS完勝SVG的武器-流

   • SVG的強項是圖形，SVG：矢量圖形
   1. 何爲「流」
      1. 「流」其實是CSS世界中的一種基本的定位和佈局機制，能夠理解爲現實世界的一套物理規則，「流」跟現實世界的「水流」有殊途同歸的表現。
      2. div和span分別是塊級元素和內聯級元素的表明，特性如現實世界的水和木頭。
   2. 「流」是如何影響整個CSS世界的
      1. 文檔流通常是從左至右自上而下的，可是能夠經過一些方式去改變流向，因此說這種說法是不嚴謹的
   3. 什麼是流體佈局
      1. 所謂「流體佈局」指的是利用元素「流」的特性實現的各種佈局效果。
      2. 由於「流「自己具備自適應特性，因此」流體佈局「每每都是自適應性的。
      3. 可是流體佈局不等同於」自適應佈局「。
      4. 」自適應佈局「是對凡是具備自適應特性的一類佈局的統稱，」流體佈局「要狹窄的多
      5. 如：表格佈局也能夠設置爲100%自適應的，但表格和」流「不是一路的，並不屬於」流體佈局「。
      6. div是典型的具備」流「特性的元素，所以，曾經風靡的"div+css佈局"，實際上值得就是這裏的」流體佈局「

4. CSS世界的開啓從IE8開始

   1. 本書主講的是CSS2.1

5. table本身的世界

   1. table不屬於」流「 的世界

6. CSS新的世界--CSS3

   1. 佈局更爲豐富

      1. 彈性盒子佈局(flexible box layout)
      2. 格柵佈局(grid layout)

   2. 視覺表現長足進步

      1. 圓角。陰影和漸變讓元素更有質感
      2. transform變換讓元屬有更多的可能
      3. filter濾鏡和混合模式讓web輕鬆變成在線的photoshop:
      4. animation讓動畫變的更簡單