使用純CSS實現未知尺寸的圖片(但高寬都小於200px)在200px的正方形容器中水平和垂直置中。

來源:互聯網
上載者:User
div{width:200px; height:200px; border:1px solid #666; display:table-cell; vertical-align:middle; text-align:center;    *float:left;//這裡使用float:left來相容ie支援左右排列}div img {margin-top:expression(100-this.height/2);//若不想左右排列則可以使用vertical-align:middle;代替,建議大家這裡使用運算式,雖然在效能上有所欠缺,但ie6就這個命,沒辦法}

當然可能還有其他好辦法,望廣大錢端攻城師施捨施捨你們的好菜

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.