计算机毕业设计——基于HTML仿淘宝电商项目的设计与实现管理系统论文源码(21页)

原创

IT司马青衫

发布于 2022-08-17 10:14:16

6200

发布于 2022-08-17 10:14:16

常见网页设计作业题材有个人、美食、公司、学校、旅游、电商、宠物、电器、茶叶、家居、酒店、舞蹈、动漫、服装、体育、化妆品、物流、环保、书籍、婚纱、游戏、节日、戒烟、电影、摄影、文化、家乡、鲜花、礼品、汽车、其他等网页设计题目, A+水平作业, 可满足大学生网页大作业网页设计需求都能满足你的需求。原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，画面精明，排版整洁，内容丰富，主题鲜明，非常适合初学者学习使用。

<font color='#b44846' size='4px'> ❤</font> 【作者主页——🔥获取更多优质源码】

<font color='#b44846' size='4px'> ❤</font> 【web前端期末大作业——🔥🔥毕设项目精品实战案例(1000套)】

@TOC

一、网页介绍📖

1 网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。

2.网页编辑：网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。

3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、音频元素、Flash，同时设计了Logo（源文件）所需的知识点。

一、网页效果🌌

二、代码展示😈

1.HTML结构代码 🧱

代码如下（示例）：以下仅展示部分代码供参考~

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link type="text/css" rel="stylesheet" href="css/style.css" />
  <script type="text/javascript" src="js/jquery-1.11.1.min_044d0927.js"></script>
  <script type="text/javascript" src="js/jquery.bxslider_e88acd1b.js"></script>

  <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
  <script type="text/javascript" src="js/menu.js"></script>

  <script type="text/javascript" src="js/select.js"></script>

  <script type="text/javascript" src="js/lrscroll.js"></script>

  <script type="text/javascript" src="js/iban.js"></script>
  <script type="text/javascript" src="js/fban.js"></script>
  <script type="text/javascript" src="js/f_ban.js"></script>
  <script type="text/javascript" src="js/mban.js"></script>
  <script type="text/javascript" src="js/bban.js"></script>
  <script type="text/javascript" src="js/hban.js"></script>
  <script type="text/javascript" src="js/tban.js"></script>

  <script type="text/javascript" src="js/lrscroll_1.js"></script>

  <title>尤洪</title>
</head>

