怎么在網頁中設置圖片進行左右滑動
問題描述
<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:需要js配合
相關文章:
1. 使用text-shadow可以給圖片加陰影嗎?2. angular.js - angularjs如何傳遞id給另一個視圖 根據id獲取json數據?3. 數據庫無法進入4. java - HashSet<int> 為何有錯誤?5. java - StringBuffer轉成String,可以不同過tostring,而是通過+“”的方式轉換嗎?6. mysql - 記得以前在哪里看過一個估算時間的網站7. docker images顯示的鏡像過多,狗眼被亮瞎了,怎么辦?8. 請問一下各位老鳥 我一直在學習獨孤九賤 現在是在tp5 今天發現 這個系列視頻沒有實戰9. select - mysql怎么搜索一個字符串指定位置之后兩位10. python - linux怎么在每天的凌晨2點執行一次這個log.py文件
