父元素div跟子元素img大小有误差?

【父元素div跟子元素img大小有0.2误差,不知道从哪里来?】分享自@SegmentFault,传送门:https://segmentfault.com/q/1010000009909061

图片发自简书App

其中有一个答案的解决方法是,用浮动清除内联样式或者设置display: block;

这个答案基本没毛病,但其实追根溯源,这个空白是有原因的。inline 元素会有一个错位,是因为浏览器把它作为一行字来看。

众所周知,英文 a c e 等字母写在格子中间,而 b d p f 等字母则要么往上要么往下突出了一段。

而 inline 元素留下的那一小空白,就是给这些字母留下的。

因此解决办法也很简单,负边距消除,或者改变 display 设定都可以。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,155评论 1 92
  • 1. 前言 前端圈有个“梗”:在面试时,问个css的position属性能刷掉一半人,其中不乏工作四五年的同学。在...
    YjWorld阅读 4,917评论 5 15
  • CSS 是什么 css(Cascading Style Sheets),层叠样式表,选择器{属性:值;属性:值}h...
    崔敏嫣阅读 1,577评论 0 5
  • CSS格式化排版 1、字体 我们可以使用css样式为网页中的文字设置字体、字号、颜色等样式属性。下面我们来看一个例...
    张文靖同学阅读 1,374评论 0 3
  • 午加餐:面包,火龙果晚水果:西瓜 参考目标: 1份肉2份豆制品3份“新鲜”水果4份谷物/薯5份蔬菜,深绿色叶菜最好...
    静趣_儿童心理师阅读 175评论 0 0

友情链接更多精彩内容