Web前端学习记录(十一)

其他 2020-03-29 10:54:49 阅读次数: 0

实现用户模拟登陆：

w：不得不说，这次的代码量很多。
y：哦？就这？
w：……
w：先看一下预览截图吧。
在这里插入图片描述
输入用户名admin密码admin后：
在这里插入图片描述
先上main.html的代码：

main.html:
<!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=utf-8" />
  <title>漫步时尚广场后台管理系统</title>
  <script type="text/javascript">
		window.onload=function(){
			var flag=0;//保存用户状态（用户未登录）
			do{
				//使用数组保存用户名和密码
				var array=[["admin","admin"],["itshixun","itshixun"],
							["guoqy","123"]];
				var userName = prompt("请输入用户名：");
				var userPwd = prompt("请输入密码：");
				for (var i=0; i<array.length; i++) {
					if (array[i][0]==userName&&array[i][1]==userPwd) {
						alert("用户登陆成功，欢迎<"+userName+">使用本系统!");
						//获取topFrame框架对应的页面中的class属性为”user”的元素，
						//然后再从中筛选<span>标签，最后修改标签中的内容
						topFrame.document.getElementsByClassName("user")[0]
						  .getElementsByTagName("span")[0].innerHTML=userName;
						flag=1;//用户登录成功
						break;
					}
					if(userName==null&&userPwd==null){
						flag=2;//用户取消登录
					}
				}
				if(flag==0){
					alert("用户名或密码错误，请重新登录。");
				}
			}while(flag==0);
		}
	</script>
 </head>
 <frameset rows="88,*" cols="*" frameborder="no" border="0" framespacing="0">
    <frame src="top.html" name="topFrame" scrolling="no" noresize="noresize" 
        id="topFrame" title="topFrame" />
    <frameset cols="187,*" frameborder="no" border="0" framespacing="0">
      <frame src="left.html" name="leftFrame" scrolling="no" noresize="noresize"
         id="leftFrame" title="leftFrame" />
      <frame src="shoplist.html" name="rightFrame" id="rightFrame"
         title="rightFrame" />
    </frameset>
 </frameset>
 <noframes>
    <body>您的浏览器不支持框架集 </body>
 </noframes>
</html>

y：哦？就这？
w：还没完呢！

<frameset rows="88,*" cols="*" frameborder="no" border="0" framespacing="0">
    <frame src="top.html" name="topFrame" scrolling="no" noresize="noresize" 
        id="topFrame" title="topFrame" />
    <frameset cols="187,*" frameborder="no" border="0" framespacing="0">
      <frame src="left.html" name="leftFrame" scrolling="no" noresize="noresize"
         id="leftFrame" title="leftFrame" />
      <frame src="shoplist.html" name="rightFrame" id="rightFrame"
         title="rightFrame" />
    </frameset>
 </frameset>

这一部分，还涉及了另外三个html。
y：所以呢？就这？
w(我还能忍)：先上一个共用的css：

layout.css:
@charset "utf-8";
*{
	font-size:9pt;
	border:0;
	margin:0;
	padding:0;
}
body{
	font-family:'微软雅黑'; 
	margin:0 auto;
}
ul,li{
	display:block;
	margin:0;
	padding:0;
	list-style:none;
}
img{
	border:0;
}
.date_text{
	font-size:12px; 
	float:right;
	line-height:45px; 
	padding-right:20px;
}
dl,dt,dd{
	margin:0;
	padding:0;
	display:block;
}
a,a:focus{
	text-decoration:none;
	color:#000;
	outline:none;
}
a:hover{
	color:#00a4ac;
	text-decoration:none;
}
table{
	border-collapse:collapse;
	border-spacing: 0;
}
cite{
	font-style:normal;
}
h2{
	font-weight:normal;
}
.floatl{
	float:left;
}
.floatr{
	float:right;
}
input{
	font-family:Tahoma,'微软雅黑','宋体';
}
.orange14{
	font-size:14px;
	font-weight:bold; 
	color:orange;
}
textarea{
	border:1px solid #a7b5bc;
	width:500px;
	height:60px;
}

然后第一个top.html:

