登录  /  注册
怎么在网页中设置图片进行左右滑动
。。。
。。。 2020-10-10 11:06:20
[HTML讨论组]

<html>   <head>      <meta charset="UTF-8">      <title>溢出处理作业</title>      <style type="text/css">         #img-list{            /* 宽度,高度 */            width:500px;            height:150px;            /*边框*/            border:1px solid #000;            /*横向溢出使用滚动条 (auto || scroll)*/            overflow:auto;         }         #img-list>p{            /* 宽度,高度 背景色 */            width:800px;            height:100px;         }         #img-list>p>img{            width:100px;            /*鼠标悬停之前,增加边框,颜色设置为透明*/            border-radius:5px;            /*border:2px solid transparent;*/         }         /*鼠标悬停时,显示边框*/         #img-list>p>img:hover{            border-color:#f00;            box-shadow:3px 3px 0px 0px #ddd;         }      </style>   </head>   <body>   <!-- 1、创建一个 500px*150px 的div,id : img-list -->      <div id="img-list">         <!-- 2、创建一个 800px*100px 的p元素 -->         

            <img src="p_small_001.jpg">            <img src="p_small_002.jpg">            <img src="p_small_003.jpg">            <img src="p_small_004.jpg">            <img src="p_small_005.jpg">            <img src="p_small_006.jpg">            <img src="p_small_007.jpg">         

      </div>   </body></html>

。。。
。。。

全部回复(1)
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号