任務(wù)目標(biāo)
實(shí)踐HTML/CSS布局方式
深入了解position等CSS屬性
任務(wù)描述
實(shí)現(xiàn)如示例圖（http://7xrp04.com1.z0.glb.clouddn.com/task_1_4_1.png）的效果
灰色元素水平垂直居中淌哟，有兩個(gè)四分之一圓位于其左上角和右下角讶迁。
任務(wù)注意事項(xiàng)
思考不同情況下（如灰色高度是根據(jù)內(nèi)容動(dòng)態(tài)變化的）水平垂直居中的解決方案恕出。
動(dòng)手試一試各種情況的組合蓝仲，父元素和子元素分別取不同的 position 值识腿。思考 position 屬性各種取值的真正含義农渊，尤其是 absolute 究竟是相對(duì)誰而言的固阁。
注意測(cè)試不同情況，尤其是極端情況下的效果贡茅。
調(diào)節(jié)瀏覽器寬度秘蛇，灰色元素始終水平居中。
調(diào)節(jié)瀏覽器高度顶考，灰色元素始終垂直居中赁还。
調(diào)節(jié)瀏覽器高度和寬度，黃色扇形的定位始終準(zhǔn)確驹沿。
其他效果圖中給出的標(biāo)識(shí)均被正確地實(shí)現(xiàn)艘策，錯(cuò)一項(xiàng)扣一分。
參考資料
http://www.w3cplus.com/css/advanced-html-css-lesson2-detailed-css-positioning.html：大漠老師手把手教你渊季，這次徹底搞懂定位問題
