如何用html5+ css div制作一个简单的登录界面

html-css014

如何用html5+ css div制作一个简单的登录界面,第1张

1、按照正常的思路，布局就是div布局，写一个固定下来，作为模板，在每次获取数据的时候使用功能代码绑定数据到布局上面，自动生成页面内容就可以了。

拆分出单个模板来，很明显每项都是一样的

就这个样式写div+css不会吗？

两层div 的嵌套，里面布局排文本标签，image标签就可以了，绑定id填数据，或者遍历填数据。

简单布局是一种，再就是

这种

图片看不太清，是不是下面的效果。

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

body{margin:0 autopadding: 0 auto}

.wrap{margin:0 autopadding:0 autowidth:960px}

.header{height:100pxbackground: #0cc}

.login-right{width:480pxheight:400pxfloat:rightbackground: #3cc}

.login-left{width:480pxheight:400pxbackground: #33ff33}

.footer{width:960pxheight:100pxbackground: #3cc}

</style>

</head>

<body>

<div class="wrap">

<div class="header">header</div>

<div class="login-right">login-left</div>

<div class="login-left">login-right</div>

<div class="footer">footer</div>

</div>

</body>

</html>