How to insert N pictures in fixed size DIV layer to arrange them in a row?
This article introduces the knowledge of "how to insert N pictures in a row in a fixed-size DIV layer". In the operation of practical cases, many people will encounter such a dilemma. Next, let the editor lead you to learn how to deal with these situations! I hope you can read it carefully and be able to achieve something!
How to insert more than N pictures in a fixed-size DIV layer, so that they are arranged in one line, and sliders appear when they exceed the width of the layer?
I thought it would be possible to use the overflow property, but the test failed. Later, the effect was achieved by using div cascading.
HTML Code:
The code is as follows:
Css controls the style:
The code is as follows:
.div {
Width:400px
Height:200px
Overflow-y:hidden; / * only horizontal scroll bars appear * /
Position: absolute
}
.div1 {
Position:absolute
Z-index:1
}
.div2 {
Position:absolute
Z-index:5
Left:200px
Top:0px
}
.div3 {
Position:absolute
Z-index:10
Left:400px
Top:0px
}
Effect:
This is the end of the content of "how to insert N pictures in a row in a fixed size DIV layer". Thank you for your reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!
