?layui表單的inline元素和block元素介紹-創(chuàng)新互聯(lián)

layui表單中的inline和block：

目前成都創(chuàng)新互聯(lián)公司已為超過千家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)站空間、綿陽服務(wù)器托管、企業(yè)網(wǎng)站設(shè)計、柳南網(wǎng)站維護(hù)等服務(wù)，公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

block：

block元素會獨自占一行，多個block元素各自新起一行，默認(rèn)情況下 ，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="請輸入標(biāo)題" 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元素不會獨自占一行，多個相鄰元素會排在同一行中，直到一行排不下，才會新?lián)Q一行，其寬度隨元素的內(nèi)容而變化

<div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">驗證手機(jī)</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"

頁面結(jié)果是這樣的：

就是兩個輸入框都在同一行。

以上就是layui表單中的inline和block介紹的詳細(xì)內(nèi)容，更多請關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司其它相關(guān)文章！

當(dāng)前題目：?layui表單的inline元素和block元素介紹-創(chuàng)新互聯(lián)
網(wǎng)站路徑：http://muchs.cn/article30/dddspo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供建站公司、App開發(fā)、自適應(yīng)網(wǎng)站、關(guān)鍵詞優(yōu)化、搜索引擎優(yōu)化、用戶體驗

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)