目前日期文章:201406 (2)

瀏覽方式: 標題列表 簡短摘要

Responsive_Design  

RWD(Responsive Web Design)自適應網站的製作方式

首先,你必須先在網站開始的地方加上以下meta語法,用於規定裝置的的結構規則:

     <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
    

其次,需將所有有圖片的地方,加上以下CSS語法,方便圖片按照螢幕寬度的自動縮放:

     img {
          height: auto;
          max-width: 100%;
      }
    

最後在CSS的地方加上以下規則(通常最少我們都分3個尺寸),讓不同寬度大小,給予新的不同CSS規則,就完成了:

文章標籤

英傑銳數位設計 發表在 痞客邦 留言(1) 人氣()

01

什麼是Responsive Web Design (RWD)?

RWD英文全名為:Responsive Web Design
中文名稱為:自適應網頁設計、響應式網頁設計。

簡單的來說,就是讓一個網頁在電腦、智慧型手機、平板上都可以有很好的瀏覽效果。

文章標籤

英傑銳數位設計 發表在 痞客邦 留言(0) 人氣()