使用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很好的例子...
 

很不错的后台div+css模板

  • 2013年11月05日 12:22
  • 30KB
  • 下载

使用bootstrap设计的后台管理界面

1 metro win8 风格模板 演示地址(http://www.js-css.cn/divcss/admin/metro/ )   2 多颜色主题功能强大ACE后台模...
  • JackieLiuLixi
  • JackieLiuLixi
  • 2014年07月14日 12:53
  • 7714

漂亮的后台系统管理页面DIV+CSS

  • 2008年11月27日 16:13
  • 12KB
  • 下载

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

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

超详细servlet+jdbc+html+css实现后台管理登陆

servlet+jdbc+html+css实现后台管理登陆咱们这篇文章继续上篇文章的完善。先给大家看看效果图吧! 这个简介的界面,大家可以自己去加以修改完善。 好了,开始步入正题。 这个we...
  • qq_21004057
  • qq_21004057
  • 2016年05月01日 14:34
  • 10955

自己刚学div的时候做的一个div+css的后台管理界面

  • 2009年07月03日 14:58
  • 485KB
  • 下载

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

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

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

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

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

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

一些网站后台模板源码分析

1 灰色简洁企业后台管理模板 效果; 看下项目结构; 它使用了modernizr, Modernizr-专为HTML5和CSS3开发的功能检测类库 Modernizr是一个开源的J...
  • bcbobo21cn
  • bcbobo21cn
  • 2016年04月28日 12:40
  • 3275
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:使用DIV+CSS定义的后台管理页面
举报原因:
原因补充:

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