使用DIV+CSS定义的后台管理页面

原创 2007年09月26日 12:14:00

<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
<!--
#formstyle {
 width: 450px;
 margin-left: auto;
 margin-right: auto;
 border: 1px solid #0000FF;
 padding: 20px;
}
fieldset {
 border: 1px solid #0000FF;
}
fieldset legend {
 border: 1px solid #0000FF;
 font-weight: bold;
 padding-right: 15px;
 padding-left: 15px;
 padding-top: 3px;
 padding-bottom: 2px;
 margin-left: 20px;
 font-size: 12px;
}
fieldset div {
 height: 25px;
 font-size: 12px;
 padding-top: 5px;
}
fieldset label {
 float: right;
 margin-right: 180px;
}
.button {
 background-color: #33CCFF;
 border: 1px solid #3333FF;
 padding-right: 7px;
 padding-left: 7px;
 padding-top: 1px;
}
.text {
 height: 13px;
 background-color: #33CCFF;
 border-top-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-left-width: 1px;
 border-top-style: solid;
 border-right-style: solid;
 border-bottom-style: solid;
 border-left-style: solid;
}

-->
</style>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<div id="formstyle">
<h5>后台管理登录</h5>
<fieldset>
<legend>用户登陆</legend>

<div>
 <label>用户名:
  <input name="textfield" type="text" class="text" size="16" />
 </label>
</div>

<div>
 <label>密码:
  <input name="textfield2" type="text" class="text" size="16" />
 </label>
</div>

<div>
 <label>
  <input name="Submit" type="submit" class="button" value="提交" />
  <input name="Submit2" type="reset" class="button" value="重置" />
 </label>
</div>

</fieldset>
</div>

</form>
</body>
</html>

CSS样式表里面同时使用了 类.标签和ID 三大分类,是学习CSS+DIV很好的例子...
 

相关文章推荐

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

几十个网站后台模板css+div模板收集

很漂亮实用的后台模板,深蓝色风格,带登陆页面及后台操作页面,功能页面以选项卡形式打开,左边菜单效果也挺动感的,确实是个不错的后台模板。  请下载附件中的源码,不要直接复制 (已下载 31730 ...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

27款后台管理页面设计+DIV+CSS

  • 2011年06月09日 19:23
  • 4.86MB
  • 下载

[网页设计] 27款后台管理页面设计 DIV+CSS+JS

大家下载了,绝对实用 20091210_7dc437851cca3c1be186gQQL8YJHNSH7.jpg (51.47 KB, 下载次数: 1472) 下载附件  保存到相册 2...

DIV+CSS27款后台管理页面设计

  • 2011年12月05日 20:38
  • 4.75MB
  • 下载

27款后台管理页面设计 DIV CSS.rar

  • 2013年05月12日 11:29
  • 4.97MB
  • 下载

WEB前端-HTML-CSS-后台管理页面布局小例

作为一个后台管理页面,不必太过复杂,一般只需要三部分: 1、上层标签块; 2、左侧菜单块; 3、中部内容显示块;今天简要给大家分享一个布局中的一个小case; 需求:要求上层标签块、左侧菜单快...

27款后台管理页面设计 DIV CSS

  • 2013年01月11日 12:38
  • 4.87MB
  • 下载

DIV+CSS27款后台管理页面设计

  • 2012年03月27日 16:03
  • 4.18MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:使用DIV+CSS定义的后台管理页面
举报原因:
原因补充:

(最多只允许输入30个字)