Media Query

[CSS] 彈性化的 Media Query

好像是該來交點作業,不然部落格都快壞掉了(甚至熊熊想不起來 Octporess 要怎麼 deploy 到 Heroku 上 原先是想說要先寫一點 Media Query Level 4 的介紹,不過因為還沒有玩膩所以就先不要寫了(欸,由於寫文章的時候剛好是自己生日,所以,就先祝自己生日快樂。 然後我們聊一下彈性的 Media Query。 前言 導讀, [http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/](The EMs have

Media Query

[CSS3] 深入 @viewport 與 @media queries

說在最前面,這是要詳細交代這兩件事情的關係,不過由於目前 CSS Device Adaptation 還在草稿(W3C Working Draft)階段,所以以後或許還是會有變化。 這是很悶的詳細解釋文,所以理論上可以跳過。 @viewport and @media 還是一個重點, @media depends on @viewport size. 但是由於 @viewport 這件事情,雖然他有許多設定可以用,但是預設值是相當討厭的。以目前的規範來看, <viewport-length> = auto

Media Query

[CSS] 淺談 @viewport 與 @media

由於最近剛好遇到這件事情,索性整理一下。一般來說 viewport 大多數人會想到 Media Query 這件事情,但是,我覺得還是有必要澄清一下。其實 viewport 跟 Media Query 並沒有太大或是絕對的相依關係,只是由於裝置與一些規則應用上的關係,讓人覺得這兩件事情好像是可以擺在一起看的。 實際上不是。 何謂 viewport 根據 w3c 對於 CSS Device Adaptation 的解釋,他大致上是在做這些事情, 根據裝置的顯示區域來展示文件 放大或縮小文件,來符合或設定上給予裝置的可視區域 允許設定或初始化縮放的級別,