CSS for sliding operations

The principle of CSS sliding operation is similar to that of a carousel diagram:

If the box width or height exceeds the width or height of the parent box, the slider can be hidden by hiding the scroll bar:

• The HTML structure is as follows:

  <Divclass= "box">        <ul>            <Li></Li>            <Li></Li>            <Li></Li>            <Li></Li>            <Li></Li>            <Li></Li>        </ul>    </Div>

  The CSS code is as follows:

  * {padding:0;margin:0; }. Box{width:500px;Border:1px solid Black;Height:100px;Overflow:Scroll;? }. Box::-webkit-scrollbar{Display:None; }ul{List-style:None;width:800px; }Li{width:100px;Height:100px;Background-color:Red;Border:1px solid Black;float: Left; }

CSS for sliding operations