行内元素垂直对齐以及图片底部白边问题(CSS查漏补缺)

文: jack同学

jiack同学

  • 问题:很多时候布局,多个行盒排列时垂直方向上对齐时不一致的

    • 解决:使用vertical-align属性设置行盒,可以设置middle,top, bottom, 还有数值(如 -4px / 6px); 这些基本上可以解决大部分的问题了。注意这个属性不具有继承性
  • 图片底部白边问题

    • 问题:当块盒包裹图片的时候,图片底部和块盒底部之间是有间隙的,这个间隙根据字体大小变大而间隙扩大。
    • 解决:给图片父元素设置font-size: 0; 不好的是,如果块盒内部还有其它文字时,会造成影响。
    • 第二种方法是给图片设置display: block;让图片变成块盒,这种方法没有副作用
  • 具体产生这些问题的原因是挺细的问题,暂时了解这些就足够了。有兴趣的可以了解一下

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

相关阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,121评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,803评论 1 45
  • 一、CSS入门 1、css选择器 选择器的作用是“用于确定(选定)要进行样式设定的标签(元素)”。 有若干种形式的...
    宠辱不惊丶岁月静好阅读 1,720评论 0 6
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,634评论 1 32
  • 1、垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,...
    kiddings阅读 3,297评论 0 11

友情链接更多精彩内容