【css-war】想改版不是一天兩天,但切版怎樣都要一天切完d(d'∀')

》不然會焦慮得睡不著_(:3 」∠ )_
》切得眼睛好酸心好累
》但是切完心情超爽ヽ(́◕◞౪◟◕‵)ノ



因為老媽要睡覺了得把沙發還她,總之這次改版的行程就是依照之前在公司的經驗
  1. 在以拉(illustrator)排完圖面稿
  2. 開啟blogger+F12試著更動css
  3. 確定能改之後回以拉開始存需要的bg+圖示
  4. 打開blogger開始與HTML&CSS混戰(o゚ロ゚)┌┛Σ(ノ´*ω*`)ノ

先丟一下圖面稿。

※註:因為節省檔案容量存png8的格式,所以圖中漸層看起來會跳階(*顏色無法平滑、一格一格的)
因為資料庫我還沒學,所以無法解決將最底下那條快速連結copy一份到文章上方的方法,有嘗試弄了一下(快一個小時)不過一直發生資料庫錯誤XDDdiv是成功地塞進去了啦,偏偏上一頁、下一頁一定要撈資料,後來就先拿掉了。
不過我怎麼會死心呢,過幾天再試試(o´・ω・`)σ)Д`)

然後是感謝工程師大大+估狗
我家哀鳳舞終於可以直接看到320版的re-size啦。゚ヽ(゚´Д`)ノ゚。
終於可以不用再屈就估狗那沒有行距的手機版了啊。゚ヽ(゚´Д`)ノ゚。

(什麼都可以沒有不可以沒有行距的人

▼ 以下是手機截圖(*´∀`)~♥


▼ 320的大金魚看起來超可怕XDDD




說到這裡,應該很多人都和去年的我一樣不知道自適應網頁是啥。
如果不知道是啥,現在就開始拖拉你的瀏覽器縮放試試吧σ`∀´)σ
寬度小於830以下,左邊的選單就會收掉,然後文章也會配合瀏覽器變大~變小~

而這一切,只要靠css(外加一行宣告)就可以搞定哦(*´∀`)~♥
有興趣也歡迎一起討論//

留言

  1. 新版面新版面!
    手機板小巧的好可愛!然後羊咩咩大頭照現在放在這個位置特別想戳(?)

    回覆刪除
    回覆
    1. 雖然說....戳了也什麼都不會發生(笑)
      手機版其實也是用電腦版,所以把電腦視窗縮小到320,看起來就和手機版一樣囉>_o

      刪除

張貼留言

▼ 留言時,您可以使用粗體<B>斜體<I>和連結<A>三種語法!