如何在web页面上优雅的动态展示多个(不确定)个下拉框呢。

如题,想在web页面上放置多个下拉框,但是下拉框的个数和下拉框前的提示字符是不确定的,所以这就会造成一个问题,在对这些下拉框进行排列或者布置的时候,很乱,要不就是很难看的那种,所以咨询下有没有知道比较优雅的排列的方式呢? 现在的做法是将每一个的select放置在单独的div中,并使用栅格每行显示4个到5个,展示效果不是很理想。
比如
123:[下拉菜单1] 456:[下拉菜单2] 789:[下拉菜单3]
... ...
这样就会导致,如果换成大屏幕的刷,每个div之间的间隔非常难看。
有没有好的办法呢,请各位指点下。谢谢

阅读 2.9k
2 个回答

flex布局

总体容器为flex容器 里面的下拉框容器为flex项目

容器需要设置

justify-content: space-around | space-between; 
flex-wrap: wrap;

每个下拉框容器固定宽度

容器内提示文字左浮动 下拉框右浮动 提示文字 text-align: justify;

下拉框可以用select2插件,比你这么来回布局好的多

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题