上集回顧：
昨天講了頁面如何根據不同的裝置尺寸做出響應。主要是利用了@media命令以及尺寸百分比化這兩招。
上集補充：
img, object這一語句一般加在@media screen and (max-width:481)的判斷內，主要是讓手機使用者在檢視網頁時不至於比手機螢幕還大。
這一招在《head first moblie web》中被稱為「fluid image technique」。
如，舊的頁面巢狀**段為：
<將其替換為：object
width
="230"
height
="179"
type
data
="v/o-joeaufdq4?fs=1&h1=en_us&rel=0"
>
<
embed
src=...
/>
object
>
<土豆：iframe
src="embed/o-joeaufdq4"
style
="max-width:100%"
>
iframe
>
<sina：embed
src="....swf"
type
allowscriptaccess
="always"
allowfullscreen
="true"
wmode
="opaque"
width
="480"
height
="400"
>
embed
>
<兩者的引數設定也差不多，不過土豆的**要簡潔很多。div><
object
id='sinaplayer'
width
='480'
height
='370'
>
<
param
name
='allowscriptaccess'
value
='always'
/>
<
embed
pluginspage
=''
src='....swf'
type
allowscriptaccess
='always'
allowfullscreen
='true'
name
='sinaplayer'
width
='480'
height
='370'
>
embed
>
object
>
div>
（這是哦……）
這樣顯然是不能接受的。
）。製作整個效果沒有什麼新的技巧，也就是將css的尺寸判斷又兩種變成了三種而已。具體的可以看演示**。
總結：
最後拿乙個書中的公式收尾吧
rwd =fluid-grid layouts + css media queries + fluid image/media + a state of mind
大意是響應式設計 = 流式網格布局 + @media語句 + 流式/** + 設計者的意識
下集預告：
移動裝置限於頻寬、網速和運算晶元的處理速度，對網頁的效能要求要高於桌面網頁，那麼該怎麼辦呢？如何測試我們頁面的效能？如何設計才能有更好的效能讓移動裝置瀏覽起來更為流暢呢？
響應式web設計
initial scale 1.0 script 不使用width px 只使用百分比寬度width xx 或者width auto 字型也不能使用絕對大小 px 而只能使用相對大小 em 如 font normal 100 helvetica,arial,sans serif 字型大小是頁面預設大...
響應式web設計
響應式網頁設計是時下網頁設計領域最熱門的話題之一，該概念由著名網頁設計師 ethan marcotte 在2010年5月份提出，其目標是要讓設計的 能夠響應使用者的行為，根據不同終端裝置自動調整尺寸。簡而言之，就是乙個 能夠相容多個終端 而不是為每個終端做乙個特定的版本。那麼，怎麼實現響應式設計呢？...
響應式Web設計
設計師熟知的在印刷 的控制功能，常常也會期望web 會有，但是他們僅僅限制在列印出來的頁面上才能使用。我們必須接受這樣的事實 web根本沒有同樣的限制和為這樣的彈性準備的設計。但是首先我們必須接受這種落差和流程。英國建築師christopher wren有一次開玩笑說他選擇了乙個 以永恆為目標 的領...