话不多说，我用的软件是HBuilder制作的网页。样式是这样的
这是一个简单方便老师检查的页面。
根据页面提示第一个是我学的电商网页。直接上代码；
html> head> meta charset="utf-8" /> title>电商网title> link rel="stylesheet" type="text/css" href="css/ux_1446629159_9522004/demo.css"/> link rel="stylesheet" type="text/css" href="css/ux_1446629159_9522004/iconfont.css"/> style type="text/css"> *{ padding: 0px; margin: 0px; list-style: none; } .bigtop{ width: 100%; height: 30px; background-color: #333333; position: absolute; z-index: 2; } .bigtop .top{ width: 1000px; margin: auto; } .fl{ float: left; } .fr{ float: right; } .bigtop .top .right a{ text-decoration: none; color: #ccc; display: inline-block; height: 30px; line-height: 30px; margin-left: 10px; } .bigtop .top .right a:hover{ color: white; } .bigbox{ width: 100%; height: 680px; border: 1px solid black; overflow: hidden; position: relative; } .bigbox video{ width: 100%; min-width: 1280px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); z-index: 1; } .bignav{ width: 100%; height:70px; background-color: rgba(0,0,0,0.2); position: absolute; left: 0px; top: 30px; z-index: 3; line-height: 70px; } .bignav .nav{ width: 1000px; margin: auto; } .bignav .nav .right a{ width: 32px; height: 32px; display: inline-block; /*background-color: red;*/ line-height: 32px; text-align: center; border-radius: 50%; box-shadow: 0 0 0 1px #fff inset; -webkit-transition: all 1s ease; color: white; } .bignav .nav .right a:hover{