push all files
This commit is contained in:
75
css/base.css
Normal file
75
css/base.css
Normal file
@@ -0,0 +1,75 @@
|
||||
/* 基本样式 */
|
||||
|
||||
/* 把我们所有标签的内外边距清零 */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
/* css3盒子模型 */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* em 和 i 斜体的文字不倾斜 */
|
||||
em,
|
||||
i {
|
||||
font-style: normal
|
||||
}
|
||||
|
||||
/* 去掉li 的小圆点 */
|
||||
li {
|
||||
list-style: none
|
||||
}
|
||||
|
||||
img {
|
||||
/* border 0 照顾低版本浏览器 如果 图片外面包含了链接会有边框的问题 */
|
||||
border: 0;
|
||||
/* 取消图片底侧有空白缝隙的问题 */
|
||||
vertical-align: middle
|
||||
}
|
||||
|
||||
button {
|
||||
/* 当我们鼠标经过button 按钮的时候，鼠标变成小手 */
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
a {
|
||||
color: #666;
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: red
|
||||
}
|
||||
|
||||
button,
|
||||
input {
|
||||
/* "\5B8B\4F53" 就是宋体的意思 这样浏览器兼容性比较好 */
|
||||
font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
|
||||
/* 默认有灰色边框我们需要手动去掉 */
|
||||
border: 0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
body {
|
||||
/* CSS3 抗锯齿形 让文字显示的更加清晰 */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
|
||||
color: #666
|
||||
}
|
||||
|
||||
.hide,
|
||||
.none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 清除浮动 */
|
||||
.clearfix:after {
|
||||
visibility: hidden;
|
||||
clear: both;
|
||||
display: block;
|
||||
content: ".";
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/* .clearfix {
|
||||
*zoom: 1;
|
||||
} */
|
||||
340
css/common.css
Normal file
340
css/common.css
Normal file
@@ -0,0 +1,340 @@
|
||||
/* 注意路径 */
|
||||
@font-face {
|
||||
font-family: 'iconfont';
|
||||
src: url('../fonts/iconfont.ttf?t=1665284552908') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 10px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
|
||||
/* 版心 */
|
||||
.w {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.shortcut {
|
||||
height: 31px;
|
||||
line-height: 31px;
|
||||
background-color: #e3e4e5;
|
||||
}
|
||||
|
||||
.style_red {
|
||||
color: #c81623 !important;
|
||||
}
|
||||
|
||||
.style_blac {
|
||||
color: #333333 !important;
|
||||
}
|
||||
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.shortcut ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.shortcut .fr ul li:nth-child(even) {
|
||||
width: 1px;
|
||||
height: 12px;
|
||||
background-color: #666;
|
||||
margin: 9px 16px 0;
|
||||
}
|
||||
|
||||
/* <!-- 头部制作 start --> */
|
||||
.header {
|
||||
position: relative;
|
||||
height: 106px;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
width: 171px;
|
||||
height: 61px;
|
||||
/* background-color: pink; */
|
||||
}
|
||||
|
||||
.logo a {
|
||||
font-size: 0;
|
||||
display: block;
|
||||
width: 171px;
|
||||
height: 61px;
|
||||
background: url(../images/logo2.png) no-repeat;
|
||||
}
|
||||
|
||||
.search {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
left: 348px;
|
||||
width: 538px;
|
||||
height: 36px;
|
||||
border: 2px solid #ff7000;
|
||||
border-radius: 15px;
|
||||
|
||||
}
|
||||
|
||||
.search input {
|
||||
width: 454px;
|
||||
height: 32px;
|
||||
padding: 10px 0 10px 20px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.search button {
|
||||
position: absolute;
|
||||
font-size: 24px;
|
||||
color: #ff9000;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 80px;
|
||||
height: 32px;
|
||||
border-left: 2px solid #ff7000;
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
.search button:hover {
|
||||
color: #ff2a00;
|
||||
}
|
||||
|
||||
|
||||
.hotwords {
|
||||
position: absolute;
|
||||
top: 69px;
|
||||
left: 348px;
|
||||
}
|
||||
|
||||
.hotwords a {
|
||||
margin: 0 12px;
|
||||
}
|
||||
|
||||
.shopcar {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
right: 64px;
|
||||
width: 140px;
|
||||
height: 35px;
|
||||
padding: 0 14px 0 18px;
|
||||
text-align: center;
|
||||
border: 1px solid #dfdfdf;
|
||||
background-color: #f7f7f7;
|
||||
border-radius: 17px;
|
||||
}
|
||||
|
||||
.shopcar i {
|
||||
float: left;
|
||||
line-height: 35px;
|
||||
font-size: 25px;
|
||||
color: #ff7000;
|
||||
}
|
||||
|
||||
.shopcar em {
|
||||
float: right;
|
||||
font-size: 12px;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.shopcar_icon {
|
||||
position: absolute;
|
||||
padding: 0 3px;
|
||||
left: 100px;
|
||||
top: -10px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
background-color: #ff7000;
|
||||
border-radius: 8px 8px 8px 0;
|
||||
}
|
||||
|
||||
.shopcar_icon a {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.shopcar_icon a:hover {
|
||||
color: black;
|
||||
}
|
||||
|
||||
/* nav start */
|
||||
.nav {
|
||||
position: relative;
|
||||
height: 46px;
|
||||
border-bottom: 2px solid #b1191a;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.dropdown .dt {
|
||||
|
||||
width: 208px;
|
||||
height: 46px;
|
||||
font-size: 16px;
|
||||
color: #fff;
|
||||
line-height: 45px;
|
||||
text-align: center;
|
||||
border-radius: 23px 23px 0 0;
|
||||
background-color: #ff7000;
|
||||
}
|
||||
|
||||
.dropdown .dd ul li a {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
height: 31px;
|
||||
line-height: 30px;
|
||||
padding-left: 10px;
|
||||
background-color: #ff9000;
|
||||
}
|
||||
|
||||
/* .dropdown .dd {
|
||||
display: none;
|
||||
} */
|
||||
|
||||
/* 测试, 以后放到其他页面样式里 */
|
||||
|
||||
.dropdown .dd ul li a em {
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.dropdown .dd ul li a:hover {
|
||||
color: #c81623;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.dropdown .dd ul li .last {
|
||||
line-height: 34px;
|
||||
border-radius: 0 0 23px 23px;
|
||||
}
|
||||
|
||||
.navitems {
|
||||
float: left;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
left: 210px;
|
||||
}
|
||||
|
||||
|
||||
.navitems ul li {
|
||||
float: left;
|
||||
margin-left: 52px;
|
||||
font-size: 16px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.footer {
|
||||
height: 415px;
|
||||
padding-top: 30px;
|
||||
background-color: #e3e4e5;
|
||||
}
|
||||
|
||||
.mod_service {
|
||||
height: 80px;
|
||||
border-bottom: 2px solid #ededed;
|
||||
}
|
||||
|
||||
.mod_service ul li {
|
||||
float: left;
|
||||
width: 20%;
|
||||
height: 50px;
|
||||
padding-left: 35px;
|
||||
|
||||
}
|
||||
|
||||
.mod_service ul li h5 {
|
||||
float: left;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
color: #fff;
|
||||
font-size: 28px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
background-color: #ff7000;
|
||||
border-radius: 25px;
|
||||
/* background: url(../images/zheng.png) no-repeat; */
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.mod_service ul li div {
|
||||
float: left;
|
||||
padding: 6px 0 0 6px;
|
||||
}
|
||||
|
||||
.mod_service ul li h2 {
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.mod_service ul li h2:hover {
|
||||
color: #c81623;
|
||||
}
|
||||
|
||||
.mod_service ul li p {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
.mod_help {
|
||||
height: 188px;
|
||||
border-bottom: 2px solid #ededed;
|
||||
}
|
||||
|
||||
.mod_help dl {
|
||||
float: left;
|
||||
width: 200px;
|
||||
padding: 20px 0 0 52px;
|
||||
}
|
||||
|
||||
.mod_help dl dt {
|
||||
font-size: 16px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.mod_help dl dd {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.mod_help dl:last-child {
|
||||
padding-left: 5px;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mod_help .erweima {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
|
||||
.footer_bottom {
|
||||
text-align: center;
|
||||
padding: 20px 100px 0;
|
||||
}
|
||||
|
||||
.footer_bottom p a {
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.footer_bottom p a:hover {
|
||||
color: #b1191a;
|
||||
}
|
||||
|
||||
.footer_bottom p:nth-child(2) {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
442
css/index.css
Normal file
442
css/index.css
Normal file
@@ -0,0 +1,442 @@
|
||||
.toolkit {
|
||||
position: fixed;
|
||||
color: #fff;
|
||||
/* left: 50%;
|
||||
margin-left: 610px; */
|
||||
right: 0;
|
||||
top: 35%;
|
||||
background-color: rgba(255, 123, 0, .8);
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
z-index: 999;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
.toolkit li a {
|
||||
display: block;
|
||||
color: #fff;
|
||||
height: 30px;
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
.toolkit .returntop {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
display: none;
|
||||
background-color: orangered;
|
||||
}
|
||||
|
||||
.toolkit li:hover {
|
||||
background-color: rgba(255, 123, 0, 1);
|
||||
}
|
||||
|
||||
.main {
|
||||
width: 990px;
|
||||
height: 480px;
|
||||
/* background-color: skyblue; */
|
||||
margin-left: 220px;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.main .focus {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 721px;
|
||||
height: 455px;
|
||||
overflow: hidden;
|
||||
/* background-color: purple; */
|
||||
/* background: url(../images/banner.jpg); */
|
||||
}
|
||||
|
||||
.main .focus .arrow {
|
||||
position: absolute;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
top: 220px;
|
||||
cursor: pointer;
|
||||
z-index: 999;
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
}
|
||||
|
||||
.main .focus .arrow:hover {
|
||||
background-color: rgba(0, 0, 0, .6);
|
||||
}
|
||||
|
||||
.main .focus .arrow img {
|
||||
margin-top: 5px;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.main .focus .arrow_left {
|
||||
display: none;
|
||||
left: 0;
|
||||
border-radius: 0 15px 15px 0;
|
||||
}
|
||||
|
||||
.main .focus .arrow_right {
|
||||
display: none;
|
||||
right: 0;
|
||||
border-radius: 15px 0 0 15px;
|
||||
}
|
||||
|
||||
.main .focus .arrow_right img {
|
||||
float: right;
|
||||
/*保持左右对齐*/
|
||||
}
|
||||
|
||||
.main .focus .spot {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
left: 50%;
|
||||
/*右移整个盒子的50%*/
|
||||
transform: translateX(-50%);
|
||||
/*再左移整个盒子的50%的距离，让该盒子的中心，正好位于父盒子的中心*/
|
||||
z-index: 999;
|
||||
padding: 6px;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
border-radius: 11px;
|
||||
}
|
||||
|
||||
.main .focus .spot li {
|
||||
float: left;
|
||||
width: 15px;
|
||||
height: 10px;
|
||||
border-radius: 5px;
|
||||
margin-left: 6px;
|
||||
background-color: #fff;
|
||||
cursor: pointer;
|
||||
border: 1px solid orangered;
|
||||
}
|
||||
|
||||
.main .focus .spot li:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.main .focus .spot .current {
|
||||
background-color: orangered;
|
||||
}
|
||||
|
||||
|
||||
.main .focus ul {
|
||||
position: absolute;
|
||||
width: 900%;
|
||||
/*子盒子可以比父盒子宽，500% 为 父盒子的5倍*/
|
||||
}
|
||||
|
||||
.main .focus ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.main .focus img {
|
||||
float: left;
|
||||
width: 721px;
|
||||
height: 455px;
|
||||
}
|
||||
|
||||
.main .newsflash {
|
||||
float: right;
|
||||
width: 250px;
|
||||
height: 455px;
|
||||
/* background-color: aqua; */
|
||||
}
|
||||
|
||||
.news {
|
||||
height: 165px;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.news_hd {
|
||||
height: 33px;
|
||||
line-height: 33px;
|
||||
padding: 0 15px;
|
||||
border-bottom: 1px dotted #e4e4e4;
|
||||
}
|
||||
|
||||
.news_hd h5 {
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.news_hd a {
|
||||
float: right;
|
||||
}
|
||||
|
||||
|
||||
.lifeservice {
|
||||
height: 210px;
|
||||
/* background-color: purple; */
|
||||
}
|
||||
|
||||
.bargin {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.news li {
|
||||
padding: 6px 10px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.news_bd a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.news_bd a:hover {
|
||||
color: #b1191a;
|
||||
}
|
||||
|
||||
.lifeservice {
|
||||
border: 1px solid #e4e4e4;
|
||||
border-radius: 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.lifeservice ul li {
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 62px;
|
||||
height: 70px;
|
||||
padding-top: 6px;
|
||||
border-right: 1px solid #e4e4e4;
|
||||
border-bottom: 1px solid #e4e4e4;
|
||||
|
||||
}
|
||||
|
||||
.lifeservice i {
|
||||
color: blueviolet;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.lifeservice ul li a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.lifeservice ul li p {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.lifeservice ul li:nth-child(even) i {
|
||||
color: orangered;
|
||||
}
|
||||
|
||||
|
||||
.lifeservice ul li a:hover {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.recommend {
|
||||
height: 163px;
|
||||
/* background-color: skyblue; */
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.recom_hd {
|
||||
float: left;
|
||||
width: 205px;
|
||||
height: 163px;
|
||||
padding-top: 30px;
|
||||
text-align: center;
|
||||
background-color: #5c5251;
|
||||
}
|
||||
|
||||
|
||||
.recom_bd ul li {
|
||||
position: relative;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.recom_bd ul li img {
|
||||
width: 248px;
|
||||
height: 163px;
|
||||
}
|
||||
|
||||
.recom_bd ul li:nth-child(-n+3):after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 10px;
|
||||
width: 2px;
|
||||
height: 145px;
|
||||
background-color: #ddd;
|
||||
|
||||
}
|
||||
|
||||
.box_hd {
|
||||
height: 30px;
|
||||
/* margin-top: 30px; */
|
||||
line-height: 30px;
|
||||
border-bottom: 3px solid #c81623;
|
||||
}
|
||||
|
||||
.box_hd h3 {
|
||||
float: left;
|
||||
color: #c81623;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.box_hd .tab_list {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.box_hd .tab_list ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.box_hd .tab_list ul li a {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.box_bd {
|
||||
height: 358px;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.box_bd .bd_1 {
|
||||
float: left;
|
||||
height: 100%;
|
||||
width: 210px;
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.box_bd .bd_2 {
|
||||
float: left;
|
||||
height: 100%;
|
||||
width: 329px;
|
||||
/* background-color: yellow; */
|
||||
}
|
||||
|
||||
.box_bd .bd_3 {
|
||||
float: left;
|
||||
height: 100%;
|
||||
width: 220px;
|
||||
/* background-color: green; */
|
||||
}
|
||||
|
||||
.box_bd .bd_3 .bd_3_top {
|
||||
border-bottom: 2px solid #ededed;
|
||||
}
|
||||
|
||||
.box_bd .bd_3 .bd_3_top img {
|
||||
width: 220px;
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.box_bd .bd_3 .bd_3_bottom img {
|
||||
width: 220px;
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
/* 额，还是尽量给所有img定义统一宽高，如果切图不那么准的话 -- 2022-10-16 --wxy */
|
||||
|
||||
.box_bd .bd_4 {
|
||||
float: left;
|
||||
height: 100%;
|
||||
width: 220px;
|
||||
/* background-color: blue; */
|
||||
}
|
||||
|
||||
.box_bd .bd_5 {
|
||||
float: left;
|
||||
height: 100%;
|
||||
width: 220px;
|
||||
/* background-color: red; */
|
||||
}
|
||||
|
||||
.bd1_hd ul li a {
|
||||
float: left;
|
||||
margin-left: 12px;
|
||||
text-align: center;
|
||||
line-height: 32px;
|
||||
width: 80px;
|
||||
height: 32px;
|
||||
border-bottom: 1px solid #ededed;
|
||||
}
|
||||
|
||||
.ad {
|
||||
margin: 15px 0 20px;
|
||||
}
|
||||
|
||||
.guesslike .box_hd {
|
||||
/* height: 30px;
|
||||
line-height: 30px; */
|
||||
border: none;
|
||||
margin-bottom: 5px;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.guesslike .box_bd {
|
||||
height: 231px;
|
||||
/* background-color: purple; */
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.guesslike .box_bd ul li {
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 16.6%;
|
||||
}
|
||||
|
||||
/* .guesslike .box_bd ul li:hover {
|
||||
background-color: rgb(213, 243, 249);
|
||||
} */
|
||||
|
||||
.guesslike .box_bd .bd_bottom {
|
||||
height: 62px;
|
||||
border-left: 2px solid #ededed;
|
||||
|
||||
}
|
||||
|
||||
.guesslike .box_bd .bd_bottom i {
|
||||
font-size: 18px;
|
||||
color: #df3033;
|
||||
}
|
||||
|
||||
|
||||
.guesslike .box_bd .bd_top {
|
||||
height: 161px;
|
||||
border-top: 2px solid rgb(228, 227, 227);
|
||||
}
|
||||
|
||||
.guesslike .box_bd .bd_top img {
|
||||
width: 201px;
|
||||
height: 161px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.chuanzhi .box_hd {
|
||||
/* height: 30px;
|
||||
line-height: 30px; */
|
||||
border: none;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.chuanzhi .box_bd {
|
||||
height: 406px;
|
||||
/* background-color: skyblue; */
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.chuanzhi .box_bd ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fengqiang .box_hd {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.fengqiang .box_bd {
|
||||
height: 282px;
|
||||
/* background-color: skyblue; */
|
||||
margin-bottom: 37px;
|
||||
border: 2px solid #ededed;
|
||||
}
|
||||
112
css/list.css
Normal file
112
css/list.css
Normal file
@@ -0,0 +1,112 @@
|
||||
.sc {
|
||||
position: absolute;
|
||||
float: left;
|
||||
left: 190px;
|
||||
top: 30px;
|
||||
width: 84px;
|
||||
height: 33px;
|
||||
border-left: 1px solid #b1191a;
|
||||
/* background-color: skyblue; */
|
||||
padding: 3px 14px;
|
||||
}
|
||||
|
||||
.sk_list {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.sk_list ul li {
|
||||
float: left;
|
||||
margin: 0 30px;
|
||||
line-height: 46px;
|
||||
}
|
||||
|
||||
.sk_list ul li a {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.sk_con {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.sk_con ul li {
|
||||
float: left;
|
||||
line-height: 46px;
|
||||
margin-left: 44px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.sk_con ul li a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.rush_buy {
|
||||
height: 120px;
|
||||
/* background-color: skyblue; */
|
||||
margin-bottom: 26px;
|
||||
}
|
||||
|
||||
.sell {
|
||||
height: 1500px;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.goods {
|
||||
/* padding: 2px; */
|
||||
float: left;
|
||||
margin: 10px;
|
||||
height: 350px;
|
||||
width: 220px;
|
||||
/* background-color: pink; */
|
||||
}
|
||||
|
||||
.goods:hover {
|
||||
border: 2px solid rgb(155, 213, 236);
|
||||
box-shadow: 2px 2px 10px rgb(173, 212, 226);
|
||||
}
|
||||
|
||||
.goods img {
|
||||
width: 215px;
|
||||
height: 215px;
|
||||
}
|
||||
|
||||
|
||||
.goods .prize {
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
color: #e4393c;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.goods .recom {
|
||||
padding: 0 5px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
.purchase {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.purchase:hover {
|
||||
background-color: rgb(182, 223, 240);
|
||||
}
|
||||
|
||||
.goods .purchase a {
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
color: #e4393c;
|
||||
}
|
||||
|
||||
.goods .purchase i {
|
||||
text-align: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
163
css/login.css
Normal file
163
css/login.css
Normal file
@@ -0,0 +1,163 @@
|
||||
@font-face {
|
||||
font-family: 'iconfont';
|
||||
src: url('../fonts/iconfont.ttf?t=1665284552908') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
|
||||
.w {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.header {
|
||||
position: relative;
|
||||
height: 82px;
|
||||
/* background-color: skyblue; */
|
||||
/* border-bottom: 2px solid #ddd4d4;
|
||||
box-shadow: 0 3px 6px rgb(203, 199, 199); */
|
||||
}
|
||||
|
||||
.header h1 a {
|
||||
position: absolute;
|
||||
top: 24px;
|
||||
}
|
||||
|
||||
|
||||
.header h1 .logo_title {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 225px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
|
||||
.header_right {
|
||||
position: absolute;
|
||||
top: 45px;
|
||||
right: 85px;
|
||||
}
|
||||
|
||||
.header_right a {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.header_right i {
|
||||
font-size: 30px;
|
||||
color: skyblue;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
height: 600px;
|
||||
width: 100%;
|
||||
/* margin-top: 15px; */
|
||||
background: url(../images/loginbac2.jpg) no-repeat;
|
||||
}
|
||||
|
||||
.login_box {
|
||||
position: relative;
|
||||
height: 350px;
|
||||
width: 350px;
|
||||
top: 120px;
|
||||
left: -384px;
|
||||
padding: 25px 25px 23px;
|
||||
color: #6c6c6c;
|
||||
background: #fff;
|
||||
margin: 0 auto;
|
||||
background-color: hsla(0, 0%, 100%, .9);
|
||||
|
||||
}
|
||||
|
||||
.login_box .hd {
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
.login_box .hd h1 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.login_box .bd ul li {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
margin: 25px 0;
|
||||
/* background-color: pink; */
|
||||
}
|
||||
|
||||
.login_box .bd ul li label {
|
||||
color: #fff;
|
||||
font-size: 42px;
|
||||
line-height: 43px;
|
||||
background-color: #ccc;
|
||||
|
||||
}
|
||||
|
||||
.login_box .bd span {
|
||||
display: block;
|
||||
float: left;
|
||||
line-height: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.login_box .bd .ways a {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.login_box .bd .wx {
|
||||
display: block;
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
font-size: 20px;
|
||||
color: rgb(44, 173, 44);
|
||||
}
|
||||
|
||||
.login_box .bd .zfb {
|
||||
display: block;
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
font-size: 15px;
|
||||
|
||||
color: rgb(75, 75, 204);
|
||||
}
|
||||
|
||||
.login_box .bd .wb {
|
||||
display: block;
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
font-size: 15px;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.login_box .bd .txt {
|
||||
display: block;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.login_box .bd ul li input {
|
||||
height: 42px;
|
||||
width: 258px;
|
||||
padding-left: 12px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.login_box .bd ul li button {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
width: 300px;
|
||||
height: 42px;
|
||||
background-color: #f40;
|
||||
}
|
||||
|
||||
.login_box .bd .other {
|
||||
float: right;
|
||||
}
|
||||
124
css/login1.css
Normal file
124
css/login1.css
Normal file
@@ -0,0 +1,124 @@
|
||||
/* body {} */
|
||||
|
||||
/* background-color: rgba(0, 0, 0, 0.5); */
|
||||
/* 由css来控制 */
|
||||
|
||||
* {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.header {
|
||||
height: 50px;
|
||||
width: 200px;
|
||||
line-height: 50px;
|
||||
font-size: 25px;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.box {
|
||||
display: none;
|
||||
position: fixed;
|
||||
width: 440px;
|
||||
height: 480px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
/* margin: 100px auto; */
|
||||
background-color: #fff;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0px 0px 10px 1px #fff;
|
||||
}
|
||||
|
||||
.w {
|
||||
width: 380px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.close {
|
||||
height: 50px;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
cursor: move;
|
||||
/* background-color: orange; */
|
||||
}
|
||||
|
||||
.close span {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.lg-top {
|
||||
font-size: 25px;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.lg-main li {
|
||||
margin-top: 30px;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
background-color: rgb(220, 231, 250);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.lg-main li:nth-child(3) {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.lg-main li:nth-child(3) .left {
|
||||
color: rgb(105, 101, 101);
|
||||
width: 50%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.lg-main li:nth-child(3) a {
|
||||
display: block;
|
||||
width: 50%;
|
||||
float: right;
|
||||
text-align: right;
|
||||
color: rgb(105, 101, 101);
|
||||
}
|
||||
|
||||
.lg-main li:nth-child(4) {
|
||||
margin-top: -15px;
|
||||
}
|
||||
|
||||
.lg-main li:nth-child(4) .sub {
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
background-color: rgb(34, 168, 136);
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.acc-left {
|
||||
float: left;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
border-right: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.acc-right input {
|
||||
padding-left: 10px;
|
||||
display: block;
|
||||
float: right;
|
||||
width: 320px;
|
||||
height: 60px;
|
||||
font-size: 16px;
|
||||
border: 1px solid #ccc;
|
||||
border-left: none;
|
||||
outline: none;
|
||||
border-radius: 0 10px 10px 0;
|
||||
}
|
||||
213
css/register.css
Normal file
213
css/register.css
Normal file
@@ -0,0 +1,213 @@
|
||||
@font-face {
|
||||
font-family: 'iconfont';
|
||||
src: url('../fonts/iconfont.ttf?t=1665284552908') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.w {
|
||||
width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* 直接从common样式里复制 */
|
||||
|
||||
.footer_bottom {
|
||||
text-align: center;
|
||||
padding: 20px 100px 0;
|
||||
}
|
||||
|
||||
.footer_bottom p a {
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.footer_bottom p a:hover {
|
||||
color: #b1191a;
|
||||
}
|
||||
|
||||
.footer_bottom p:nth-child(2) {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
header {
|
||||
position: relative;
|
||||
height: 82px;
|
||||
/* background-color: skyblue; */
|
||||
border-bottom: 2px solid #ddd4d4;
|
||||
box-shadow: 0 3px 6px rgb(203, 199, 199);
|
||||
}
|
||||
|
||||
header .logo a {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
}
|
||||
|
||||
|
||||
header .logo_title {
|
||||
position: absolute;
|
||||
left: 200px;
|
||||
line-height: 82px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.register_area {
|
||||
height: 522px;
|
||||
margin: 25px 0;
|
||||
/* background-color: skyblue; */
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.reg_hd {
|
||||
position: relative;
|
||||
height: 43px;
|
||||
padding-left: 20px;
|
||||
background-color: #ececec;
|
||||
}
|
||||
|
||||
.reg_hd h3 {
|
||||
float: left;
|
||||
line-height: 43px;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.reg_hd .sb {
|
||||
font-size: 14px;
|
||||
line-height: 43px;
|
||||
right: 25px;
|
||||
position: absolute;
|
||||
|
||||
}
|
||||
|
||||
.reg_hd .sb a {
|
||||
color: rgb(223, 10, 10);
|
||||
}
|
||||
|
||||
.reg_hd .sb a:hover {
|
||||
color: #a6111b;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
||||
.reg_form {
|
||||
width: 600px;
|
||||
margin: 50px auto 0;
|
||||
padding-left: 50px;
|
||||
/* background-color: pink; */
|
||||
}
|
||||
|
||||
.reg_form ul li {
|
||||
position: relative;
|
||||
line-height: 37px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.reg_form ul li label {
|
||||
padding-right: 10px;
|
||||
display: inline-block;
|
||||
width: 88px;
|
||||
text-align: right;
|
||||
vertical-align: middle;
|
||||
|
||||
}
|
||||
|
||||
.reg_form ul li:nth-child(-n+5) input {
|
||||
padding-left: 10px;
|
||||
width: 242px;
|
||||
height: 37px;
|
||||
border: 1px solid #666;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.reg_form ul li span {
|
||||
height: 37px;
|
||||
font-size: 14px;
|
||||
padding-left: 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.reg_form ul li button {
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 60px;
|
||||
height: 37px;
|
||||
line-height: 100%;
|
||||
text-align: center;
|
||||
right: 150px;
|
||||
top: 2px;
|
||||
border: 1px solid #000;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.reg_form ul li span i {
|
||||
vertical-align: middle;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
|
||||
.reg_form ul .safe {
|
||||
padding-left: 115px;
|
||||
}
|
||||
|
||||
.safe em {
|
||||
color: #fff;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
.safe em:nth-child(1) {
|
||||
background-color: #de1111;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.safe em:nth-child(2) {
|
||||
background-color: #40b83f;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.safe em:nth-child(3) {
|
||||
background-color: #f0ac4d;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.safe em:nth-child(4) {
|
||||
background-color: #ff9600;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ifagree {
|
||||
padding-left: 127px;
|
||||
}
|
||||
|
||||
.ifagree input {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.ifagree a {
|
||||
color: #1ba1e6;
|
||||
}
|
||||
|
||||
.sub {
|
||||
margin-left: 110px;
|
||||
width: 200px;
|
||||
height: 35px;
|
||||
background-color: #c81623;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
221
css/shopcar.css
Normal file
221
css/shopcar.css
Normal file
@@ -0,0 +1,221 @@
|
||||
header {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.car_search {
|
||||
position: absolute;
|
||||
top: 25px;
|
||||
right: 0;
|
||||
width: 538px;
|
||||
height: 36px;
|
||||
border: 2px solid #b1191a;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
|
||||
.car_search input {
|
||||
width: 454px;
|
||||
height: 32px;
|
||||
padding: 10px 0 10px 20px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.car_search button {
|
||||
position: absolute;
|
||||
font-size: 24px;
|
||||
color: rgb(0, 183, 255);
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 80px;
|
||||
height: 32px;
|
||||
border-left: 2px solid #b1191a;
|
||||
border-radius: 14px;
|
||||
}
|
||||
|
||||
.car_search button:hover {
|
||||
color: rgb(0, 0, 190);
|
||||
}
|
||||
|
||||
.car_nav {
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
.car_nav h1 {
|
||||
float: left;
|
||||
font-size: 16px;
|
||||
padding-left: 10px;
|
||||
color: #c81623;
|
||||
}
|
||||
|
||||
.delivery_area {
|
||||
float: right;
|
||||
line-height: 32px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.shop_car_hd {
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
margin-top: 2px;
|
||||
color: #333;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.all_select {
|
||||
float: left;
|
||||
height: 100%;
|
||||
width: 225px;
|
||||
padding-left: 10px;
|
||||
/* background-color: skyblue; */
|
||||
}
|
||||
|
||||
.all_select input {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.all_select span {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.goods {
|
||||
float: left;
|
||||
width: 360px;
|
||||
height: 100%;
|
||||
/* background-color: purple; */
|
||||
}
|
||||
|
||||
.prize {
|
||||
float: left;
|
||||
width: 168px;
|
||||
height: 100%;
|
||||
/* background-color: orange; */
|
||||
}
|
||||
|
||||
.unmber {
|
||||
float: left;
|
||||
width: 140px;
|
||||
height: 100%;
|
||||
/* background-color: pink; */
|
||||
}
|
||||
|
||||
.subtotal {
|
||||
float: left;
|
||||
width: 170px;
|
||||
height: 100%;
|
||||
/* background-color: green; */
|
||||
}
|
||||
|
||||
.opearte {
|
||||
float: left;
|
||||
width: 137px;
|
||||
height: 100%;
|
||||
/* background-color: blue; */
|
||||
}
|
||||
|
||||
.shop_car_bd {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
border-bottom: 2px solid #dddddd;
|
||||
padding-left: 10px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.shop_car_bd input {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.shop_car_bd span {
|
||||
color: #fff;
|
||||
padding: 2px;
|
||||
background-color: #c81623;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.my_goods ul li {
|
||||
position: relative;
|
||||
height: 106px;
|
||||
margin: 20px 0;
|
||||
/* background-color: skyblue; */
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
|
||||
.my_goods ul li:nth-child(3) {
|
||||
background-color: #feedef;
|
||||
}
|
||||
|
||||
.my_goods ul li input {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 45px;
|
||||
}
|
||||
|
||||
.my_goods ul li img {
|
||||
position: absolute;
|
||||
left: 45px;
|
||||
top: 11px;
|
||||
}
|
||||
|
||||
.my_goods ul li .recommond {
|
||||
position: absolute;
|
||||
left: 142px;
|
||||
top: 22px;
|
||||
}
|
||||
|
||||
.my_goods ul li .uit_price {
|
||||
position: absolute;
|
||||
left: 600px;
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.my_goods ul li .num {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 378px;
|
||||
width: 98px;
|
||||
height: 60px;
|
||||
|
||||
|
||||
/* background-color: pink; */
|
||||
}
|
||||
|
||||
.my_goods ul li .num .hd {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.my_goods ul li .num button {
|
||||
display: block;
|
||||
float: left;
|
||||
font-size: 20px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
|
||||
}
|
||||
|
||||
.my_goods ul li .num .n {
|
||||
float: left;
|
||||
width: 38px;
|
||||
height: 30px;
|
||||
text-align: center;
|
||||
line-height: 30px;
|
||||
border: 1px solid #dddddd;
|
||||
}
|
||||
|
||||
.my_goods ul li .num .you {
|
||||
padding-top: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.my_goods ul li .sub {
|
||||
position: absolute;
|
||||
right: 270px;
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.my_goods ul li .operater {
|
||||
position: absolute;
|
||||
right: 62px;
|
||||
top: 20px;
|
||||
}
|
||||
Reference in New Issue
Block a user