整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
案例的知識(shí)點(diǎn)主要3個(gè)方面，一個(gè)是html5的結(jié)構(gòu)，一個(gè)是CSS3樣式，一個(gè)是頁(yè)面居中的定位。
1.html5中的屬性（placeholder）實(shí)現(xiàn)文本框的提示信息，required屬性設(shè)置文本框信息是必填的。
2. CSS3的屬性線性漸變（linear-gradient）實(shí)現(xiàn)頁(yè)面（body）區(qū)域的背景色。
3.通過絕對(duì)定位（position:absolute）和CSS3中的變形(transform)實(shí)現(xiàn)div的頁(yè)面居中定位。
案例的效果如下：
網(wǎng)頁(yè)login.html的代碼如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/page.css"/>
</head>
<body>
<div class="login1">
<h1>后臺(tái)管理登陸</h1>
<div>
<form>
<p>
<input type="text" placeholder="請(qǐng)輸入登錄帳號(hào)" required="required"/>
</p>
<p>
<input type="password" placeholder="請(qǐng)輸入登錄密碼" required="required"/>
</p>
<p>
<button type="submit">登陸</button>
</p>
</form>
</div>
</div>
</body>
</html>
外部樣式文件page.css的代碼如下：
說明：在外部樣式（page.css）中，類（.login1）控制的div定位如果還不太理解的話，請(qǐng)參看下面的圖示。
至此，案例制作完成。
app 內(nèi)嵌H5頁(yè)面，個(gè)人中心頁(yè)面模板，包含 列表 按鈕 圖片 icon 搜索 布局 上傳 對(duì)話框 。
手機(jī)演示地址：http://www.17sucai.com/preview/10221/2017-01-20/ceshi/index.html — my-read.html — my-secure.html — my-put.html — my-up.html
手機(jī)演示地址：http://www.17sucai.com/pins/demoshow/22887
手機(jī)版大氣信息管理系統(tǒng)界面模板
手機(jī)演示地址：http://www.17sucai.com/pins/demoshow/22475
藍(lán)色的手機(jī)登錄模板
手機(jī)演示地址：http://www.17sucai.com/pins/demoshow/22480
蘋果風(fēng)格
手機(jī)演示地址：http://www.17sucai.com/pins/demoshow/20946
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
