2017-08-07

學習fis3語法.

• 命令：
  
  • -d destination 構建釋出到的目標檔案
  • -r run 執行
  • -w watch 監視
• 配置檔案：
  
  • fis.match(selector, props) 匹配檔案路徑，設定編譯規則屬性
  • fis.media() 介面提供多種狀態功能（開發環境、生產環境、scss）
• 外掛(parser)：
  
  • fis-parser-node-sass sass/scss 編譯成 css
  • fis-parser-babel-5.x jsx/es6/es7編譯成es5
  • fis3-parser-typescript typescript/es6/jsx 編譯成 js。速度相比babel略快，但是 es7 跟進較慢
  • fis-parser-less-2.x less 編譯成 css
• 壓縮(optimizer)：
  
  • fis.plugin(‘uglify-js’) 壓縮js
  • fis.plugin(‘clean-css’) 壓縮css
  • fis.plugin(‘png-compressor’) 壓縮圖片
  • fis.plugin(‘html-strip’) 壓縮html

2017-08-08

問題：彈性佈局中flex-grow屬性的作用
解決：檢視資料瞭解了flex-grow和flex-shrink的區別
flex-grow 屬性決定了父元素在空間分配方向上還有剩餘空間時，如何分配這些剩餘空間。其值為一個權重（也稱擴張因子），預設為 0（純數值，無單位），剩餘空間將會按照這個權重來分配。
flex-shrink 屬性定義空間不夠時各個元素如何收縮。其值預設為 1。

2017-08-16

1. 問題：谷歌瀏覽器不識別12px以下的字型大小（10px）
   解決：（1）設定-webkit-transform:scale(0.83)，按比例縮小字型。但是標籤左右會因縮小產生空白間隙，導致無法向左或者向右對齊（使用transform:scale(0.83)時; 不僅是文字變小了，整個文字所在的容器也同時會變小）;
   （2）-webkit-text-size-adjust:none;（取消瀏覽器最小字型限制），但是隻對英文才有效，對中文無效。在新版的chrome中，已經禁止了改屬性，只對chrome27.0 版本以下有效，27.0以上版本無效。
   設定字型大小為10px,在瀏覽器模擬器上無法識別，但在真機上不會出現問題。
   
   1. 問題：父盒子使用 display:-webkit-box; 佈局，子盒子使用 -webkit-box-flex: 1; 等比例分欄，當給其中一個子盒子設定padding或者margin時，會改變子盒子的盒模型大小。
      解決：根據情況按等比例使子盒子分欄。例如：分兩欄，則給兩個子盒子分別設定：width:50%; 在這種情況下不會改變子盒子的盒模型大小。

2017-08-21

問題：iPhone5下的“投資明細”頁面左欄圓圈tag變形。
解決：主要是由於給圓圈設定的border寬度為rem單位，因此導致想螢幕下的border自適應螢幕之後變得特別小，然後變形。使用px為單位就可以解決問題了。在以後的開發中，類似於border寬度的，都應該使用px固定單位，而不用rem作為單位。

2017-08-28

熟悉狀態碼304：重定向，資源有快取
自從上次請求後，請求的網頁未修改過。伺服器返回此響應時，不會返回網頁內容。
如果網頁自請求者上次請求後再也沒有更改過，您應將伺服器配置為返回此響應（稱為 If-Modified-Since HTTP 標頭）。伺服器可以告訴 Googlebot 自從上次抓取後網頁沒有變更，進而節省頻寬和開銷。

2017-08-30

4 . 瞭解location物件的一些屬性和方法
* 屬性：
+ hash 設定或返回從井號 (#) 開始的 URL（錨）。
+ host 設定或返回主機名和當前 URL 的埠號。
+ hostname 設定或返回當前 URL 的主機名。
+ href 設定或返回完整的 URL。
+ pathname 設定或返回當前 URL 的路徑部分。
+ port 設定或返回當前 URL 的埠號。
+ protocol 設定或返回當前 URL 的協議。
+ search 設定或返回從問號 (?) 開始的 URL（查詢部分）。
* 方法：
+ assign() 載入新的文件。
+ reload() 重新載入當前文件。
+ replace() 用新的文件替換當前文件。