css的一些小技巧！页面视觉差！

<div class="parallax">
  <div class="bg__foo">foodiv>
  <div class="bg__bar">bardiv>
  <div class="bg__baz">bazdiv>
  <div class="bg__bazz">bazzdiv>
div>

// setting base styles to image containers
[class*="bg__"] {
  height: 50vh;

  text-indent: -9999px;

  /* fix background */
  background-attachment: fixed;

  /* center it */
  background-position: center center;

  /* Scale it nicely to the element */
  background-size: cover;

  /* just make it look a bit better ;) */
  &:nth-child(2n) {
    box-shadow: inset 0 0 1em #111;
  }
}

.bg__foo {
  background-image: url(
    https://s3-us-west-2.amazonaws.com/s.cdpn.io/30354/parallax1.jpg
  );
}

.bg__bar {
  background-image: url(
    https://s3-us-west-2.amazonaws.com/s.cdpn.io/30354/parallax2.jpg
  );
}

.bg__baz {
  background-image: url(
    https://s3-us-west-2.amazonaws.com/s.cdpn.io/30354/parallax3.jpg
  );
}

.bg__bazz {
  height: 100vh;

  background-image: url(
    https://s3-us-west-2.amazonaws.com/s.cdpn.io/30354/parallax1.jpg
  );
}