layui-inline的作用有哪些

小編給大家分享一下layui-inline的作用有哪些，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)成都網(wǎng)站建設(shè)按需策劃，是成都網(wǎng)站建設(shè)公司,為木包裝箱提供網(wǎng)站建設(shè)服務(wù),有成熟的網(wǎng)站定制合作流程，提供網(wǎng)站定制設(shè)計服務(wù)：原型圖制作、網(wǎng)站創(chuàng)意設(shè)計、前端HTML5制作、后臺程序開發(fā)等。成都網(wǎng)站建設(shè)熱線：18982081108

layui-inline是指layui表單中的inline元素，其作用就是使多個元素排成一行；inline元素不會獨自占一行，多個相鄰元素會排在同一行中，直到一行排不下，才會新?lián)Q一行，并且其寬度隨元素的內(nèi)容而變化。

layui表單中的inline

inline：

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

<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"

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

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

以上是“l(fā)ayui-inline的作用有哪些”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

網(wǎng)頁標(biāo)題：layui-inline的作用有哪些
標(biāo)題網(wǎng)址：http://muchs.cn/article30/jcjcpo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、營銷型網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計公司、手機網(wǎng)站建設(shè)、品牌網(wǎng)站設(shè)計、網(wǎng)站導(dǎo)航

廣告

聲明：本網(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)