花了點時間把主頁的code重新整理了一下，刪除了不必要的部分函數(shù)浪感，現(xiàn)在背景可以正確的隨著分辨率大小縮放了吼和。 并且將data()內(nèi)的Css內(nèi)容挪到了下方的<scrpit>下拉鹃，這樣審查元素時看起來的界面會更正解一些擎值，并且避免了不必要的維護(hù)麻煩慌烧。
本篇講一講重新整理代碼過程中Vue-typer的使用以及div的規(guī)劃。
首先講一講我的居中頭像div在頁面上的定位：我的想法是講這個div居中放在背景頁面上鸠儿，盡管上一篇文章并沒有提到這個問題---因為頭像確實是居中放置在了頁面上屹蚊，但是后來發(fā)現(xiàn)居中的不是頭像的div，而是頭像本身。這就導(dǎo)致我沒有辦法在頭像下方添加其他我想要添加的元素：以段落元素<p>為例淑翼，他會被頭像覆蓋，并且div的大小也顯得非常不自然---
修改前
解決方法：對這個div使用絕對布局,強制使他居中品追。
<script>
.Avatar{
text-align: center;
border-radius: 20px;
width: 300px;
height: 350px;
margin: auto;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
</scrpit>
修改后
之后為了讓主頁效果看起來更好一點玄括，在這里我使用了Vue-Typer，引用方法很簡單肉瓦，這里不談了遭京。在div.Avatar下創(chuàng)建一個新的div容器，使它與上方的頭像容器區(qū)分開來:
<div>
<h1>
<vue-typer :text='Info' :type-delay='250'></vue-typer>
</h1>
</div>
.....
#在data()內(nèi)給Info賦值
#Info為數(shù)組類型泞莉，可以在里面放多個值
data(){
return{
Info:['Coding入門','散裝江蘇人'],
}
}
這里根據(jù)我的理解哪雕，<vue-typer>應(yīng)該是隨著他的父元素來決定自己本身的css屬性，此處我給<h1>定義一些css屬性并且它確實正確的應(yīng)用上了這些屬性：
h1{
font-size: 2em;
color: #0099ff;
margin: 3rem auto 1rem;
.vue-typer{
display: inline-block;
}
}
效果
今天就寫了這么多鲫趁，下次大概聊一聊Vue單文件組件斯嚎，昨天寫了一些但是感覺不對，所以全部推翻要重寫了挨厚。
順便存一下今天看到的堡僻，以后可能會用上的vue組件
