在home的資料夾下，在建立乙個資料夾components，裡面存放著home所要用的元件
我們現在要做的就是header元件
我們需要在home.vue下面 匯入我們要用的小組件的包，然後在export default中引用components：
然後編寫home-header元件
這裡關於css樣式rem是什麼
rem（font size of the root element）是指相對於根元素的字型大小的單位。簡單的說它就是乙個相對單位。看到rem大家一定會想起em單位，em（font size of the element）是指相對于父元素的字型大小的單位。它們之間其實很相似，只不過乙個計算的規則是依賴根元素乙個是依賴父元素計算。
上面說過rem是通過根元素進行適配的，網頁中的根元素指的是html我們通過設定html的字型大小就可以控制rem的大小。舉個例子：
html
.btn
上面的width，height變成了上面結果的兩倍，我們只改變了html的font-size，但.btn樣式的width,height的rem設定的屬性不變的情況下就改變了按鈕在web中的大小。
其實從上面兩個案例中我們就可以計算出1px多少rem:
第乙個例子：
120px = 6rem * 20px(根元素設定大值)
第二個例子：
240px = 6rem * 40px(根元素設定大值)
推算出：
10px = 1rem 在根元素（font-size = 10px的時候）；
20px = 1rem 在根元素（font-size = 20px的時候）；
40px = 1rem 在根元素（font-size = 40px的時候）；
在本例項中，我們採取的是font-size 50px
由於css我學術不精，主要會涉及到很多關於css的問題
float屬性
float 屬性定義元素在哪個方向浮動。以往這個屬性總應用於影象，使文字圍繞在影象周圍，不過在 css 中，任何元素都可以浮動。浮動元素會生成乙個塊級框，而不論它本身是何種元素。
如果浮動非替換元素，則要指定乙個明確的寬度；否則，它們會盡可能地窄。
flex屬性
flex 屬性用於設定或檢索彈性盒模型物件的子元素如何分配空間。
flex 屬性是 flex-grow、flex-shrink 和 flex-basis 屬性的簡寫屬性。
注意：如果元素不是彈性盒模型物件的子元素，則 flex 屬性不起作用。
怎麼讓div的元素在一條橫線上，很簡單加float
浮動就好了 每個元素都 float:left;就在一條橫線上了！~
插播一條響應式布局
響應式布局是ethan marcotte在2023年5月份提出的乙個概念，簡而言之，就是乙個**能夠相容多個終端——而不是為每個終端做乙個特定的版本。這個概念是為解決移動網際網路瀏覽而誕生的。
響應式布局可以為不同終端的使用者提供更加舒適的介面和更好的使用者體驗，而且隨著目前大螢幕移動裝置的普及，用「大勢所趨」來形容也不為過。隨著越來越多的設計師採用這個技術，我們不僅看到很多的創新，還看到了一些成形的模式。
display屬性中的flex
前端布局神器display:flex
2023年，w3c提出了一種新的方案–flex布局，可以簡便、完整、響應式地實現各種頁面布局。目前已得到所有現在瀏覽器的支援。
flex布局是什麼
flex是flexible box的縮寫，翻譯成中文就是「彈性盒子」，用來為盒裝模型提供最大的靈活性。任何乙個容器都可以指定為flex布局。
所以在本例項中div class=header就相當於乙個彈性盒子
包含了三個left right input 三個div
基本概念
採用flex布局的元素，被稱為flex容器(flex container)，簡稱「容器」。其所有子元素自動成為容器成員，成為flex專案(flex item)，簡稱「專案」。
text-align 屬性規定元素中的文字的水平對齊方式。
該屬性通過指定行框與哪個點對齊，從而設定塊級元素內文字的水平對齊方式。通過允許使用者**調整行內容中字母和字之間的間隔，可以支援值 justify；不同使用者**可能會得到不同的結果。
Vue 在Vue中快速使用ElementUI
最近使用vue，順道使用elementui，在vue專案中音容elementui的方法 idea開啟termianl，在vue專案中使用npm安裝 1.安裝 npm install element ui s2.引入 1 整體引入 在專案的main.js中寫入 import elementui fro...
Vue中的 vue檔案的使用
需要安裝vue loader npm i vue loader vue template complier d 然後在配置檔案中新增匹配規則 template 這裡定義js 在這裡匯入檔案 import vue from vue export default methods script style...
vue 引用src中的檔案 VUE中引用路徑的配置
在vue專案開發中經常引用js css img檔案。當專案較大時檔案層級很多，導致路徑很長，我們可以通過在bulid webpack.base.conf.js 設定簡便的引用路徑 一 引用assets目錄下的檔案 舉例 1 在src components content content.vue 中引...