这是官网上给出的例子

看起来还可以,其实实际上运行的话,选择框的长度是直接拉满的,很影响美观,如下图

代码如下

<div class="layui-form-item">
    <label class="layui-form-label">选择框</label>
    <div class="layui-input-block">
      <select name="city" lay-verify="required">
        <option value=""></option>
        <option value="0">北京</option>
        <option value="1">上海</option>
        <option value="2">广州</option>
        <option value="3">深圳</option>
        <option value="4">杭州</option>
      </select>
    </div>
    </div>

经查看官网页面,这块的源代码

可以发现多了一行“layui-inline”,官网给出的解释如下

实现如下图:

 <div class="layui-form-item">
    <div class="layui-inline">
    <label class="layui-form-label">地址:</label>
    <div class="layui-input-block">
      <select name="uaddress1" lay-verify="required">
       				 <option value="">请选择单元楼</option>
       				 <option value="Building1">1号楼</option>
       				 <option value="Building2">2号楼</option>
       				 <option value="Building3">3号楼</option>
       				 <option value="Building4">4号楼</option>
     </select>
     </div>
     </div>
     <div class="layui-inline">
     <select name="uaddress2" lay-verify="required">
      				 <option value="">请选择单元</option>
 					 <option value="Unit1">1单元</option>
 					 <option value="Unit2">2单元</option>
 					 <option value="Unit3">3单元</option>
 					 <option value="Unit4">4单元</option>
	 </select>
	 </div>
	 <div class="layui-inline">
			<select name="uaddress3" lay-verify="required">
			 		<option value="">请选择楼层</option>
 					 <option value="floor1">1楼</option>
 					 <option value="floor2">2楼</option>
 					 <option value="floor3">3楼</option>
 					 <option value="floor4">4楼</option>
 					 <option value="floor5">5楼</option>
 					 <option value="floor6">6楼</option>
			</select>
	 </div>
	 <div class="layui-inline">
			<select name="uaddress4" lay-verify="required">
			 		<option value="">请选择房间</option>
 					 <option value="Room1">1号房</option>
 					 <option value="Room2">2号房</option>
			</select>
	 </div>
  </div>

 

 

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