亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

layui登錄頁(yè)面

original 2019-03-21 16:27:14 549
abstrait:基本思路:    首先要引入layui的核心樣式文件和基礎(chǔ)核心庫(kù)兩個(gè)部分。之后借助layui工具在設(shè)計(jì)的網(wǎng)頁(yè)中依次加入后臺(tái)管理系統(tǒng)以及通過(guò)表單欄添加的用戶名、密碼、以及登錄和驗(yàn)證碼部分,最后完成相關(guān)布局。全部代碼:<!DOCTYPE html> <html> <head> <title>登錄<

基本思路:

    首先要引入layui的核心樣式文件和基礎(chǔ)核心庫(kù)兩個(gè)部分。之后借助layui工具在設(shè)計(jì)的網(wǎng)頁(yè)中依次加入后臺(tái)管理系統(tǒng)以及通過(guò)表單欄添加的用戶名、密碼、以及登錄和驗(yàn)證碼部分,最后完成相關(guān)布局。

全部代碼:

<!DOCTYPE html>
<html>
<head>
	<title>登錄</title>
	<link rel="stylesheet" type="text/css" href="../static/plugins/layui/css/layui.css">
	<script type="text/javascript" src="../static/plugins/layui/layui.js"></script>
</head>
<body style="background:#1E9FFF">
	<div style="width: 500px;margin:270px auto 0px; ">
		<div style="background: #fff; border-radius: 4px;box-shadow: 5px 5px 20px #4444;padding: 20px;">
			<form class="layui-form">
				 <div class="layui-form-item" style="color: gray" >
				 	<h2>后臺(tái)管理系統(tǒng)</h2>
				 </div>
				 <hr>
				 <div class="layui-form-item">
					  <label class="layui-form-label">用戶名</label>
					  <div class="layui-input-block">
					      <input type="text"  placeholder="請(qǐng)輸入用戶名" class="layui-input">
					  </div>
				</div>
				 <div class="layui-form-item">
					  <label class="layui-form-label">密碼</label>
					  <div class="layui-input-block">
					      <input type="password"  placeholder="請(qǐng)輸入密碼" class="layui-input">
					  </div>
				</div>
				 <div class="layui-form-item">
					  <label class="layui-form-label">驗(yàn)證碼</label>
					  <div class="layui-input-inline">
					      <input type="text" class="layui-input">
					  </div>
					  <img src="../yz.png">
				</div>
				<div class="layui-form-item">
				    <div class="layui-input-block">
				      <button class="layui-btn" lay-submit lay-filter="formDemo">登錄</button>
				    </div>
				</div>
			</form>
		</div>
	</div>
	
</body>
</html>

小結(jié):

    layui,是一款采用自身模塊規(guī)范編寫的前端 UI 框架,遵循原生 HTML/CSS/JS 的書寫與組織形式。外在很簡(jiǎn)單但是其中設(shè)計(jì)的部分樣式很精美,體積輕盈,組件也十分豐富,非常適合界面的快速開發(fā)。在編寫前端程序的時(shí)候可能會(huì)在一些地方需要樣式精美的設(shè)計(jì),而layui所提供的部分可以有效解決,可以在自身編寫的同時(shí)借鑒layui進(jìn)行編寫,從而使網(wǎng)頁(yè)觀看和使用起來(lái)更為方便且美觀。


Professeur correcteur:天蓬老師Temps de correction:2019-03-22 09:02:13
Résumé du professeur:layUI是近年來(lái)在國(guó)內(nèi)比較流行的前端框架, 但是有越來(lái)越商業(yè)化的趨勢(shì), 建議多了解幾個(gè), 以備用

Notes de version

Entrées populaires