top.html
<!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=utf-8" />
<title>上方导航栏</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/top.css" rel="stylesheet" type="text/css" />
</head>
<body style="background:url(images/topbg.gif) repeat-x;">
<div class="topleft"> <a href="../index.html" target="_parent"><img src="images/logo.png" title="系统首页" /></a> </div>
<ul class="nav">
  <li><a href="../index.html" target="_parent" class="selected"><img  src="images/globe.png"title="网站前台" />
    <h2>网站前台</h2>
    </a></li>
  <li><a href="index.html"  target="rightFrame"><img src="images/home.png"  title="后台首页" />
    <h2>后台首页</h2>
    </a></li>
  <li><a href="addgoods.html" target="rightFrame"><img src="images/shop.png" title="添加商品" />
    <h2>添加商品</h2>
    </a></li>
  <li><a href="addmovie.html" target="rightFrame"><img src="images/movie.png" title="添加影视" />
    <h2>添加影视</h2>
    </a></li>
  <li><a href="addfood.html" target="rightFrame"><img src="images/food.png" title="添加餐饮" />
    <h2>添加餐饮</h2>
    </a></li>
</ul>
<div class="topright">
  <ul>
    <li><span><img src="images/help.png" title="帮助"  class="helpimg"/></span><a href="#">帮助</a></li>
    <li><a href="#">关于</a></li>
    <li><a href="login.html" target="_parent">退出</a></li>
  </ul>
  <div class="user"><span>用户未登录</span> <i>消息</i> <b>5</b> </div>
</div>
</body>
</html>
top.css:
@charset "utf-8";
.header{
	height:88px;
}
.topleft{
	height:88px;
	background:url(../images/topleft.jpg) no-repeat;
	float:left; 
	width:300px;
}
.topleft img{
	margin-top:12px;
	margin-left:10px;
}
.topright{
	height:88px;
	background:url(../images/topright.jpg) no-repeat right;
	float:right;
}
.nav{
	float:left;
}
.nav li{
	float:left;
	width:87px;
	height:88px; 
	text-align:center;
}
.nav li a{
	display:block;
	width:87px;
	height:88px;
	-moz-transition: none; 
	transition: background-color 0.3s linear; 
	-moz-transition: background-color 0.3s linear; 
	-webkit-transition: background-color 0.3s linear; 
	-o-transition: background-color 0.3s linear; 
}
.nav li a.selected{
	background:url(../images/navbg.png) no-repeat;
}
.nav li a:hover{
	display:block;
	background:#000;
	color:#fff;
	background: none repeat scroll 0% 0% rgb(43, 127, 181);
}
.nav li img{
	margin-top:10px;
}
.nav li a{
	display:block;
}
.nav a h2{
	font-size:14px;color:#d6e8f1;
}
.nav a:hover h2{
	color:#fff;
}
.topright ul{
	padding-top:15px; 
	float:right; 
	padding-right:12px;
}
.topright ul li{
	float:left; 
	padding-left:9px; 
	padding-right:9px; 
	background:url(../images/line.gif) no-repeat right;
}
.topright ul li:last-child{
	background:none;
}
.topright ul li a{
	font-size:13px; 
	color:#e9f2f7;
}
.topright ul li a:hover{
	color:#fff;
}
.topright ul li span{
	margin-top:2px;
	float:left;
	padding-right:3px;
}
.user{
	height:30px;
	background:url(../images/ub1.png) repeat-x;
	clear:both;margin-top:10px;float:right; 
	margin-right:12px;border-radius:30px;  
	white-space:nowrap;position:relative;
}
.user span{
	display:inline-block;
	padding-right:10px; 
	background:url(../images/user.png) no-repeat 15px 10px; 
	line-height:30px; font-size:14px;
	color:#b8ceda; padding-left:20px; 
	padding-left:35px;
}
.user b{
	display:inline-block;
	width:20px;
	height:18px; 
	background:url(../images/msg.png);
	text-align:center; 
	font-weight:normal; 
	color:#fff;font-size:14px;
	margin-right:13px; 
	margin-top:7px; 
	line-height:18px;
}
.user i{
	display:inline-block;
	margin-right:5px;
	font-style:normal;
	line-height:30px; 
	font-size:14px;
	color:#b8ceda;
}

y：你继续？
w：left.html:

