前端 · 奇怪小知识合集

无限期持续更新中。。。

1. span 之间的神秘缝隙

来看例子：

实际的效果是：

发现 span 在换行后，会出现缝隙。
事实上这是行内元素和inline-block元素的缝隙问题。
解决办法 1：你就不要换行了，毕竟span是行内元素。
解决办法 2：设置父元素的font-size为0，再设置目标span的font-size。

2. 忽高忽低的img图标

直接用img标签附加小图标时经常会发现小图标位置不是太高就是太低。
不管怎么调height，line-height，margin，padding都没用。
解决办法：
在img标签中加入vertical-align属性，
vertical-align有多种值总有一种符合你的要求，慢慢调试去吧。

3. github上传成功但不显示活跃颜色

如果当前git设置的用户名及邮箱和github上不同，那么上传文件到github的时候就会不显示用户活跃颜色。
因为github认为不是本人在上传。

解决办法：
首先可以用 $ git config --list
查看一下 当前设置的用户名和邮箱
设置：
$ git config --global user.name "xxxx"
$ git config --global user.email "xxxx@xxx"
ps：如果在list里没有出现user.name 和 user.email，就意味着当前git 没有设置用户名和邮箱。

4. 如何用三个均等div平铺一个大div

上代码

5. 标题多出字为省略号

.title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

6. width系列知识

width() //宽度
innerWidth() //宽度+padding
outerWidth() //宽度+padding+border
outerWidth(true) //宽度+padding+border+margin

本博客版权归 Llane00 ，转载需说明来源