css实现元素横向滚动的方法


本文摘自PHP中文网,作者V,侵删。

分析:

子元素的宽度大于父元素时会出现滚动 overflow-x: scroll; 为水平滚动,overflow-y: scroll; 为垂直滚动,根据需求这里采用水平横向滚动。

(学习视频分享:css视频教程)

html代码:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

<div class="content">

        <div class="content-list">

            <div class="item" style="margin-right:10px;">

                <div class="amount">

                    <span>2</span>元

                </div>

                <div class="fundInfo">

                    <p class="name">XXXXXX</p>

                    <p>满1000元可用</p>

                </div>                 

            </div>

            <div class="item" style="margin-right:10px;">

                <div class="amount">

                    <span>2</span>元

                </div>

                <div class="fundInfo">

                    <p class="name">XXXXXX</p>

                    <p>满1000元减200</p>

                </div>                 

            </div>

        </div>

    </div>

主要的css代码:

阅读剩余部分

相关阅读 >>

css如何让块无间隙

html中弹性布局(flex)的介绍(附代码)

css如何实现客服悬浮效果

css如何不显示元素

如何定义项目列表css

css怎么实现超出高度隐藏

css怎么让超链接不可用

nav-up属性如何使用

css圆角属性是什么

css如何清除input默认样式

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...