layuit 框架 UI框架Layui入門介紹

2021-10-13 07:02:23 字數 1060 閱讀 5515

layui(諧音,類ui),一款為服務端程式設計師量身定做的ui框架,採用原生的html/css/js編寫,體積輕盈,內容豐富。使用layui後,一次性解決彈出層、日期外掛程式、資料分頁、**、檔案上傳等常用模組。除此之外,layui相容除ie6/7外的所有瀏覽器,可作為 pc端後台系統和前台介面的快速開發方案。

├─css //css目錄

│ │─modules //模組css目錄(一般如果模組相對較大,我們會單獨提取,比如下面三個:)

│ │ ├─laydate

│ │ ├─layer

│ │ └─code.css

│ └─layui.css //核心樣式檔案

├─font //字型圖示目錄

│─lay //模組核心目錄

│ └─modules //各模組元件

│─layui.js //基礎核心庫

└─layui.all.js //包含layui.js和所有模組的合併檔案

layui的兩種載入方法

方法1:按模組載入layui.css+layui.js,適用於線下開發環境,方便團隊除錯**。

單模組載入

;!function(){

載入模組

layui.use(['layer','form'],function(){

var layer=layui.layer;

layer.open({

title: '模組化載入'

,content: 'hello,layui'

方法2:全模組載入layui.css+layui.all.js,適用於線上環境,介紹請求靜態資源的次數。

全模組載入

// 無需再執行layui.use()方法載入模組,直接使用即可

;!function(){

var layer=layui.layer,form=layui.form;

layer.open({

title:"全模組載入",

content:"hello,layui"

以上就是layui入門介紹的全部知識,在之後的文章中還會介紹如何使用開發中常用的表單模組、檔案上傳模組、分頁模組等。

前端UI框架 Bootstrap 框架

設計前端頁面或者元件的時候,原生的html元件,比較難看,自己設計那些css樣式,非常麻煩,工作量很大,還不一定會。但是其實,網上有很多開源的元件庫,拿來使用就可以了,例如 bootstrap,easyui,layui,miniui。需要的時候,網上可以找到一大堆這種ui框架。直接使用這種現成的輪子...

前端UI框架

10 後台ui開發框架 museui 一款基於bootstrap風格,相容於主流瀏覽器 包括ie6 的後端ui開發元件。官方 以下是常用前端ui框架快速開發web專案 1.dwz 國產的jquery ui富客戶端框架 2.jquery lingerui 國產前端框架 3.jquery easyui ...

UI框架選型

最近公司的乙個新專案要進行ui框架的選型,我把選型的思路和過程跟大家分享一下。在選型之前,我們先要定一下選型的標準,就像人生一樣,想清楚 自己要的是什麼 是最重要的。選型的標準分為幾部分 業務是根本,和大部分的技術一樣,框架沒有好壞之分,只有適合與不適合。我們專案是乙個通訊類的監控專案,使用者群是移...