BS5來練習beefree

 原本想要beefree製作網頁，是可以的，但要修改樣式CSS時，需要每頁都去修改，所以還是用BS5來改會比較快。下面是步驟，給它紀錄下來。

之前有一篇利用Gsheet當小型資料庫，隔了一段時間，有點看不懂，所以要再加強自己的寫作能力。

• 用DW建立php。
• 去BS5的get_start，複製基本CSS、JS。
• 感謝ㄙㄩ分享Flex、Grid。順便跟著做一下。
• 建立header.php，去navbar 複製CODE，修改一下。
  
  遇到問題，文字會自動斷行，ithome有人手刻選單，但沒有漢堡。
  這個人跟我一樣，終於解決了。強制不換行，請加入下方樣式：a {  white-space: nowrap;}
  
  
• 漢堡選單遇到多寬的螢幕時就變化，在nav那邊設定，sm、md、lg。
  我是額外有加下面的螢幕變化，要慢慢測。
  "@media (max-width: 1187px)"  選單的字變小一點(會超出畫面)
  "@media (max-width: 820px)" iPad mini 的畫面，選單字變小，LOGO寬度變77%
  
  感謝架站盒子分享讓DIV寬度自適。ez2o分享垂直置中。
  之後要處理，但nav-brand都無法改變寬度@
  
  
• 試試看選單不要變成漢堡，直接隨著螢幕往下排。
  先給row ( col-sm-3 圖片，col-sm-9 選單)。
  選單改成 nav 就好，就可以隨著縮放往下排。
  
  
• 圖片問題，
  圖片要置中。要設定上一層的屬性，text-align:center;
  圖片很大，要適合sm-col-4。圖片那邊增加  class="img-fluid" 嵌入Youbube也要自動調整。div.YT{position: relative; width:100%; height:56.25%; } YT.iframe{ position:absolute; width:100%; height:100%; }