无双

博学善思,自强不息

导航

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

统计

纯css未知高度图片垂直居中

box {
2        /*非IE的主流浏览器识别的垂直居中的方法*/
3        display: table-cell;
4        vertical-align:middle;
5
6        /*设置水平居中*/
7        text-align:center;
8
9        /* 针对IE的Hack */
10        *display: block;
11        *font-size: 175px;/*约为高度的0.873,200*0.873 约为175*/
12        *font-family:Arial;/*防止非utf-8引起的hack失效问题,如gbk编码*/
13
14        width:200px;
15        height:200px;
16        border: 1px solid #eee;
17}
18.box img {
19        /*设置图片垂直居中*/
20        vertical-align:middle;
21}
22
23<div class="box">
24        <img src="http://pics.taobao.com/bao/album/promotion/taoscars_180x95_071112_sr.jpg" />
25</div>

posted on   无双  阅读(953)  评论(1编辑  收藏  举报

编辑推荐:
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
阅读排行:
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· .NET周刊【3月第1期 2025-03-02】
· [AI/GPT/综述] AI Agent的设计模式综述
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
点击右上角即可分享
微信分享提示