Login页面代码：
</head>
<body>
<center>
<div class="first">
<img src="C:\Users\Administrator\Desktop\HTML_2file\Image\Title.png" width="400px"><br/><br/><br/>
<center>
<form id="form1" method="post" action="Index.html">
<font color="#C8BFE7" size="4">账号：</font> <input type="text"/><br/><br/>
<font color="#C8BFE7" size="4">密码：</font> <input type="password"/><br/><br/>
<a href="#"><font color="#DCDCDC" size="2">注册账号</font></a>
<a href="#"><font color="#DCDCDC" size="2">忘记密码</font></a><br/><br/><br/>
<input name="submit" type="image" value="subm" src="C:\Users\Administrator\Desktop\HTML_2file\Image\login.png"/>
</form>
</center>
</div>
</center>
</body>
</html>界面：
Index页面代码：
<!DOCTYPE HTML>
<html>
<head>
<title>Index</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<center>
<div class="index">
<img src="C:\Users\Administrator\Desktop\HTML_2file\Image\Title2.png" width="900px">
<div class="author" align="left">
<ul>
<font face="华文仿宋" size="6" color="#C8BFE7">作 者</font><br/><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">泰 戈 尔</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">林 清 玄</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">龙 应 台</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">王 安 石</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">李 清 照</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">贾 平 凹</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">陶 渊 明</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">白 居 易</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">刘 禹 锡</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">柳 宗 元</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">欧 阳 修</font></a><br/>
<a href="#"><font face="华文仿宋" size="5" color="#C8BFE7">关 汉 卿</font></a><br/>
</ul>
</div>
<div class="own" align="left">
<div class="sentence">
<p> 第一位网友：</p>
<p> 很喜欢陶渊明！！</p>
</div>
<div class="sentence">
<p> 第二位网友：</p>
<p> 很喜欢王安石！！</p>
</div>
<div class="sentence">
<p> 第三位网友：</p>
<p> 很喜欢泰戈尔！！</p>
</div>
<div class="sentence">
<p> 第四位网友：</p>
<p> 很喜欢陶渊明！！</p>
</div>
<div class="sentence">
<p> 第五位网友：</p>
<p> 很喜欢王安石！！</p>
</div>
<div class="sentence">
<p> 第六位网友：</p>
<p> 很喜欢泰戈尔！！</p>
</div>
<br/>
<div>
<textarea rows="5%" cols="70%">发表你的看法...</textarea>
<div align="right"><input type="submit" name="submit"/> </div>
</div>
</div>
</div>
</center>
</body>
</html>
界面：
CSS：
.login{
color:pink;
}
.first{
border:4px solid #C8BFE7;
width: 400px;
height: 400px;
margin-top: 100px;/*设置上边距*/
}
.index{
border: 4px solid #DCDCDC;
width: 900px;
height: 900px;
}
.author{
border: 1px solid #DCDCDC;
float: left;
width: 20%;
height:auto;
}
.own{
float: right;
width: 79%;
height: auto;
}
.sentence{
border:1px solid #DCDCDC;
width: 100%;
}
558
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
