#slideshow {
      position: relative;
      width: 100%;
      height: 580px;
      overflow: hidden;
    }

    #slideshow img {
      display: none;
      width: 100%;
      height: 100%;
    }

    #prevBtn,
    #nextBtn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background-color: transparent;
      border: none;
      color: #fff;
      font-size: 20px;
      padding: 10px;
      cursor: pointer;
    }

    #prevBtn {
      left: 10px;
	  text-align:left;
    }

    #nextBtn {
      right: 10px;
	  text-align:right;
    }

    #counter {
		width:100%;
		text-align:center;
      position: absolute;
      bottom: 0px;
      left: 50%;
      transform: translateX(-50%);
      background-color: rgba(0, 0, 0, 0.5);
      color: #fff;
    }

    #counter span {
    margin: 0;
    cursor: pointer;
    width: 33.3333%;
    display: block;
    float: left;
	height:25px;
	line-height:25px;
    }

    #counter span.active {
    font-weight: bold;
    color: #000;
    background: #bddfe6;
    }


		@media screen and (max-width:1033px) {
#slideshow{height:250px;}

	}




	@media screen and (max-width:870px) {
#slideshow{height:200px;}
	}
	
@media screen and (max-width:650px) {
	#slideshow{height:150px;}

	}	
解释