頁面實現大頭貼功能，相框固定，照片可更換，類似下圖。
其實我們可以拆分壹下：相框.png是壹張圖片，金泰熙小姐姐照片.jpg是另壹張圖片，只要把相框.png疊在金泰熙小姐姐照片.jpg圖片前面，那麽就實現啦！
先上HTML結構：
相框為固定寬高，假設寬為300px，高為400px。
CSS樣式如下：
那麽問題來了，photo怎麽居中？
試過的不成功解法：
1、把photo設為絕對定位，left:-50%，再設margin-left為負值。由於photo寬度不確定，因此margin-left具體值不確定。
2、寬度設為300px，圖片變形。
3、把photo設為絕對定位，margin:auto,left:0,right:0。當box容器寬度小於photo時，該方法失效。
以上方法均無法實現居中後，想到如下可行辦法：
HTML結構：
CSS樣式：
給photo外加壹個div容器photobox，給photobox設定壹個足夠寬的寬度，再將photobox相對box居中，然後再用text-align:center讓photo相對於photobox居中。
photobox容器left值=（photobox容器寬 - box容器寬）/2