<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>小米商城-小米11、Redmi Note 9、小米MIX
Alpha，小米电视官方网站</title>
<link rel="icon" href="https://s01.mifile.cn/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="./tubiao/font_4285954_bi4k1j1vdz8/iconfont.css">
<style>
.w{
margin: 0 auto;
width: 1226px;
}
* {
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
}
body {
background-color: rgb(250, 250, 250);
}
/* 头部导航 */
.header {
height: 40px;
width: 1226px;
background-color: rgb(51, 51, 51);
position: relative;
}
.left>li {
float: left;
line-height: 40px;
}
.right>li {
float: left;
line-height: 40px;
height: 100%;
}
.right {
float: right;
}
.left>li>a {
font-size: 12px;
border-right: 1px solid rgb(66, 66, 66);
padding: 0px 5px;
color: rgb(176, 176, 176);
}
.right>li>a {
font-size: 12px;
padding: 0px 5px;
color: rgb(176, 176, 176);
border-right: 1px solid rgb(66, 66, 66);
}
.left>li>a:hover {
color: white;
}
.right>li>a:hover {
color: white;
/* display: block; */
}
.right>li>.iconfont {
display: block;
width: 80px;
height: 40px;
border-right: none;
background-color: rgb(66, 66, 66);
}
.right>li>.iconfont:hover+.gouwuce {
background-color: white;
color: rgb(255, 125, 140);
display: block;
}
.right>li>.iconfont:hover {
background-color: white;
color: rgb(255, 125, 140);
}
.border1 {
border-right: none;
}
.gouwuce {
display: none;
height: 100px;
width: 300px;
line-height: 100px;
z-index: 1;
position: absolute;
right:0px;
top: 40px;
/* border: 1px solid black; */
background-color: white;
}
/* 导航区 */
.nav {
height: 100px;
width: 1226px;
/* background-color: blanchedalmond; */
position: relative;
}
.logo {
width: 100px;
height: 100px;
/* border: 1px solid black; */
/* float: left; */
}
.logo>img {
width: 56px;
height: 56px;
margin: 20px;
}
/* 中间菜单 */
.navc {
width: 800px;
height: 100px;
/* background-color: aquamarine; */
float: left;
}
.nacv>ul>li {
float: left;
}
.navc {
float: left;
position: absolute;
top: 0px;
left: 100px;
/* border: 1px solid red; */
}
.navc>ul{
margin-left: 100px;
}
.navc>ul>li {
float: left;
line-height: 100px;
}
.navc>ul>li>a {
padding: 0px 10px;
color: black;
font-size: 14px;
}
.na1 {
width: 150px;
height: 100px;
}
.shouji>li {
width: 200px;
height: 300px;
margin-top: 0px 10px;
line-height: 30px;
}
.shouji>li>p {
margin: 0px;
}
.sj {
color: rgb(255, 120, 28);
}
.shouji {
position: absolute;
height: 200px;
width: 1266px;
background-color: white;
left: -100px;
/* height: 200px;
width: 100px; */
top: 100px;
display: none;
z-index: 4;
}
.shouji>li {
float: left;
/* margin: 0 auto; */
/* border: 2px solid red; */
text-align: center;
}
.shouji>li>a {
border-right: 1px solid black;
display: inline-block;
margin-top: 20px;
}
.navc>ul>li>a:hover+.shouji {
display: block;
}
.input {
height: 100px;
width: 300px;
/* background-color: rgb(25, 227, 25); */
position: absolute;
top: 0px;
right: 0px;
text-align: center;
}
.case {
width: 300px;
height: 60px;
position: relative;
margin-top: 20px;
border: 1px solid rgb(176, 176, 176);
}
input {
width: 250px;
height: 60px;
outline: none;
border: none;
}
button {
position: absolute;
top: 0;
right: 0;
width: 60px;
height: 60px;
outline: none;
border: none;
border-left: 1px solid rgb(176, 176, 176);
/* background-color: rgb(214, 194, 234); */
background-color: white;
}
.case:active {
border-color: rgb(255, 103, 0);
}
.case:active button {
border-color: rgb(255, 103, 0);
}
button:hover {
background-color: rgb(255, 103, 0);
color: white;
}
.llists{
width: 210px;
position: absolute;
background-color: white;
z-index: 5;
border: 1px solid rgb(255, 103, 0);
padding-left: 30px;
display: none;
}
.llists>li{
height: 30px;
text-align: left;
font-size: 14px;
color: rgb(66, 66, 127);
}
.case:active+.llists{
display: block;
border-top: none;
}
/* 主体 */
.main {
height: 500px;
width: 1226px;
background-color: hotpink;
position: relative;
}
/* 侧边栏 */
.cebianlan {
position: absolute;
/* position: relative; */
z-index: 2;
top: 0;
left: 0;
background-color: rgb(4, 5, 7);
width: 250px;
}
.cebianlan>ul>li {
height: 30px;
width: 260px;
line-height: 30px;
/* border: 1px solid black; */
/* margin: 20px 10px; */
padding: 10px 20px;
/* margin: 20px 0px; */
}
.icon-jiantouyou {
float: right;
}
.cebianlan>ul>li>a {
color: white;
}
.cebianlan>ul>li:hover {
background-color: rgb(255, 103, 0);
}
.cebianlan>ul>li:hover .biaoge {
display: block;
}
.image {
height: 500px;
width
小米商城首页及登录页的压缩包
需积分: 0 108 浏览量
2023-12-19
19:33:09
上传
评论
收藏 3.83MB ZIP 举报
xm.zip （34个子文件） 
登录页.html 7KB
image 
2.jpg 895KB red.jpg 192KB
s6.png 11KB dao1.png 8KB s1.jpg 140KB 3.png 963KB s2.jpg 39KB 6.jpg 69KB s7.jpg 36KB na1.png 47KB 1.png 47KB 5.jpg 92KB s9.jpg 41KB mm.png 1.04MB xiaomisangou.png 12KB 11.jpg 21KB logo.jpg 7KB s3.jpg 44KB s5.png 37KB www.png 2KB s4.jpg 36KB s8.jpg 43KB 4.jpg 63KB
flexible.js 1KB tubiao font_4285954_bi4k1j1vdz8 demo.css 8KB demo_index.html 19KB iconfont.ttf 6KB iconfont.css 1KB iconfont.json 3KB iconfont.woff2 3KB iconfont.js 19KB iconfont.woff 4KB 小米商城.html 34KB资源评论
诗霖雪
- 粉丝: 1155
- 资源: 5
最新资源
- 基于matlab实现 powell算法 用matlab实现，使用方法内附详细说明.rar
- 基于matlab的手写字体识别程序，并对结果进行保存.rar
- 基于c语言指纹识别demo代码 包括了指纹图像方向图计算、频率计算、gabor滤波器增强，细化，特征点提取，特征点匹配.rar
- 基于c++NSGA-2思想的多目标优化程序，采用进化算法处理多目标实值优化问题.rar
- Linux系统中常用权限管理命令
- Coello Coello等人提出了MOPSO 该程序基于matlab实现针对测试函数matlab程序
- Linux系统中常用权限管理命令
- AIR-AP1815-K9-ME-8-5-182-0.tar For Cisco AP1815
- 实验七.zip
- ESP8266刷固件软件flash-download-tools-v3.6.5，AT固件，机智云固件
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
