博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
html让没有宽高限制的图片居中
阅读量:4881 次
发布时间:2019-06-11

本文共 635 字,大约阅读时间需要 2 分钟。

1、要想让图片左右对齐,我们可以在div里写入"style:text-align:center;"代码来实现。

2、要想使图片居中,多数人可能会考虑使用"vertical-align:middle"代码。这样加上后发现却没有出现效果。
  IE、firefox浏览器的逐步解决方法:
  1)在div里写入"line-height:300px; vertical-align:middle",发现IE7这时候也有效果了。
  但firefox,360图片还没垂直居中。
  (这里的"line-height:300px"是根据div的高度确定的。)
  2)再对div增加样式:"display:table-cell",现在看看firefox也好了。

3、还有ie6 。

    加入 *font-size:85px, 实现ie6下图片的居中,字体大小以居中对齐为准;

  

 

举例代码:

  < div style=”width:300px;height:300px;text-align:center;vertical-align:middle;line-height:300px;border:1px solid #ccc;display:table-cell”>
  < img src=”aaaa.jpg” mce_src=”aaaa.jpg”  />
  < /div >

转载于:https://www.cnblogs.com/swinm/p/3474417.html

你可能感兴趣的文章
Mysql单表查询(胖胖老师)
查看>>
Linux的基本命令(CentOS)
查看>>
超链接的几个样式
查看>>
asp.net mvc验证特性
查看>>
接口interface和抽象类型abstract
查看>>
【高精度】贝贝与国王
查看>>
Math
查看>>
git安装配置
查看>>
从CPU的运行到函数调用做个了解
查看>>
记录一次无聊的(经历了Nodejs -> Shell -> C)的探索问题过程
查看>>
接口请求失败处理,重新请求并限制请求次数.自己封装搞定retry函数
查看>>
C# 数据库连接增删改查
查看>>
Xcode 最近使用的一些问题
查看>>
JSP 自定义标签
查看>>
ACM_水题你要信了(修改版)
查看>>
题解报告:hdu 1087 Super Jumping! Jumping! Jumping!
查看>>
汇编实验一
查看>>
2015 Multi-University Training Contest 6 hdu 5357 Easy Sequence
查看>>
HDU 4856 Tunnels
查看>>
常用的页面加载慢的解决方案
查看>>