<body>
  <!--Begin Header Begin-->
  <!-- <iframe
      src="./comm.html"
      frameborder="0"
      width="100%"
      height="220px"
    ></iframe> -->
  <!--Begin Header Begin-->
  <div class="soubg">
    <div class="sou">
      <!--Begin 所在收货地区 Begin-->
      <span class="s_city_b">
        <span class="fl">送货至：</span>
        <span class="s_city">
          <span>四川</span>
          <div class="s_city_bg">
            <div class="s_city_t"></div>
            <div class="s_city_c">
              <h2>请选择所在的收货地区</h2>
              <table border="0" class="c_tab" style="width: 235px; margin-top: 10px" cellspacing="0" cellpadding="0">
                <tr>
                  <th>A</th>
                  <td class="c_h"><span>安徽</span><span>澳门</span></td>
                </tr>
                <tr>
                  <th>B</th>
                  <td class="c_h"><span>北京</span></td>
                </tr>
                <tr>
                  <th>C</th>
                  <td class="c_h"><span>重庆</span></td>
                </tr>
                <tr>
                  <th>F</th>
                  <td class="c_h"><span>福建</span></td>
                </tr>
                <tr>
                  <th>G</th>
                  <td class="c_h">
                    <span>广东</span><span>广西</span><span>贵州</span><span>甘肃</span>
                  </td>
                </tr>
                <tr>
                  <th>H</th>
                  <td class="c_h">
                    <span>河北</span><span>河南</span><span>黑龙江</span><span>海南</span><span>湖北</span><span>湖南</span>
                  </td>
                </tr>
                <tr>
                  <th>J</th>
                  <td class="c_h">
                    <span>江苏</span><span>吉林</span><span>江西</span>
                  </td>
                </tr>
                <tr>
                  <th>L</th>
                  <td class="c_h"><span>辽宁</span></td>
                </tr>
                <tr>
                  <th>N</th>
                  <td class="c_h"><span>内蒙古</span><span>宁夏</span></td>
                </tr>
                <tr>
                  <th>Q</th>
                  <td class="c_h"><span>青海</span></td>
                </tr>
                <tr>
                  <th>S</th>
                  <td class="c_h">
                    <span>上海</span><span>山东</span><span>山西</span><span class="c_check">四川</span><span>陕西</span>
                  </td>
                </tr>
                <tr>
                  <th>T</th>
                  <td class="c_h"><span>台湾</span><span>天津</span></td>
                </tr>
                <tr>
                  <th>X</th>
                  <td class="c_h">
                    <span>西藏</span><span>香港</span><span>新疆</span>
                  </td>
                </tr>
                <tr>
                  <th>Y</th>
                  <td class="c_h"><span>云南</span></td>
                </tr>
                <tr>
                  <th>Z</th>
                  <td class="c_h"><span>浙江</span></td>
                </tr>
              </table>
            </div>
          </div>
        </span>
      </span>
      <!--End 所在收货地区 End-->
      <span class="fr">
        <span class="fl">你好，请<a href="Login.html">登录</a>&nbsp;
          <a href="Regist.html" style="color: #ff4e00">免费注册</a>&nbsp;|&nbsp;<a
            href="Member_Order.html">我的订单</a>&nbsp;|</span>
        <span class="ss">
          <div class="ss_list">
            <a href="shouca.html">收藏夹</a>
            <div class="ss_list_bg">
              <div class="s_city_t"></div>
              <div class="ss_list_c">
                <ul>
                  <li><a href="shouca.html">我的收藏夹</a></li>
                </ul>
              </div>
            </div>
          </div>
          <div class="ss_list">
            <a href="Member_Commission.html">我的佣金</a>
            <div class="ss_list_bg">
              <div class="s_city_t"></div>
              <div class="ss_list_c">
                <ul>
                  <li><a href="Member_Commission.html">我的佣金</a></li>
                </ul>
              </div>
            </div>
          </div>
          <div class="ss_list">
            <a href="Member.html">我的会员</a>
            <div class="ss_list_bg">
              <div class="s_city_t"></div>
              <div class="ss_list_c">
                <ul>
                  <li><a href="Member_Results.html">我的会员</a></li>
                </ul>
              </div>
            </div>
          </div>
        </span>
        <span class="fl">|&nbsp;关注我们：</span>
        <span class="s_sh"><a href="https://www.sina.com.cn/" class="sh1">新浪</a><a href="Brand.html"
            class="sh2">微信</a></span>
        <span class="fr">|&nbsp;<a href="##">手机版&nbsp;<img src="images/s_tel.png" align="absmiddle" /></a></span>
      </span>
    </div>
   </div>
</html>

2.CSS样式代码 🏠

body {
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-family: "Microsoft YaHei";
	line-height: 25px;
	color: #555555;
}

div,
table {
	margin: 0 auto;
}

a {
	color: #555555;
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	color: #ff4e00;
	text-decoration: none;
	cursor: pointer;
}

img {
	border: 0;
}

ul,
li,
dl,
dt,
dd {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-iframe {
	height: 430px !important;
}

.toop-iframe {
	height: 175px !important;
}

input,
io,
select,
checkbox {
	vertical-align: middle;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	padding: 0;
	margin: 0 auto;
}

.fl {
	float: left;
}

.fr {
	float: right;
}

form {
	margin: 0;
	padding: 0;
}

.none {
	display: none;
}

iframe {
	overflow: hidden;
}

/*html{ 
	-webkit-filter:grayscale(100%); filter:grayscale(100%);
}
html { overflow-y:scroll; filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%);}*/

/*html{
	filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);	
}*/



/*---------------header---------------*/
.soubg {
	width: 100%;
	min-width: 1200px;
	height: 35px;
	background-color: #f6f6f6;
	font-family: "宋体";
}

.sou {
	width: 1200px;
	height: 35px;
	line-height: 35px;
}

.s_city_b {
	width: 150px;
	height: 35px;
	float: left;
}