layui表單中的inline和block：
block：
block元素會獨自佔一行，多個block元素各自新起一行，預設情況下，block元素寬度自動填入其父元素寬度
<div class="layui-form-item">
<label class="layui-form-label">单行输入框</label>
<div class="layui-input-block">
<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">验证必填项</label>
<div class="layui-input-block">
<input type="text" name="username" lay-verify="required" lay-reqtext="用户名是必填项，岂能为空？" placeholder="请输入" autocomplete="off" class="layui-input">
</div>
</div>上面這段程式碼中，用到了class="layui-input-block"
最終頁面顯示如下：
兩個輸入框是單獨一行的。
inline：
inline元素不會獨自佔一行，多個相鄰元素會排在同一行中，直到一行排不下，才會新換一行，其寬度隨元素的內容而變化
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">验证手机</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">验证邮箱</label>
<div class="layui-input-inline">
<input type="text" name="email" lay-verify="email" autocomplete="off" class="layui-input">
</div>
</div>
</div>上面用到的是 class="layui-input-inline"
頁面結果是這樣的：
就是兩個輸入框都在同一行。
更多layui知識請關注PHP中文網layui使用教學專欄。
以上是layui表單中的inline和block介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！
