共 3 条评论关于"web前端技术中浮动如何清除"
最新评论
在web前端技术中,最基础的就是布局了,布局简单分为flex弹性盒模型布局(省去了清浮动的操作),以及div布局,那么我们在布局的过程中,就会使用到浮动,也就是float,那么我们如何处理董呢,接下来,我就介绍几种方法:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> * { margin: 0; padding: 0; } .main { width: 300px; height: auto; background: yellow; margin: 300px auto; float: left; } .box { width: 33.33%; height: 100px; box-sizing: border-box; border: 1px solid red; float: left; } </style> </head> <body> <div class="main"> <div class="box"></div> <div class="box"></div> <div class="box"></div> </div> </body> </html> |
1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> * { margin: 0; padding: 0; } .main { width: 300px; background: yellow; margin: 300px auto; height: 100px; } .box { width: 33.33%; height: 100px; box-sizing: border-box; border: 1px solid red; float: left; } </style> </head> <body> <div class="main"> <div class="box"></div> <div class="box"></div> <div class="box"></div> </div> </body> </html> |
「梦想一旦被付诸行动,就会变得神圣,如果觉得我的文章对您有用,请帮助本站成长」
上一篇:js实现哔哩哔哩侧边导航
下一篇:抽奖转盘代码怎么做
最新评论
免费领取学习资料和视频
收到了,你这个网址无法访问呀
评:react中调用 setState 之后发生了什么大佬,都联系不到你人, 那个友链能帮忙换一下不 原 共享博客 http:/...
评:react中调用 setState 之后发生了什么没咋研究,emmm
评:web前端绘制八卦图_超简单教程这个是太极阴阳鱼,不是八卦图。
评:web前端绘制八卦图_超简单教程文章不错
评:宝塔系统面板无法正常显示我采用该方法解决了才发布的教程
评:iview-admin点击路由报错vue-router.esm.js?8c4f:2007 Uncaught (in promise) NavigationDuplicated {_name: "Navi
434134123423444
未完待续……
@超级管理员显示