css行内(块)元素之间默认间距问题

引言

今天调试学弟代码时发现如下问题:
页面中插入4个超链接,每个连接设置宽度25%,发现四个链接并不能并排显示,有一个被挤了下了,但是设置了浮动之后就能在一行显示。


在这里插入图片描述
这里很明显的看出每个行内块元素之间存在间距。

解决方法

  1. 给行内元素设置浮动(两个浮动的元素并排显示时,浏览器默认间距为0)(不推荐,有时并不需要浮动,并且还要根据需求清除浮动带来的影响)。
  2. 给行内元素的父元素设置font-size:0px;(不推荐。当元素里面有文字时,文字不能显示)。
  3. 给父元素添加word-spacing(词边距)属性,属性值为负数根据情况给出。(推荐)css行内(块)元素之间默认间距问题_第1张图片

对未来真正的热爱,是把一切奉献给现在。

你可能感兴趣的:(前端)