本文關鍵詞：響應式Web設計：HTML5和CSS3實戰(zhàn)，由筆耕文化傳播整理發(fā)布。

響應式Web設計：HTML5和CSS3實戰(zhàn)

作者：Ben Frain

分類：科技 互聯網 計算機技術

豆瓣評分：

簡介：

隨著iPad mini的發(fā)布，又一個新的屏幕尺寸誕生了。用不著全面統(tǒng)計，你就會發(fā)現移動互聯網時代眾多的屏幕規(guī)格，從智能手機的3、4、5英寸，到平板電腦的7、8、9、10英寸，再到筆記本和臺式機的13至30英寸，絕非目前單一的固定或流式布局所能應付。于是，響應式設計應運而生，而且它也將成為移動互聯網時代前端設計與開發(fā)人員的一門必修課。

本書堪稱學習響應式Web設計的難得佳作。它不僅全面、細致、圖文并茂地介紹了響應式設計相關的技術，比如媒體查詢、流式布局、彈性媒體和彈性字體等，還把近幾年來Web設計領域公認的最佳設計理念有機地融入到了實例當中，比如移動先行（Mobile First）、漸進增強、平穩(wěn)退化、無障礙設計等。更加難得的是，本書以設計跨屏幕的網頁（響應式設計）為出發(fā)點，以點帶面，把如今Web設計領域兩大標準的最新版本HTML5和CSS3也納入其中，讀者在掌握先進設計方法的同時也能掌握最新的設計技術（比如使用新的HTML5結構化語義標記、嵌入媒體、響應式視頻，以及CSS3的新選擇器、特效、過渡、變形和動畫等），從而可以免除重復學習新標準之苦，讓自己一步跨入Web設計領域的最前沿。無論你想學習響應式Web設計，還是學習HTML5和CSS3的實際應用，本書都能滿足你的需要，是毋庸置疑的明智之選。

說到底，，響應式Web設計并非一門獨立的技術，而只是現有技術的一個組合應用。只要有一點HTML和CSS基礎的讀者都能順利地掌握它。對于中、高級的前端設計和開發(fā)人員，翻閱本書也有助于理清自己的知識脈絡，對這個新的設計理念獲得更全面、深入的理解和把握。

下載

注：如果下載失敗，請聯系小編，微信或QQ：2338856113

作者簡介

Ben Frain是一名具有十多年經驗的網頁設計師和前端工程師，直接與世界各地的客戶和設計機構并肩工作。同時他還是一名技術記者，定期為一些關注Mac平臺、前沿科技、網頁設計和航空技術的刊物撰稿。

在此之前，他曾是一名懷才不遇的（而且謙虛謹慎的）電視演員，畢業(yè)于索爾福德大學的媒體與表演專業(yè)。他寫了四部（自認為）同樣被低估的劇本，而且始終心懷能賣出一部的信念（盡管不像最初那么強烈了）。

工作之余，在身體（和妻子）允許的情況下，他喜歡玩室內足球。

目錄

第1章 　HTML5、CSS3及響應式設計入門　　1

1.1 　為什么智能手機很重要（而老版的IE不再重要）　　2

1.2 　響應式設計一定是最佳選擇嗎　　3

1.3 　響應式網頁設計的定義　　3

1.4 　為什么要在響應式設計上停滯不前　　4

1.5 　響應式網頁設計示例　　4

1.5.1 　下載視口調試工具　　4

1.5.2 　在線創(chuàng)意源泉　　11

1.6 　為什么HTML5很優(yōu)秀　　12

1.6.1 　省時省力　　12

1.6.2 　新增了語義化標簽元素　　13

1.7 　CSS3為響應式設計和更多創(chuàng)新奠定了基礎　　13

1.7.1 　底線：CSS3不破壞任何東西　　14

1.7.2 　CSS3如何解決日常設計問題　　14

1.8 　看吶，不用圖片　　17

1.9 　HTML5和CSS3現在就能用嗎　　20

1.10 　響應式網頁設計不是靈丹妙藥　　20

1.11 　引導客戶：網站不必在所有瀏覽器中表現一致　　21

1.12 　小結　　22

第2章 　媒體查詢：支持不同的視口　　23

2.1 　現在就能使用媒體查詢　　23

2.2 　為什么響應式設計需要媒體查詢　　24

2.2.1 　媒體查詢語法　　24

2.2.2 　 媒體查詢能檢測那些特性　　26

2.2.3 　用媒體查詢改造我們的設計　　27

2.2.4 　加載媒體查詢的最佳方法　　27

2.3 　我們的第一個響應式設計　　27

2.3.1 　我們的設計是固定寬度的，不要驚訝　　28

2.3.2 　響應式設計中要保證圖片盡可能精簡　　32

2.3.3 　小視口下的內容剪切　　33

2.4 　阻止移動瀏覽器自動調整頁面大小　　34

2.5 　針對不同視口寬度修正設計　　37

2.6 　響應式設計中內容始終優(yōu)先　　38

2.7 　媒體查詢只是必要條件之一　　42

2.8 　小結　　42

第3章 　擁抱流式布局　　43

3.1 　固定布局經不起未來考驗　　43

3.2 　為什么響應式設計需要百分比布局　　44

3.3 　將網頁從固定布局修改為百分比布局　　44

3.3.1 　需要牢記的公式　　45

3.3.2 　設置百分比元素的上下文　　47

3.3.3 　必須時刻牢記上下文　　52

3.4 　用em替換px　　54

3.5 　彈性圖片　　56

3.5.1 　讓圖片隨視口縮放　　56

3.5.2 　為特定圖片指定特定規(guī)則　　58

3.5.3 　給彈性圖片設置閾值　　59

3.5.4 　超級全能的max-width屬性　　61

3.6 　為不同的屏幕尺寸提供不同的圖片　　61

3.7 　流動網格布局和媒體查詢的默契配合　　66

3.8 　CSS網格系統(tǒng)　　66

3.9 　小結　　72

第4章 　響應式設計中的HTML5　　73

4.1 　HTML5的哪些部分現在就能用　　73

4.1.1 　大多數網站可以用HTML5編寫　　74

4.1.2 　膩子腳本和Modernizr　　74

4.2 　如何編寫HTML5網頁　　75

4.2.1 　HTML5的精簡之道　　76

4.2.2 　HTML5標簽的合理寫法　　76

4.2.3 　偉大的

  本文關鍵詞：響應式Web設計：HTML5和CSS3實戰(zhàn)，由筆耕文化傳播整理發(fā)布。