layui表單中的inline和block：

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

block：

block元素會(huì)獨(dú)自占一行，多個(gè)block元素各自新起一行，默認(rèn)情況下 ，block元素寬度自動(dòng)填充其父元素寬度

<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="請(qǐng)輸入標(biāo)題" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item">
    <label class="layui-form-label">驗(yàn)證必填項(xiàng)</label>
    <div class="layui-input-block">
      <input type="text" name="username" lay-verify="required" lay-reqtext="用戶名是必填項(xiàng)，豈能為空？" placeholder="請(qǐng)輸入" autocomplete="off" class="layui-input">
    </div>
  </div>

上面這段代碼中，用到了class="layui-input-block"

最終頁面顯示如下：

兩個(gè)輸入框是單獨(dú)一行的。

inline：

inline元素不會(huì)獨(dú)自占一行，多個(gè)相鄰元素會(huì)排在同一行中，直到一行排不下，才會(huì)新?lián)Q一行，其寬度隨元素的內(nèi)容而變化

<div class="layui-form-item">
    <div class="layui-inline">
      <label class="layui-form-label">驗(yàn)證手機(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">驗(yàn)證郵箱</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é)果是這樣的：

就是兩個(gè)輸入框都在同一行。

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

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

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

廣告

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