left.html:
<!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=utf-8" />
<title>左侧导航栏</title>
<link href="css/left.css" rel="stylesheet" type="text/css" />
</head>
<body style="background:#f0f9fd;">
<div class="lefttop"><span></span>功能菜单</div>
<dl class="leftmenu">
  <dd>
    <div class="title"> <span><img src="images/leftico05.png" /></span>购物后台管理 </div>
    <ul class="menuson">
      <li><cite></cite><a href="addgoods.html" target="rightFrame">添加商品</a><i></i></li>
      <li class="active"><cite></cite><a href="shoplist.html" target="rightFrame">商品列表</a><i></i></li>
      <li><cite></cite>商品类型<i></i></li>
    </ul>
  </dd>
  <dd>
    <div class="title"> <span><img src="images/leftico02.png" /></span>影视后台管理 </div>
    <ul class="menuson">
      <li><cite></cite><a href="addmovie.html" target="rightFrame">添加影片</a><i></i></li>
      <li class="active"><cite></cite><a href="movielist.html" target="rightFrame">影片列表</a><i></i></li>
      <li><cite></cite>影片类型<i></i></li>
    </ul>
  </dd>
  <dd>
    <div class="title"><span><img src="images/leftico05.png" /></span>餐饮后台管理</div>
    <ul class="menuson">
      <li><cite></cite><a href="addfood.html" target="rightFrame">添加美食</a><i></i></li>
      <li class="active"><cite></cite><a href="foodlist.html" target="rightFrame">美食列表</a><i></i></li>
      <li><cite></cite>美食类型<i></i></li>
    </ul>
  </dd>
  <dd>
    <div class="title"><span><img src="images/leftico04.png" /></span>订单管理</div>
    <ul class="menuson">
      <li><cite></cite><a href="#">最新订单</a><i></i></li>
      <li><cite></cite><a href="#">已处理订单</a><i></i></li>
      <li><cite></cite><a href="#">取消订单</a><i></i></li>
    </ul>
  </dd>
  <dd>
    <div class="title"><span><img src="images/leftico04.png" /></span>交易记录</div>
  </dd>
  <dd>
    <div class="title"><a href="jqueryChart.html"  target="rightFrame"><span><img src="images/leftico06.png" /></span>统计报表</a></div>
  </dd>
  <dd>
    <div class="title"><span><img src="images/leftico04.png" /></span>权限分配</div>
  </dd>
  <dd>
    <div class="title"><span><img src="images/leftico08.png" /></span>修改密码</div>
  </dd>
  <dd>
    <div class="title"><span><img src="images/leftico07.png" /></span>系统设置</div>
  </dd>
</dl>
</body>
</html>
left.css:
@charset "utf-8";
*{
	font-size:9pt;
	border:0;
	margin:0;
	padding:0;
}
body{
	font-family:'微软雅黑'; 
	margin:0 auto;
	min-width:980px;
}
ul{
	display:block;
	margin:0;
	padding:0;
	list-style:none;
}
li{
	display:block;
	margin:0;
	padding:0;
	list-style: none;
}
dl,dt,dd{
	margin:0;
	padding:0;
	display:block;
}
a,a:focus{
	text-decoration:none;
	color:#000;
	outline:none;
}
a:hover{
	color:#00a4ac;
	text-decoration:none;
}

/*left.html*/
.lefttop{
	background:url(../images/lefttop.gif) repeat-x;
	height:40px;
	color:#fff;
	font-size:14px;
	line-height:40px;
}
.lefttop span{
	margin-left:8px; 
	margin-top:10px;
	margin-right:8px; 
	background:url(../images/leftico.png) no-repeat; 
	width:20px; 
	height:21px;
	float:left;
}
.leftmenu{
	width:187px;
	padding-bottom: 9999px;
	margin-bottom: -9999px; 
	overflow:hidden; 
	background:url(../images/leftline.gif) repeat-y right;
}
.leftmenu dd{
	background:url(../images/leftmenubg.gif) repeat-x;
	line-height:35px;
	font-weight:bold;
	font-size:14px;
	border-right:solid 1px #b7d5df;
}
.leftmenu dd span{
	float:left;
	margin:10px 8px 0 12px;
}
.leftmenu dd .menuson{
	display:none;
}
.leftmenu dd:first-child .menuson{
	display:block;
}
.menuson {
	line-height:30px; 
	font-weight:normal; 
}
.menuson li a{
	cursor:pointer;
}
.menuson li.active{
	position:relative; 
	background:url(../images/libg.png) repeat-x; 
	line-height:30px; 
	color:#fff;
}
.menuson li cite{
	display:block; 
	float:left; 
	margin-left:32px; 
	background:url(../images/list.gif) no-repeat; 
	width:16px; 
	height:16px; 
	margin-top:7px;
}
.menuson li.active cite{
	background:url(../images/list1.gif) no-repeat;
}
.menuson li.active i{
	display:block; 
	background:url(../images/sj.png) no-repeat; 
	width:6px; 
	height:11px; 
	position:absolute; 
	right:0;
	z-index:10000; 
	top:9px; 
	right:-1px;
}
.menuson li a{ 
	display:block;
	*display:inline; 
	*padding-top:5px;
}
.menuson li.active a{
	color:#fff;
}
.title{
	cursor:pointer;
}

