|
|
@@ -0,0 +1,128 @@
|
|
|
+* {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ list-style: none;
|
|
|
+ text-decoration: none;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+/* 页眉 */
|
|
|
+#header {
|
|
|
+ width: 100%;
|
|
|
+ height: 75px;
|
|
|
+}
|
|
|
+#header .nav {
|
|
|
+ width: 1250px;
|
|
|
+ height: 100%;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+#header .nav .partOne {
|
|
|
+ width: 151px;
|
|
|
+ height: 50px;
|
|
|
+ float: left;
|
|
|
+ padding-top: 10px;
|
|
|
+}
|
|
|
+#header .nav .logo {
|
|
|
+ width: 151px;
|
|
|
+ height: 50px;
|
|
|
+ background: url("./images/soso.png");
|
|
|
+ background-position-x: -206px;
|
|
|
+ background-position-y: 3px;
|
|
|
+}
|
|
|
+#header .nav .partTwo {
|
|
|
+ float: left;
|
|
|
+ height: 100%;
|
|
|
+ line-height: 75px;
|
|
|
+ margin-left: 65px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+#header .nav .partTwo ul {
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+#header .nav .partTwo ul li {
|
|
|
+ float: left;
|
|
|
+ margin-left: 35px;
|
|
|
+}
|
|
|
+#header .nav .partTwo ul li:first-child a {
|
|
|
+ color: #31CCFF;
|
|
|
+}
|
|
|
+#header .nav .partTwo ul li:first-child {
|
|
|
+ margin-left: 0;
|
|
|
+}
|
|
|
+#header .nav .partTwo ul li a:hover {
|
|
|
+ color: #31CCFF;
|
|
|
+}
|
|
|
+#header .nav .partTwo .beta {
|
|
|
+ width: 39px;
|
|
|
+ height: 16px;
|
|
|
+ background: #F5F7F9;
|
|
|
+ position: absolute;
|
|
|
+ left: 384px;
|
|
|
+ top: 10px;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 16px;
|
|
|
+ color: #999999;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 30px;
|
|
|
+ border:1px solid #dddddd;
|
|
|
+}
|
|
|
+#header .nav .partThree {
|
|
|
+ width: 102px;
|
|
|
+ height: 38px;
|
|
|
+ float: right;
|
|
|
+ margin-top: 18px;
|
|
|
+}
|
|
|
+#header .nav .partThree .btn {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #1ebcf0;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 16px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 38px;
|
|
|
+ border-radius: 4px;
|
|
|
+}
|
|
|
+#header .nav .partThree .btn:hover {
|
|
|
+ background: #31ccff;
|
|
|
+}
|
|
|
+/* 主体 */
|
|
|
+#main .banner {
|
|
|
+ width: 100%;
|
|
|
+ height: 480px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+#main .banner img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+#main .banner .search {
|
|
|
+ width: 692px;
|
|
|
+ height: 58px;
|
|
|
+ background: rgba(0,0,0,.15);
|
|
|
+ overflow: hidden;
|
|
|
+ position: absolute;
|
|
|
+ top: 214px;
|
|
|
+ left: 606px;
|
|
|
+
|
|
|
+}
|
|
|
+#main .banner .search input {
|
|
|
+ width: 588px;
|
|
|
+ height: 50px;
|
|
|
+ float: left;
|
|
|
+ padding: 15px;
|
|
|
+ color: #999999;
|
|
|
+ outline: none;
|
|
|
+ margin-top: 4px;
|
|
|
+ margin-left: 3px;
|
|
|
+ border: 1px solid #adadad;
|
|
|
+ border-top-left-radius: 4px;
|
|
|
+ border-bottom-left-radius: 4px;
|
|
|
+ background: rgba(255,255,255,.88);;
|
|
|
+}
|
|
|
+#main .banner .search img {
|
|
|
+ width: 97px;
|
|
|
+ height: 50px;
|
|
|
+ float: left;
|
|
|
+ margin-top: 4px;
|
|
|
+}
|
e
