layui.css 是一款基于 HTML5 和 CSS3 技術的前端框架,它的設計理念是簡潔、易用、兼容性好。它的壓縮后大小只有 28KB 左右,但是功能齊全,支持常見的布局和 UI 組件。其中常見的組件包括表單、按鈕、彈窗、進度條、菜單等等。
/* layui.css */ @charset "utf-8"; /* 常規標簽樣式 */ body, button, input, select, textarea { font-family: sans-serif; font-size: 14px; color: #666; -webkit-font-smoothing: antialiased; } body { line-height: 1.5; } input, button, select, textarea { outline: 0; } button { cursor: pointer; } a { color: #666; text-decoration: none; } a:hover { color: #333; } /* 布局樣式 */ .layui-container, .layui-row { margin: 0 auto; } .layui-container { width: 1200px; } .layui-row { width: 100%; display: flex; flex-wrap: wrap; } .layui-col-md1 { width: 8.33333333%; } .layui-col-md2 { width: 16.66666667%; } .layui-col-md3 { width: 25%; } .layui-col-md4 { width: 33.33333333%; } .layui-col-md5 { width: 41.66666667%; } .layui-col-md6 { width: 50%; } .layui-col-md7 { width: 58.33333333%; } .layui-col-md8 { width: 66.66666667%; } .layui-col-md9 { width: 75%; } .layui-col-md10 { width: 83.33333333%; } .layui-col-md11 { width: 91.66666667%; } .layui-col-md12 { width: 100%; }
總之,layui.css 是一款值得推薦的前端框架,它可以大大縮短頁面開發周期,提高開發效率。