雖不是CSS3，可是它的壽命卻不及他

一個嚴肅又嚴重的話題，做爲公司裏面的h5，不說別的知識如何，最起碼個人CSS樣式得過關吧，然而，最爲今天的話題主義，很顯然嘛，我並不合格，今天能夠給本身打一個不合格的標籤了

話題引入

因爲後臺數據的變動，但是個人樣式並無作了那麼多的判斷，故此，個人問題來了，我須要作改變，因而我作了以下改變

{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
}

以上是我解決的樣式定位absolute後居中的問題，可是，按照UI的設計，當前DIV模塊並不要求填充完整個屏幕，因而可知，以上方法使用的環境是在不要求寬高的時候，適宜用當前方法

{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}

以上用法解決了個人需求問題，因而可知，他能夠將元素轉換成inline-block行內塊級元素，一樣，也不須要知道元素的大小，可是，兼容性並非太好

{
    width:100px;
    height:200px;
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-100px;
    margin-left:-50px;
}

以上方法其實最古老的方法，由於他有種種的不全才會被一一代替，因爲此方法必需要知道元素的大小，不然就只能用js來獲取，這並非咱們的初衷，因而乎，有了transform這個方法，好了，對於position定位以後的居中我已經說完了，接下來該說說relative和absolute了。

今天老大的一席話真得讓我驚訝了，原來我一直以來都是用書本上的知識，並無全力拓展開，更沒有說細心研究過，對於樣式我以爲並無太多的要求，代碼不要總重複就行了，可是顯然不是這個樣子的，既然CSS是美化頁面的，那就應該按照頁面的標準流去行走，而我，並無注意到這些

graph LR
position-->relative
relative-->absolute

以上是我一直以來用absolute的方式，就是使用position:relative之後才能使用absolute，至於爲何本身也搞不明白，只是上課的時候老師是這麼說的，我也就這麼跟着作了

relative	absolute
相對定位，跟着父級元素	絕對定位，以整個網頁爲座標系
相對其它元素能夠隨意調整位置，但位置依然在	脫離文本流，位置已然不存在
老是相對於最近的父元素定位，而不論其父元素是何種定位方式	，參照的是最近的、position值設置爲relative或者absolute的元素來進行定位

對於老師說的爲何要父元素用relative，子元素才能用absolute的說話

在設置父級元素position屬性的時候，將其設置爲static(其實默認值即爲static)，其中的子元素將像第一種狀況同樣定位；若是將父級元素的position屬性設爲absolute，那麼將會破壞父級元素的原來的佈局，父級元素將會以父元素的父元素爲參照，並根據top等值進行定位；只有在將父級元素的position設置爲relative時，纔不會破壞這個父元素的佈局，並且其中的子元素將參照父元素的左上角，經過top等屬性值來對子元素定位