让图片 div居中实现代码

时间：2021-05-08

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>hezc</title><style type="text/css">.hezc{width:200px; height:200px;line-height:200px;font-size:180px;text-align:center;display:table-cell; vertical-align:middle;border:1px solid #ccc}.hezc img{ vertical-align:middle;}</style></head><body><div class="hezc"><img src="http://lh4.ggpht.com/_ukA5Ln2cXIc/SRcgn5exDoI/AAAAAAAAAD4/JqcPpNZDPlI/s400/CSS%E9%80%9F%E8%AE%B0%E5%8D%A1%E7%89%87.gif" border="1" widht="100" height="100"/></div></body></html>
提示:可以修改后运行.

img 图片居中：先小小的记录下发现的新方法，有空在整理下。
具体代码：

CSS Code复制内容到剪贴板
  • <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  • <htmlxmlns="http://www.w3.org/1999/xhtml"xml:lang="en"lang="en">
  • <head>
  • <metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
  • <title>hezc</title>
  • <styletype="text/css">
  • .hezc{width:200px;height:200px;line-height:200px;font-size:180px;text-align:center;display:table-cell;vertical-align:middle;border:1pxsolid#ccc}
  • .hezcimg{vertical-align:middle;}
  • </style>
  • </head>
  • <body>
  • <divclass="hezc">
  • <imgsrc="https://www.jb51.net/images/logo.gif"border="1"widht="100"height="100"/>
  • </div>
  • </body>
  • </html>

    • 声明：本页内容来源网络，仅供用户参考；我单位不保证亦不表示资料全面及准确无误，也不保证亦不表示这些资料为最新信息，如因任何原因，本网内容或者用户因倚赖本网内容造成任何损失或损害，我单位将不会负任何法律责任。如涉及版权问题，请提交至online#300.cn邮箱联系删除。

    相关文章