固定定位对下面元素的影响，在文本中添加不同宽度的空格

1.相信初学者在刚刚接触定位，并且使用固定定位的时候，可能会出现一些不是自己想要的那个效果，使用固定定位的元素会影响到显示在它下方的元素，下方的元素会被使用固定定位的元素覆盖掉固定定位元素的高度。下面就给大家介绍一个小方法来解决这个小问题吧！

css代码如下

.top{

      position: fixed;

      width: 100%;

      height: 100px;

      background-color: #FAFAFA;

}

.banner{

      width: 100%;

      height: 570px;

      background:url(images/banner.jpg) no-repeat;

      background-size: cover;

      background-position: center center;

}

html代码

<div class="top">

       ...

       ...

</div>

<div class = "banner">

    ....

    ....

<div/>

这样写所呈现的代码是这样的：

        banner会被top覆盖点100px，想要解决这个问题很简单，就是在.banner{}样式中添加padding-top:100px;就ok了。

以后如果再遇到类似的问题，可以给被覆盖的元素加上padding-top：设置固定定位的元素的高度。

2.文本中有时可能需要添加空格，但是你可能需要不同宽度的空格，所以下面就给大家介绍不同的空格：

（1）&nbsp;我们在写东西的时候最常见的一种，它所占的是一个空格的宽度，这个会影响到正常的换行。所以在写页面的时候要少用这个。

（2）&ensp;这个所代表的宽度会比&nbsp;稍窄点，当你不需要像&nbsp;那样的宽度时，就可以用这个。

（3）&emsp;