HTML中,div下面的img标签高度总是比div的高度少的问题解决

1、问题描述,需求开发过程中,用到下面代码,但是div的高度为  273.75px,而img元素的高度269.75px

       <div style="width:30%;">

                    <img style="width:100%;display: block;" src="static/images/ceshi.jpg">

       </div>

2、解决方案:为img元素添加display:block;属性设置;

3、原因:img是一种类似text的元素,在结束的时候,会在末尾加上一个空白符,所以就会多出3px。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,796评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,695评论 1 45
  • 1、垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,...
    kiddings阅读 3,199评论 0 11
  • 1. tab列表折叠效果 html: 能源系统事业部 岗位名称: 工作地点 岗位名...
    lilyping阅读 1,899评论 0 1
  • 1. 默认的内外边距不同 问题: 各个浏览器默认的内外边距不同 解决: *{margin:0;padding:0;...
    jslxm阅读 848评论 0 2