最后还有shopping_list.html:

shoplist.html:
<!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=utf-8" />
<title>餐饮列表页面-后台管理</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/list.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="place"> <span>位置：</span>
  <ul class="placeul">
    <li><a href="main.html">首页</a></li>
    <li><a href="#">购物后台管理</a></li>
    <li><a href="#">商品列表</a></li>
  </ul>
  <div class="date_text"><img src="images/leftico04.png">&nbsp;今天是2015年2月10日 星期一 12：00</div>
</div>
<div class="rightinfo">
  <div class="tools">
    <ul class="toolbar">
      <li ><span><img src="images/t01.png" /></span>添加</li>
      <li ><span><img src="images/t02.png" /></span>修改</li>
      <li class="click"><span><img src="images/t03.png" /></span>删除</li>
      <li><a href="jqueryChart.html"><span><img src="images/t04.png" /></span>统计</a></li>
      <li><span><img src="images/t05.png" /></span>设置</li>
    </ul>
    <iframe src="shop_search.html" scrolling="no" frameborder="0" width="400" height="42"></iframe>
  </div>
  <table class="tablelist">
    <thead>
      <tr>
        <th><input name="" type="checkbox" value="" checked="checked"/></th>
        <th>缩略图</th>
        <th>商品名称</th>
        <th>商品类别</th>
        <th>数量(件）</th>
        <th>单价（元）</th>
        <th>发布时间</th>
        <th>是否审核</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td><input name="" type="checkbox" value="" /></td>
        <td class="imgtd"><img src="images/img06.png" /></td>
        <td>RAX 头层牛皮户外鞋 男防滑登山鞋减震</td>
        <td>运动</td>
        <td>334</td>
        <td>¥566.00</td>
        <td>2015-06-06 15:05</td>
        <td>已审核</td>
        <td><a href="#" class="tablelink">查看</a> <a href="#" class="tablelink"> 删除</a></td>
      </tr>
      <tr class="odd">
        <td><input name="" type="checkbox" value="" /></td>
        <td class="imgtd"><img src="images/img07.png" /></td>
        <td>七匹狼休闲裤 春夏新款 男士时尚无褶休闲裤</td>
        <td>男装</td>
        <td>455</td>
        <td>¥236.00</td>
        <td>2015-06-08 14:02</td>
        <td>未审核</td>
        <td><a href="#" class="tablelink">查看</a> <a href="#" class="tablelink">删除</a></td>
      </tr>
      <tr>
        <td><input name="" type="checkbox" value="" /></td>
        <td class="imgtd"><img src="images/img08.png" /></td>
        <td>欧美大牌五分袖收腰显瘦睫毛蕾丝连衣裙 粉色 </td>
        <td>女装</td>
        <td>899</td>
        <td>¥136.00</td>
        <td>2015-06-07 13:16</td>
        <td>未审核</td>
        <td><a href="#" class="tablelink">查看</a> <a href="#" class="tablelink">删除</a></td>
      </tr>
      <tr class="odd">
        <td><input name="" type="checkbox" value="" /></td>
        <td class="imgtd"><img src="images/img09.png" /></td>
        <td>锐步REEBOK热2015新款线上独家复古GL 2620运动生活休闲鞋男鞋</td>
        <td>运动</td>
        <td>3456</td>
        <td>¥346.00</td>
        <td>2015-06-06 10:36</td>
        <td>已审核</td>
        <td><a href="#" class="tablelink">查看</a> <a href="#" class="tablelink">删除</a></td>
      </tr>
      <tr>
        <td><input name="" type="checkbox" value="" /></td>
        <td class="imgtd"><img src="images/img10.png" /></td>
        <td>新款中大童荷叶边短袖裙子韩版儿童公主裙女童连衣裙 </td>
        <td>童装</td>
        <td>678</td>
        <td>¥316.00</td>
        <td>2015-06-05 13:25</td>
        <td>已审核</td>
        <td><a href="#" class="tablelink">查看</a> <a href="#" class="tablelink">删除</a></td>
      </tr>
    </tbody>
  </table>
  <div class="pagin">
    <div class="message">共<i class="blue">1256</i>条记录，当前显示第&nbsp;<i class="blue">2&nbsp;</i>页</div>
    <ul class="paginList">
      <li class="paginItem"><a href="#"><span class="pagepre"></span></a></li>
      <li class="paginItem"><a href="#">1</a></li>
      <li class="paginItem current"><a href="#">2</a></li>
      <li class="paginItem"><a href="#">3</a></li>
      <li class="paginItem"><a href="#">4</a></li>
      <li class="paginItem"><a href="#">5</a></li>
      <li class="paginItem more"><a href="#">...</a></li>
      <li class="paginItem"><a href="#">10</a></li>
      <li class="paginItem"><a href="#"><span class="pagenxt"></span></a></li>
    </ul>
  </div>
</div>
</body>
</html>
list.css:
@charset "utf-8";
.place{
	height:40px; 
	background:url(../images/righttop.gif) repeat-x;
}
.place span{
	line-height:40px; 
	font-weight:bold;
	float:left; 
	margin-left:12px;
}
.placeul li{
	float:left; 
	line-height:40px; 
	padding-left:7px; 
	padding-right:12px; 
	background:url(../images/rlist.gif) no-repeat right;
}
.placeul li:last-child{
	background:none;
}
.rightinfo{
	padding:8px;
}
.tools{
	clear:both; 
	height:35px; 
	margin-bottom:8px;
}
.toolbar{
	float:right;
}
.toolbar li{
	background:url(../images/toolbg.gif) repeat-x; 
	line-height:33px; height:33px; 
	border:solid 1px #d3dbde; 
	float:left; 
	padding-right:10px; 
	margin-right:5px;
	border-radius: 3px;  
	cursor:pointer;
}
.toolbar li span{
	float:left; 
	margin-left:10px; 
	margin-right:5px; 
	margin-top:5px;
}
.toolbar1{
	float:right;
}
.toolbar1 li{
	background:url(../images/toolbg.gif) repeat-x; 
	line-height:33px; height:33px; 
	border:solid 1px #d3dbde; 
	float:left; 
	padding-right:10px; 
	margin-left:5px;
	border-radius: 3px; 
}
.toolbar1 li span{
	float:left; 
	margin-left:10px; 
	margin-right:5px; 
	margin-top:5px;
}
.imgtable{
	width:100%;
	border:solid 1px #cbcbcb; 
}
.imgtable th{
	background:url(../images/th.gif) repeat-x; 
	height:34px; 
	line-height:34px; 
	border-bottom:solid 1px #b6cad2; 
	text-indent:21px; 
	text-align:left;
}
.imgtable td{
	line-height:20px; 
	text-indent:21px; 
	border-right: dotted 1px #c7c7c7;
}
.imgtable td img{
	margin:10px 20px 10px 0;
}
.imgtable td p{
	color:#919191;
}
.imgtable td i{
	font-style:normal; 
	color:#ea2020;
}
.imgtd{
	text-indent:0;
}
.imgtable tbody tr.odd{
	background:#f5f8fa;
}
.imgtable tbody tr:hover{
	background:#e5ebee;
}
.intro_width{
	width:300px;word-wrap:break-word; overflow:hidden;
}
/*seachform*/
.seachform{ 
	height:42px; 
}
.seachform li{
	float:left; 
	margin-right:15px;
}
.seachform li label{
	padding-right:10px; 
	float:left; 
	line-height:32px;
}
.scinput{
	width:180px; 
	height:32px; 
	line-height:32px; 
	border-top:solid 1px #a7b5bc; 
	border-left:solid 1px #a7b5bc; 
	border-right:solid 1px #ced9df; 
	border-bottom:solid 1px #ced9df; 
	background:url(../images/inputbg.gif) repeat-x; 
	text-indent:10px; color:#999;
}
.scbtn{
	width:85px;
	height:35px; 
	background:url(../images/btnbg.png) no-repeat center; 
	font-size:14px;
	font-weight:bold;
	color:#fff; 
	cursor:pointer;
	border-radius:3px; 
}
select{
	background:url(../images/inputbg.gif) repeat-x;
	_background:none;
	_border:none;height:32px; 
	border-top:solid 1px #a7b5bc; 
	border-left:solid 1px #a7b5bc; 
	border-right:solid 1px #ced9df; 
	border-bottom:solid 1px #ced9df;
	padding:5px;
}
.tablelist{
	border:solid 1px #cbcbcb; 
	width:100%; 
	clear:both;
}
.tablelist th{
	background:url(../images/th.gif) repeat-x; 
	height:34px; 
	line-height:34px; 
	border-bottom:solid 1px #b6cad2; 
	text-indent:11px; 
	text-align:left;
}
.tablelist td{
	line-height:35px; 
	text-indent:11px; 
	border-right: dotted 1px #c7c7c7;
}
.tablelink{
	color:#056dae;
}
.tablelist tbody tr.odd{
	background:#f5f8fa;
}
.tablelist tbody tr:hover{
	background:#e5ebee;
}
/*page分页*/
.pagin{
	position:relative;
	margin-top:10px;
	padding:0 12px;
}
.pagin .blue{
	color:#056dae;
	font-style:normal;
}
.pagin .paginList{
	position:absolute;
	right:12px;
	top:0;
}
.pagin .paginList .paginItem{
	float:left;
}
.pagin .paginList .paginItem a{
	float:left;
	width:31px;
	height:28px;
	border:1px solid #DDD; 
	text-align:center;
	line-height:30px;
	border-left:none;
	color:#3399d5;
}
.pagin .paginList .paginItem:first-child a{
	border-left:1px solid #DDD;
}
.pagin .paginList .paginItem:first-child a{
	border-bottom-left-radius:5px;
	border-top-left-radius:5px;
}
.pagin .paginList .paginItem:last-child a{
	border-bottom-right-radius:5px;
	border-top-right-radius:5px;
}
.pagin .paginList .paginItem.current,.pagin .paginList .paginItem.current a{
	background:#f5f5f5; 
	cursor:default;
	color:#737373;
}
.pagin .paginList .paginItem:hover{
	background:#f5f5f5;
}
.pagin .paginList .paginItem.more,.pagin .paginList .paginItem.more a:hover{ 
	cursor:default;
}
.pagin .paginList .paginItem.more:hover{
	background:#FFF;
}
.pagin .paginList .paginItem.more a{
	color:#737373;
}
.pagepre{
	background:url(../images/pre.gif) no-repeat center center; 
	width:31px; 
	height:28px;
}
.pagenxt{
	background:url(../images/next.gif) no-repeat center center; 
	width:31px; 
	height:28px;
}

y：我受够了，ok?
w：no ok！
y：？？？？？？
w：

<iframe src="shop_search.html" scrolling="no" frameborder="0" width="400" height="42"></iframe>

这里，shop_search.html:

shop_search.html:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>商品检索</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/list.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ul class="seachform">
  <li>
    <div class="vocation">
      <select class="select3">
        <option>商品类别</option>
        <option>女装</option>
        <option>男装</option>
        <option>童装</option>
        <option>运动</option>
      </select>
    </div>
  </li>
  <li>
    <input type="text" class="scinput" value="请输入商品名称"/>
  </li>
  <li>
    <input name="searchBtn" type="button" class="scbtn" value="查询"/>
  </li>
</ul>
</body>
</html>

w：ok！
y：ok？就这？溜了溜了……

fakerth
发布了46 篇原创文章 · 获赞 237 · 访问量 6076
私信 关注

猜你喜欢

转载自blog.csdn.net/weixin_43912621/article/details/105158837
今日推荐
TIOBE 5 月榜单：Fortran “复活”进入 Top 10
GCC 14.1 发布
面壁智能发布 Eurux-8x22B 开源大模型 —— 堪称「理科状元」
开源日报 | 谷歌扶持鸿蒙上位；开源Rabbit R1；Docker加持的安卓手机；微软的焦虑和野心；海尔电器把开放平台关了
中国码农的“35岁魔咒”
蘭雅 CorelDRAW 插件 2024.5.1 国际劳动节版，免费下载
Arc Browser for Windows 1.0 正式 GA
90后程序员开发视频搬运软件、不到一年获利超 700 万，结局很刑！
周排行
Java自定义时间格式
同步整形电路
在开发中最最最常用的字符串的属性大集合
Linux 查看端口占用并杀掉
Java基础四：ArrayList
多线程之死锁就是这么简单
mysql 基础命令集
awk 命令详解
Centos6.3编译安装nginx+php步骤
OCR （Optical Character Recognition，光学字符识别）
每日归档
更多
2024-05-08(42)
2024-05-07(14)
2024-05-06(40)
2024-05-05(0)
2024-05-04(7)
2024-05-03(19)
2024-05-02(0)
2024-05-01(4)
2024-04-30(1)
2024-04-29(40)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022