如何将两个下拉选框并列显示 _VSCode

下拉框select在网页建造中比力常见，本家儿如果不但愿用户输入一些不合适法则的数据，若是种类不太多，利用下拉框是一个好的选择。那么，若何让两个下拉框并列显示呢？

需要这些哦
VSCode
方式/
1打开VSCode编纂东西，建立一个H5规范的测试页面SelectH5.html

文章插图

2在页面中添加两个select下拉框，每个下拉框添加3个测试选项

文章插图

3在浏览器中运行可以看到两个下拉框其实默认是并列显示的。因为select是内联元素，现实内容有多宽，就占用多宽的位置。且不独有一行

文章插图

4若是在两个select外面各添加一个div，就会呈现两个select各自占一行

文章插图

5在浏览器中运行，可以看到两个select确实占了两行。这是因为div是块级元素，默认会独有一行

文章插图

6将select外面的div添加样式，display:inline-block; 意思是将div改为内联元素，就不会独有一行了

文章插图

7【如何将两个下拉选框并列显示】也可觉得div设置固定宽度，而且设置float:left; 也可以让两个select并列显示

文章插图

以上内容就是如何将两个下拉选框并列显示的内容啦，希望对你有所帮助哦！

如何将两个下拉选框并列显示