首页<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>百度热搜</title> </head> <style> .hot-search li:hover { cursor: pointer; } </style> <body> <div> <h1>百度热搜</h1> <ul class="hot-search"> <li>欧洲仍是新冠大流行中心</li> <li>北京提倡餐饮酒吧业施行预约制度</li> <li>兰州大风浮尘遮天蔽日</li> <li>山东杰瑞集团高管被立案调查</li> <li>中兴通讯回应硫明</li> <li>破坏文物者终身不得登长城</li> </ul> </div> <script type="text/javascript"> (function() { var lis = document.querySelectorAll('.hot-search li'); for (var i = 0; i < lis.length; i++) { (function(index) { lis[index].addEventListener('click', function() { for (var j = 0; j < lis.length; j++) { lis[j].classList.remove('active'); } this.classList.add('active'); alert(index); }); })(i); } })(); </script> </body> </html>让百度热搜列表项之间间隔一定的距离。

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>百度热搜</title> </head> <style> .hot-search li:hover { cursor: pointer; } </style> <body> <div> <h1>百度热搜</h1> <ul class="hot-search"> <li>欧洲仍是新冠大流行中心</li> <li>北京提倡餐饮酒吧业施行预约制度</li> <li>兰州大风浮尘遮天蔽日</li> <li>山东杰瑞集团高管被立案调查</li> <li>中兴通讯回应硫明</li> <li>破坏文物者终身不得登长城</li> </ul> </div> <script type="text/javascript"> (function() { var lis = document.querySelectorAll('.hot-search li'); for (var i = 0; i < lis.length; i++) { (function(index) { lis[index].addEventListener('click', function() { for (var j = 0; j < lis.length; j++) { lis[j].classList.remove('active'); } this.classList.add('active'); alert(index); }); })(i); } })(); </script> </body> </html>让百度热搜列表项之间间隔一定的距离。

时间: 2023-11-08 22:06:00 浏览: 382

可以在 `.hot-search li` 的样式中添加 `margin-bottom` 属性来控制列表项之间的距离，例如： ```css .hot-search li { margin-bottom: 10px; } ``` 这样每个列表项之间就会有10像素的距离了。如果需要更大的间距，可以调整 `margin-bottom` 的值。

阅读全文