HTML
首页
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>品优购首页</title>
<meta name="description" content="品优购.COM-专业的综合网上购物商城，销售家电、数码通讯、电脑、
家居百货、服饰服装、母婴、图书、食品等数万个优质产品" />
<meta name="keywords" content="网上购物、网上商城、手机、笔记本、电脑、数码、手表、存储卡" />
<link rel="stylesheet" href="css/base.css" />
<link rel="stylesheet" href="css/common.css" />
<link rel="stylesheet" href="css/index.css" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<section class="shortcut">
<div class="w">
<div class="fl">
<ul>
<li>欢迎使用品优购 </li>
<li><a href="register.html">登录</a> <a href="register.html" class="style_red">注册</a></li>
</ul>
</div>
<div class="fr">
<ul>
<li>我的订单</li>
<li></li>
<li class="arrow-icon iconfont">我的品优购</li>
<li></li>
<li>品优购会员</li>
<li></li>
<li>企业采购</li>
<li></li>
<li class="arrow-icon iconfont">关注品优购</li>
<li></li>
<li class="arrow-icon iconfont">客户服务</li>
<li></li>
<li class="arrow-icon iconfont">网址导航</li>
</ul>
</div>
</div>
</section>
<div class="header w">
<div class="logo">
<h1><a href="index.html" title="品优购商城">品优购商城</a></h1>
</div>
<div class="search">
<input type="search" name="" id="" placeholder="语言开发">
<button>搜索</button>
</div>
<div class="hotwords">
<a href="" class="style_red">优惠购首发</a>
<a href="">亿元优惠</a>
<a href="">每满99减30</a>
<a href="">办公用品</a>
<a href="">电脑</a>
<a href="">通信</a>
<a href="">9.9元团购</a>
</div>
<div class="shopcar">
添加购物车
<i class="count">8</i>
</div>
</div>
<div class="nav">
<div class="w">
<div class="dropdown">
<div class="dt">
全部商品分类
</div>
<div class="dd">
<ul>
<li><a href="list.html">家用电器</a></li>
<li><a href="list.html">手机</a>、<a href="">数码</a>、<a href="">通讯</a></li>
<li><a href="list.html">家用电器</a></li>
<li><a href="list.html">家用电器</a></li>
<li><a href="list.html">家用电器</a></li>
<li><a href="list.html">家用电器</a></li>
<li><a href="list.html">家用电器</a></li>
</ul>
</div>
</div>
<div class="navitems">
<ul>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
<li><a href="list.html">服装商城</a></li>
</ul>
</div>
</div>
</div>
<div class="w">
<div class="main">
<div class="focus">
<ul>
<li>
<img src="upload/box1.png" alt="">
</li>
</ul>
</div>
<div class="newsflash">
<div class="news">
<div class="news-hd">
<h5>品优快购</h5>
<a href="" class="more">更多</a>
</div>
<div class="news-bd">
<ul>
<li><a href="list.html"><strong>[重磅]</strong>备战开学季 全民优惠半折起</a></li>
<li><a href="list.html"><strong>[重磅]</strong>备战开学季 全民优惠半折起 精选优惠欢迎购买</a></li>
<li><a href="list.html"><strong>[重磅]</strong>备战开学季 全民优惠半折起</a></li>
<li><a href="list.html"><strong>[重磅]</strong>备战开学季 全民优惠半折起</a></li>
<li><a href="list.html"><strong>[重磅]</strong>备战开学季 全民优惠半折起</a></li>
</ul>
</div>
</div>
<div class="lifeservice">
<ul>
<li><i class="icon-1"></i><p>话费</p></li>
<li><i class="icon-2"></i><p>话费</p></li>
<li><i class="icon-3"></i><p>话费</p></li>
<li><i class="icon-4"></i><p>话费</p></li>
<li><i class="icon-5"></i><p>话费</p></li>
<li><i class="icon-6"></i><p>话费</p></li>
<li><i class="icon-7"></i><p>话费</p></li>
<li><i class="icon-8"></i><p>话费</p>
这篇博客详细介绍了品优购网站的构建过程，包括HTML结构设计和CSS样式布局。内容涵盖了首页、商品列表页和登录注册页的创建，使用了HTML5和CSS3技术，同时讨论了初始化样式、公共样式以及各页面的独特样式设计。
最低0.47元/天 解锁文章
扫一扫
1218
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
