如何改进代码？我的悬浮广告无法克服横向拉条的问题

源自：CSS定位 7-2 编程练习

收起

3回答

好帮手慕美 2020-10-12 11:14:27

同学，你好。背景图的宽度大于浏览器的实际宽度，因此会有滚动条，两边的广告只会在浏览器大小的两边显示，同学可以设置背景图片的width为100%即可

如果我的回答解决了你的疑惑，请采纳！祝学习愉快~~~~

好帮手慕雪 2020-10-11 18:47:13

我不知道你哪个代码广告位，哪个代码中间的内容哈，例如上图，one和three是两个div的广告，

以上用百分比描述占比就可以了。

如果解决了你的疑惑，请采纳，祝学习愉快～

提问者 TeacherZhe #1

对不起，我还会没搞清你这是什么操作。我的问题是主图太宽了，就有个横向滚动条。但是我没有办法将浮动广告安置在这么宽的主图的最两侧，他们只能在界面的最两侧

2020-10-11 21:03:10

好帮手慕雪 2020-10-11 17:48:32

同学你好，把宽度，还有左右的距离，都修改为百分比的形式就可以了。

如果解决了你的疑惑，请采纳，祝学习愉快～

提问者 TeacherZhe #1

我没有太理解你的意思，用百分比，这个横向拉条拉动，两边的悬浮广告也还是保持fixed啊，不会呆在主界面的最两边...你能够在我代码的基础上写出最完善的代码吗 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>慕课网</title> <style> .div2{ position:fixed; right:50px; top:100px; } .div3{ position:fixed; left:1%; top:100px; } </style> </head> <body> <div class="div1"> <img src="http://img1.sycdn.imooc.com/climg//59c9f7ce0001839219034033.png" class="img1"> </div> <div class="div2"> <img src="http://img1.sycdn.imooc.com/climg//5a3383c70001f1b702240364.png" name="img2"> </div> <div class="div3"> <img src="http://img1.sycdn.imooc.com/climg//5a3383d00001a3dd02240364.png" name="img3"> </div> </body> </html>

2020-10-11 18:33:58