仿小米官网(html+js+css)

【实例简介】
学习前端知识时写的一个仿小米官网的一些页面+css样式+js验证代码
【实例截图】
【核心代码】
小米官网(高仿)
└── xiaomi
├── css_1
│   ├── finance.css
│   ├── game.css
│   ├── login.css
│   ├── michat.css
│   ├── mitalkr.css
│   ├── mobile.css
│   ├── registered .css
│   ├── xiaomi_1.css
│   └── xiaomi_lg.jpg
├── css1
│   ├── font-awesome.css
│   └── font-awesome.min.css
├── fonts
│   ├── FontAwesome.otf
│   ├── fontawesome-webfont.eot
│   ├── fontawesome-webfont.svg
│   ├── fontawesome-webfont.ttf
│   ├── fontawesome-webfont.woff
│   └── fontawesome-webfont.woff2
├── ico
│   ├── 2017-08-10_214727.png
│   ├── apdownload-bg.jpg
│   ├── apdownload-phone-code.png
│   ├── banner.jpg
│   ├── favicon.ico
│   ├── getCode
│   ├── ghs.png
│   ├── slogan2016.png
│   ├── truste.png
│   ├── v-logo-1.png
│   ├── v-logo-2.png
│   ├── v-logo-3.png
│   └── xiaomi_lg.jpg
├── img
│   ├── bag
│   │   ├── bag_1.jpg
│   │   ├── bag_2.jpg
│   │   ├── bag_3.jpg
│   │   ├── bag_4.jpg
│   │   └── bag_5.jpg
│   ├── box
│   │   ├── 01140140.png
│   │   ├── 140-140.jpg
│   │   ├── 140.jpg
│   │   ├── 140x140.jpg
│   │   ├── 553s140.png
│   │   ├── 65140list.jpg
│   │   ├── 653s140.png
│   │   ├── dianshipeijian.jpg
│   │   ├── ertong1.png
│   │   ├── hezizengqiang140list.jpg
│   │   ├── huiyuan.png
│   │   ├── icon.png
│   │   ├── mitv3s48.jpg
│   │   ├── tv701.png
│   │   ├── xmds4_49_140.jpg
│   │   ├── xmds4_55_140.jpg
│   │   ├── xmds4_65_140.jpg
│   │   ├── xp140_49.jpg
│   │   ├── xp140_55.jpg
│   │   ├── xp140_65.jpg
│   │   └── zuodaohang.jpg
│   ├── box_av
│   │   ├── box_1.png
│   │   ├── box_2.png
│   │   ├── box_3.jpg
│   │   └── box_4.png
│   ├── computer
│   │   ├── computer_1.png
│   │   ├── computer_2.jpg
│   │   └── computer_3.jpg
│   ├── content_1.gif
│   ├── favicon.ico
│   ├── focus
│   │   ├── focu.jpg
│   │   ├── focus_1.jpg
│   │   ├── focus_2.jpg
│   │   └── focus_3.jpg
│   ├── gif
│   │   ├── gif_0.jpg
│   │   ├── gif_1.jpg
│   │   ├── gif_2.jpg
│   │   ├── gif_3.jpg
│   │   ├── gif_4.jpg
│   │   └── gif_5.jpg
│   ├── hardware
│   │   ├── hardware_1.jpg
│   │   ├── hardware_2.png
│   │   ├── hardware_3.png
│   │   ├── hardware_4.jpg
│   │   ├── hardware_5.jpg
│   │   └── hardware_6.jpg
│   ├── hm_1.jpg
│   ├── hm_2.jpg
│   ├── hm_3.jpg
│   ├── home
│   │   ├── home_1.jpg
│   │   ├── home_2.jpg
│   │   ├── home_3.png
│   │   ├── home_4.jpg
│   │   ├── home_5.jpg
│   │   ├── home_6.jpg
│   │   ├── home_7.jpg
│   │   ├── home_8.jpg
│   │   ├── home_9.jpg
│   │   └── home_left.jpg
│   ├── img_buzz
│   │   ├── buzz_1.jpg
│   │   ├── buzz_2.jpg
│   │   ├── buzz_3.jpg
│   │   └── buzz_4.jpg
│   ├── img_circum
│   │   ├── circum_0.jpg
│   │   ├── circum_1.jpg
│   │   ├── circum_2.jpg
│   │   ├── circum_3.jpg
│   │   ├── circum_4.jpg
│   │   ├── circum_5.jpg
│   │   ├── circum_6.jpg
│   │   ├── circum_7.jpg
│   │   ├── circum_8.jpg
│   │   └── xmad_.jpg
│   ├── img_fittings
│   │   ├── fittings_0.jpg
│   │   ├── fittings_1.jpg
│   │   ├── fittings_2.jpg
│   │   ├── fittings_3.jpg
│   │   ├── fittings_4.jpg
│   │   ├── fittings_5.jpg
│   │   ├── fittings_6.jpg
│   │   ├── fittings_7.jpg
│   │   └── fittings_8.jpg
│   ├── img_match
│   │   ├── match_1.jpg
│   │   ├── match_2.jpg
│   │   ├── match_3.jpg
│   │   ├── match_4.jpg
│   │   ├── match_5.jpg
│   │   ├── match_6.jpg
│   │   ├── match_7.jpg
│   │   ├── match_8.jpg
│   │   └── match_9.jpg
│   ├── img_recommend
│   │   ├── recommend_1.jpg
│   │   ├── recommend_2.jpg
│   │   ├── recommend_3.jpg
│   │   ├── recommend_4.jpg
│   │   └── recommend_5.jpg
│   ├── img_smart
│   │   ├── pms_1.jpg
│   │   ├── pms_2.jpg
│   │   ├── pms_3.jpg
│   │   ├── pms_4.jpg
│   │   ├── pms_5.jpg
│   │   ├── pms_6.jpg
│   │   ├── pms_7.jpg
│   │   ├── pms_8.jpg
│   │   └── xmad_15021010132973_BOkcp.jpg
│   ├── item
│   │   ├── item_1.png
│   │   ├── item_2.png
│   │   ├── item_3.png
│   │   ├── item_4.png
│   │   └── item_5.png
│   ├── mi-logo.png
│   ├── notebook
│   │   ├── bijiben140.jpg
│   │   ├── bijiben_1.jpg
│   │   ├── bjbcdq140.jpg
│   │   ├── meidanbao140.jpg
│   │   ├── mipad3.jpg
│   │   ├── shubiao140.jpg
│   │   ├── USBC140.jpg
│   │   ├── usbzjqggg140.jpg
│   │   ├── wxsb140.png
│   │   ├── xmsbd140.jpg
│   │   └── ymjp140.jpg
│   ├── phone
│   │   ├── 140pc-5x.png
│   │   ├── 4G140.jpg
│   │   ├── 5c_140.png
│   │   ├── compare.jpg
│   │   ├── hm4-140.jpg
│   │   ├── hm4x_140.png
│   │   ├── hmn4x140.png
│   │   ├── max2_140.jpg
│   │   ├── mifenka-1.jpg
│   │   ├── mimobile.jpg
│   │   ├── MIX-140.jpg
│   │   ├── xm5S-140.jpg
│   │   ├── xm5S-plus-140.jpg
│   │   ├── xm6_140.png
│   │   └── xmNOTE2-140.jpg
│   ├── protect
│   │   ├── baohu.jpg
│   │   └── tiemo.jpg
│   ├── rabbit
│   │   ├── rabbit_1.jpg
│   │   ├── rabbit_2.jpg
│   │   ├── rabbit_3.jpg
│   │   ├── rabbit_4.jpg
│   │   └── rabbit_5.jpg
│   ├── rolling
│   │   ├── rolling_1.jpg
│   │   ├── rolling_2.jpg
│   │   ├── rolling_3.jpg
│   │   ├── rolling_4.jpg
│   │   ├── rolling_5.jpg
│   │   └── rolling_6.jpg
│   ├── router
│   │   ├── router_1.png
│   │   ├── router_2.png
│   │   ├── router_3.png
│   │   ├── router_4.png
│   │   ├── router_5.png
│   │   └── router_6.jpg
│   ├── sj_1.png
│   ├── sj_2.png
│   ├── sj_3.jpg
│   ├── sj_4.jpg
│   ├── sj_5.jpg
│   ├── sj_6.jpg
│   ├── smart
│   │   ├── czjhq80.jpg
│   │   ├── dianfanbao-80.jpg
│   │   ├── dianhuashoubiao80.jpg
│   │   ├── djj80.jpg
│   │   ├── gushiji80.jpg
│   │   ├── huabanche80.jpg
│   │   ├── jinghuaqilvxin80.jpg
│   │   ├── jingshuiqiandlvxin-80.jpg
│   │   ├── jiqiren80.jpg
│   │   ├── jiqiren.jpg
│   │   ├── jly80.jpg
│   │   ├── luyouqi-80.jpg
│   │   ├── phcplus80.jpg
│   │   ├── scale.jpg
│   │   ├── shouhuan280.jpg
│   │   ├── shuihu80.jpg
│   │   ├── VRPLAY2.png
│   │   ├── wurenji80.jpg
│   │   ├── xiaobai80.jpg
│   │   ├── xueyaji-80.jpg
│   │   ├── zhinengdeng-80.jpg
│   │   ├── zhinengjiatingtaozhuang-80.jpg
│   │   ├── znyjdaohang.jpg
│   │   └── zxc80-80.jpg
│   ├── smart_tow
│   │   ├── smart_10.jpg
│   │   ├── smart_1.jpg
│   │   ├── smart_2.jpg
│   │   ├── smart_3.jpg
│   │   ├── smart_4.jpg
│   │   ├── smart_5.jpg
│   │   ├── smart_6.jpg
│   │   ├── smart_7.jpg
│   │   ├── smart_8.jpg
│   │   └── smart_9.jpg
│   ├── socket
│   │   ├── 5Battery1.jpg
│   │   ├── 7Battery1.jpg
│   │   ├── c1xb343.jpg
│   │   ├── chongdianqi-80.jpg
│   │   ├── dianyuan280.jpg
│   │   ├── dianyuanfujian.jpg
│   │   └── yidongdianyuan.jpg
│   ├── stereo
│   │   ├── 20170707135935.jpg
│   │   ├── 80x80.jpg
│   │   ├── bluetoothheadset.jpg
│   │   ├── chechong1.jpg
│   │   ├── fhz80.jpg
│   │   ├── fhzlyyx80.jpg
│   │   ├── huosai1.jpg
│   │   ├── jiaonang80.jpg
│   │   ├── mituyinx80.jpg
│   │   ├── naozhong80.jpg
│   │   ├── pinpai80.jpg
│   │   ├── pocketaudio.png
│   │   ├── qtpro80.jpg
│   │   ├── quantie.jpg
│   │   ├── suishen-80.jpg
│   │   ├── tdsqs80.jpg
│   │   ├── toudai80.jpg
│   │   ├── wlyx80.jpg
│   │   ├── xiaogangpao2-hei-80.jpg
│   │   ├── xmjzej80.jpg
│   │   └── yundong80.jpg
│   ├── tv
│   │   ├── TV_1.png
│   │   ├── TV_2.png
│   │   ├── TV_3.png
│   │   ├── TV_4.png
│   │   ├── TV_5.png
│   │   └── TV_6.png
│   ├── wire
│   │   ├── wire_1.jpg
│   │   ├── wire_2.jpg
│   │   ├── wire_3.jpg
│   │   └── wire_4.jpg
│   └── xiaomi_lg.ico
├── img_finance
│   ├── a.png
│   ├── finance_1.png
│   ├── finance_2.jpg
│   ├── finance_3.png
│   ├── finance_4.jpg
│   ├── finance_4.png
│   ├── finance_5.png
│   ├── index_1.png
│   ├── index_2.png
│   ├── index_3.png
│   ├── logo_pc.png
│   ├── qw_1.png
│   ├── qw_2.png
│   ├── qw_3.png
│   └── qw_4.png
├── img_game
│   ├── 2048.jpg
│   ├── buttom.jpg
│   ├── cat.jpg
│   ├── cok.jpg
│   ├── ddz.jpg
│   ├── dz.jpg
│   ├── jxsj.jpg
│   ├── kd.jpg
│   ├── ljm.jpg
│   ├── logo.png
│   ├── majiang.jpg
│   ├── mr.jpg
│   ├── pop.jpg
│   ├── sok.jpg
│   ├── soso.png
│   ├── wyft.jpg
│   ├── xy.jpg
│   └── zuma.jpg
├── img_michat
│   ├── banner
│   │   ├── banner_0.png
│   │   ├── banner_1.png
│   │   └── banner_2.jpg
│   ├── index_0.png
│   └── miui9
│   ├── miuii_1.jpg
│   ├── miuii_2.png
│   └── miuii_3.png
├── img_mitalk
│   ├── 11f160ed.inter_center.jpg
│   ├── 2fbdbdff.ios_img.png
│   ├── 7f89950c.andriod_img.png
│   ├── e3759e7a.logo.png
│   ├── f08ea210.pc_img.png
│   ├── f229b75e.mi-report-icon.jpg
│   ├── mitalkr_1.png
│   ├── mitalkr_2.png
│   └── mitalkr_3.png
├── img_register
│   ├── qq.png
│   ├── wb.png
│   ├── wx.png
│   ├── xiao_dingbu.jpg
│   ├── xiaomi.jpg
│   ├── xm.jpg
│   └── zfb.png
├── js
│   └── miui.js
├── xiaomi_1.html
├── xiaomi_finance.html
├── xiaomi_game.html
├── xiaomi_login.html
├── xiaomi_michat.html
├── xiaomi_mitalkr.html
├── xiaomi_mobile.html
└── xiaomi_register.html

41 directories, 335 files