chore: 重写初始提交(清空历史,整理后全量提交)
This commit is contained in:
ywxapp
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,222 @@
|
||||
/* =============== YwxApp Frontend 自定义组件样式 =============== */
|
||||
/* 基于 layuiNetCompany-v1.1.0 模板扩展，覆盖旧业务页面 */
|
||||
|
||||
/* 主体容器 */
|
||||
.main-wrapper { min-height: 60vh; }
|
||||
.layui-container { max-width: 1200px; }
|
||||
|
||||
/* 顶部公告条 */
|
||||
.site-notice-bar {
|
||||
background: linear-gradient(90deg, #1E9FFF 0%, #16b8a6 100%);
|
||||
color: #fff; font-size: 13px; line-height: 40px;
|
||||
position: fixed; left: 0; top: 0; width: 100%; z-index: 1001; overflow: hidden;
|
||||
}
|
||||
.site-notice-bar .notice-item { max-width: 1200px; margin: 0 auto; padding: 0 15px; display: flex; align-items: center; }
|
||||
.site-notice-bar .notice-badge {
|
||||
display: inline-block; background: rgba(255,255,255,.25); border-radius: 3px;
|
||||
padding: 0 8px; margin-right: 10px; font-size: 12px; line-height: 22px;
|
||||
}
|
||||
.site-notice-bar .notice-title { color: #fff; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.site-notice-bar .notice-link { color: #fff; opacity: .85; margin-left: 10px; }
|
||||
|
||||
/* 公告轮播（layui-carousel）适配 */
|
||||
.site-notice-bar .layui-carousel { background: transparent; }
|
||||
.site-notice-bar .layui-carousel [carousel-item] > * {
|
||||
line-height: 40px; height: 40px; background: transparent; text-align: center;
|
||||
}
|
||||
.site-notice-bar .layui-carousel-arrow,
|
||||
.site-notice-bar .layui-carousel-ind { display: none; }
|
||||
.site-notice-bar a:hover { text-decoration: underline; }
|
||||
|
||||
/* 通用内页头部 */
|
||||
.page-header {
|
||||
background: linear-gradient(120deg, #1E9FFF 0%, #16b8a6 100%);
|
||||
padding: 50px 0; color: #fff; text-align: center; margin-bottom: 40px;
|
||||
margin-top: 80px;
|
||||
}
|
||||
.site-notice-bar + .nav + .main-wrapper .page-header { margin-top: 120px; }
|
||||
.page-header h2 { font-size: 30px; font-weight: bold; margin-bottom: 10px; }
|
||||
.page-header p { opacity: .9; font-size: 15px; }
|
||||
.page-header .layui-breadcrumb a { color: #fff !important; }
|
||||
|
||||
/* 区块标题 */
|
||||
.section { padding: 50px 0; }
|
||||
.section-title { text-align: center; margin-bottom: 40px; }
|
||||
.section-title h3 { font-size: 26px; color: #333; font-weight: bold; position: relative; display: inline-block; padding-bottom: 12px; }
|
||||
.section-title h3:after { content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 60px; height: 3px; background: #1E9FFF; border-radius: 2px; }
|
||||
.section-title p { color: #999; margin-top: 12px; font-size: 14px; }
|
||||
|
||||
/* 新闻列表 */
|
||||
.news-list { display: flex; flex-direction: column; gap: 20px; }
|
||||
.news-card {
|
||||
display: flex; background: #fff; border-radius: 8px; overflow: hidden;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: all .3s;
|
||||
}
|
||||
.news-card:hover { box-shadow: 0 6px 20px rgba(30,159,255,.18); transform: translateY(-2px); }
|
||||
.news-card .news-thumb { width: 220px; flex-shrink: 0; overflow: hidden; }
|
||||
.news-card .news-thumb img { width: 100%; height: 100%; object-fit: cover; min-height: 150px; }
|
||||
.news-card .news-body { padding: 18px 22px; flex: 1; }
|
||||
.news-card .news-body h4 { font-size: 17px; margin-bottom: 8px; }
|
||||
.news-card .news-body h4 a { color: #333; }
|
||||
.news-card .news-body h4 a:hover { color: #1E9FFF; }
|
||||
.news-card .news-meta { color: #999; font-size: 13px; margin-bottom: 10px; }
|
||||
.news-card .news-summary { color: #666; font-size: 14px; line-height: 1.8; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
|
||||
|
||||
/* 新闻详情 */
|
||||
.news-detail { background: #fff; border-radius: 8px; padding: 40px; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
|
||||
.news-detail .detail-title { font-size: 26px; color: #333; text-align: center; margin-bottom: 16px; font-weight: bold; }
|
||||
.news-detail .detail-meta { text-align: center; color: #999; font-size: 13px; padding-bottom: 20px; border-bottom: 1px solid #eee; margin-bottom: 24px; }
|
||||
.news-detail .detail-content { font-size: 15px; line-height: 2; color: #444; }
|
||||
.news-detail .detail-content img { max-width: 100%; margin: 10px 0; }
|
||||
|
||||
/* 关于我们 / 通用图文 */
|
||||
.about-section { display: flex; gap: 40px; align-items: center; }
|
||||
.about-section .about-img { flex: 1; border-radius: 8px; overflow: hidden; }
|
||||
.about-section .about-img img { width: 100%; }
|
||||
.about-section .about-text { flex: 1; }
|
||||
.about-section .about-text h3 { font-size: 24px; margin-bottom: 16px; color: #333; }
|
||||
.about-section .about-text p { color: #666; line-height: 2; margin-bottom: 12px; }
|
||||
.about-stats { display: flex; gap: 30px; margin-top: 24px; }
|
||||
.about-stats .stat { text-align: center; }
|
||||
.about-stats .stat .num { font-size: 32px; font-weight: bold; color: #1E9FFF; }
|
||||
.about-stats .stat .label { color: #999; font-size: 14px; }
|
||||
|
||||
/* 联系我们 */
|
||||
.contact-wrap { display: flex; gap: 40px; }
|
||||
.contact-info { flex: 1; }
|
||||
.contact-info .info-item { display: flex; align-items: flex-start; margin-bottom: 24px; }
|
||||
.contact-info .info-item .icon { width: 46px; height: 46px; border-radius: 50%; background: #e8f4ff; color: #1E9FFF; display: flex; align-items: center; justify-content: center; font-size: 22px; margin-right: 16px; flex-shrink: 0; }
|
||||
.contact-info .info-item .text h4 { font-size: 15px; color: #333; margin-bottom: 4px; }
|
||||
.contact-info .info-item .text p { color: #666; font-size: 14px; }
|
||||
.contact-form { flex: 1; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
|
||||
|
||||
/* 卡片网格 */
|
||||
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
|
||||
.feature-card, .product-card, .case-card {
|
||||
background: #fff; border-radius: 8px; padding: 30px; text-align: center;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,.06); transition: all .3s;
|
||||
}
|
||||
.feature-card:hover, .product-card:hover, .case-card:hover { box-shadow: 0 6px 20px rgba(30,159,255,.18); transform: translateY(-4px); }
|
||||
.feature-card .icon, .product-card .icon { font-size: 40px; color: #1E9FFF; margin-bottom: 16px; }
|
||||
.feature-card h4, .product-card h4, .case-card h4 { font-size: 18px; margin-bottom: 12px; color: #333; }
|
||||
.feature-card p, .product-card p, .case-card p { color: #666; font-size: 14px; line-height: 1.8; }
|
||||
|
||||
/* 帮助/公告列表 */
|
||||
.doc-list { background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,.06); }
|
||||
.doc-list .doc-item { display: flex; align-items: center; padding: 16px 22px; border-bottom: 1px solid #f2f2f2; transition: background .2s; }
|
||||
.doc-list .doc-item:hover { background: #f7fbff; }
|
||||
.doc-list .doc-item .doc-tag { background: #e8f4ff; color: #1E9FFF; font-size: 12px; padding: 2px 8px; border-radius: 3px; margin-right: 12px; }
|
||||
.doc-list .doc-item .doc-title { flex: 1; color: #333; }
|
||||
.doc-list .doc-item .doc-time { color: #999; font-size: 13px; }
|
||||
.doc-list .doc-item .doc-arrow { color: #ccc; margin-left: 12px; }
|
||||
|
||||
/* 首页轮播与 Banner */
|
||||
.home-carousel { margin-top: 0; }
|
||||
.home-carousel .layui-carousel { margin-bottom: 0; }
|
||||
.banner-item { position: relative; height: 480px; display: flex; align-items: center; justify-content: center; }
|
||||
.banner-inner { text-align: center; color: #fff; padding: 0 20px; max-width: 760px; }
|
||||
.banner-inner h2 { font-size: 42px; font-weight: bold; margin-bottom: 18px; text-shadow: 0 2px 8px rgba(0,0,0,.2); }
|
||||
.banner-inner p { font-size: 18px; opacity: .95; margin-bottom: 28px; text-shadow: 0 1px 4px rgba(0,0,0,.2); }
|
||||
.banner-btn { display: inline-block; padding: 12px 36px; background: #fff; color: #1E9FFF; border-radius: 30px; font-size: 16px; font-weight: bold; transition: all .3s; box-shadow: 0 4px 14px rgba(0,0,0,.15); }
|
||||
.banner-btn:hover { background: #f2f8ff; transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.2); }
|
||||
|
||||
/* 首页底部 CTA */
|
||||
.home-cta { background: linear-gradient(120deg, #1E9FFF 0%, #16b8a6 100%); color: #fff; text-align: center; padding: 60px 0; margin-top: 10px; }
|
||||
.home-cta h3 { font-size: 28px; font-weight: bold; margin-bottom: 12px; }
|
||||
.home-cta p { font-size: 16px; opacity: .9; margin-bottom: 26px; }
|
||||
.home-cta .banner-btn { background: rgba(255,255,255,.15); color: #fff; border: 1px solid rgba(255,255,255,.6); }
|
||||
.home-cta .banner-btn:hover { background: #fff; color: #1E9FFF; }
|
||||
|
||||
/* 特性要点列表 / 代码块 */
|
||||
.feature-points { margin: 14px 0; padding: 0; list-style: none; }
|
||||
.feature-points li { padding: 6px 0; color: #555; font-size: 14px; line-height: 1.6; }
|
||||
.feature-points li .layui-icon { color: #1E9FFF; margin-right: 8px; }
|
||||
.code-block {
|
||||
background: #2d2d2d; color: #f8f8f2; padding: 18px; border-radius: 8px;
|
||||
font-family: Consolas, Monaco, monospace; font-size: 13px; line-height: 1.7;
|
||||
overflow: auto; max-height: 320px; white-space: pre-wrap; word-break: break-all;
|
||||
}
|
||||
|
||||
/* 返回顶部 / 广告位 */
|
||||
.go-top { position: fixed; right: 24px; bottom: 60px; width: 44px; height: 44px; line-height: 44px; text-align: center; background: #1E9FFF; color: #fff; border-radius: 6px; cursor: pointer; display: none; z-index: 999; box-shadow: 0 2px 10px rgba(30,159,255,.4); }
|
||||
.go-top:hover { background: #0d8de9; }
|
||||
|
||||
.ad-popup-mask { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,.5); z-index: 1999; display: flex; align-items: center; justify-content: center; }
|
||||
.ad-popup { position: relative; max-width: 90%; }
|
||||
.ad-popup img { max-width: 100%; border-radius: 8px; }
|
||||
.ad-popup .ad-close { position: absolute; right: -12px; top: -12px; width: 32px; height: 32px; line-height: 32px; text-align: center; background: #fff; color: #999; border-radius: 50%; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.2); }
|
||||
.ad-float { position: fixed; right: 16px; bottom: 120px; width: 120px; z-index: 998; cursor: pointer; }
|
||||
.ad-float img { width: 100%; border-radius: 8px; }
|
||||
.ad-float .ad-close { position: absolute; right: -8px; top: -8px; width: 22px; height: 22px; line-height: 22px; text-align: center; background: #fff; color: #999; border-radius: 50%; cursor: pointer; font-size: 12px; }
|
||||
|
||||
/* 空状态 */
|
||||
.empty-tip { text-align: center; padding: 60px 0; color: #999; }
|
||||
.empty-tip .layui-icon { font-size: 48px; display: block; margin-bottom: 12px; color: #ddd; }
|
||||
|
||||
/* 分页 */
|
||||
.list-pager { text-align: center; margin-top: 40px; }
|
||||
|
||||
/* 响应式 */
|
||||
@media (max-width: 768px) {
|
||||
.card-grid { grid-template-columns: 1fr; }
|
||||
.about-section, .contact-wrap { flex-direction: column; }
|
||||
.news-card { flex-direction: column; }
|
||||
.news-card .news-thumb { width: 100%; height: 180px; }
|
||||
.page-header { padding: 30px 0; }
|
||||
.page-header h2 { font-size: 22px; }
|
||||
.banner-inner h2 { font-size: 26px; }
|
||||
.banner-inner p { font-size: 15px; }
|
||||
.banner-item { height: 320px; }
|
||||
.home-cta h3 { font-size: 22px; }
|
||||
.about-stats { gap: 20px !important; flex-wrap: wrap; }
|
||||
}
|
||||
|
||||
/* 公告条固定顶部，导航固定在其下方，主体补偿公告条高度（40px） */
|
||||
.nav { top: 40px; }
|
||||
.main-wrapper { padding-top: 40px; }
|
||||
|
||||
/* 移动端导航切换按钮（.nav-list button），桌面隐藏 */
|
||||
.nav .nav-list { display: none; }
|
||||
.nav .nav-list button { position: relative; top: 0; right: 0; }
|
||||
|
||||
.nav .nav-list button span { transition: .3s; }
|
||||
.nav .nav-list button.open span:nth-child(1) { transform: rotate(45deg) translate(6px,5px); }
|
||||
.nav .nav-list button.open span:nth-child(2) { opacity: 0; }
|
||||
.nav .nav-list button.open span:nth-child(3) { transform: rotate(-45deg) translate(6px,-5px); }
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.site-notice-bar { display: none; }
|
||||
.nav { top: 0; }
|
||||
.main-wrapper { padding-top: 0; }
|
||||
.nav .nav-list { display: block; position: absolute; top: 25px; right: 15px; }
|
||||
.nav .layui-nav {
|
||||
position: absolute; left: 0; right: 0; top: 80px;
|
||||
background: #fff; flex-direction: column;
|
||||
display: none; padding: 6px 0; box-shadow: 0 6px 16px rgba(0,0,0,.12);
|
||||
border-top: 1px solid #f0f0f0;
|
||||
}
|
||||
.nav .layui-nav.open { display: block; }
|
||||
.nav .layui-nav .layui-nav-item { display: block; line-height: 50px; text-align: center; }
|
||||
.nav .layui-nav .layui-nav-item a { color: #333 !important; padding: 0 !important; }
|
||||
.nav .layui-nav .layui-this a { color: #2db5a3 !important; }
|
||||
.nav .nav-logo { left: 15px; }
|
||||
}
|
||||
|
||||
/* 底部（覆盖 index.css 深色 .footer，采用浅色现代风格） */
|
||||
.footer { background: #1f2d3d; padding: 0; }
|
||||
.footer-top { padding: 50px 0 30px; }
|
||||
.footer .footer-column { margin-bottom: 24px; }
|
||||
.footer .footer-column h3 { color: #fff; font-size: 16px; margin-bottom: 16px; position: relative; padding-bottom: 10px; }
|
||||
.footer .footer-column h3:after { content: ''; position: absolute; left: 0; bottom: 0; width: 36px; height: 2px; background: #2db5a3; }
|
||||
.footer .footer-desc { color: #aeb9c4; font-size: 13px; line-height: 1.9; margin-bottom: 16px; }
|
||||
.footer .footer-contact p { color: #aeb9c4; font-size: 13px; line-height: 2; }
|
||||
.footer .footer-contact .layui-icon { color: #2db5a3; margin-right: 6px; }
|
||||
.footer .footer-links { list-style: none; }
|
||||
.footer .footer-links li { line-height: 2.2; }
|
||||
.footer .footer-links a { color: #aeb9c4; font-size: 13px; transition: .2s; }
|
||||
.footer .footer-links a:hover { color: #fff; padding-left: 4px; }
|
||||
.footer .footer-qrcode { text-align: center; }
|
||||
.footer .footer-qrcode img { width: 110px; height: 110px; border-radius: 6px; background: #fff; padding: 6px; }
|
||||
.footer .footer-qrcode p { color: #aeb9c4; font-size: 12px; margin-top: 10px; line-height: 1.6; }
|
||||
.footer-bottom { background: #18232f; text-align: center; padding: 16px 0; color: #7a8694; font-size: 13px; line-height: 1.8; }
|
||||
.footer-bottom .beian { font-size: 12px; }
|
||||
@@ -0,0 +1,245 @@
|
||||
/**
|
||||
|
||||
@Name: layuiNetCompany - 大气风格的网络公司企业模版
|
||||
@Author: xuxingyu
|
||||
@Copyright: layui.com
|
||||
|
||||
*/
|
||||
|
||||
|
||||
body{background: #fff;}
|
||||
|
||||
/** 首页 */
|
||||
|
||||
/*导航部分*/
|
||||
.nav{width: 100%; height: 80px; box-shadow: 0 3px 3px 0 #CCC; background: #FFF; position: fixed; left: 0; top: 0; z-index: 999; overflow: hidden; transition: 0.3s}
|
||||
.nav.index{background: rgba(255, 255, 255 ,0.8); box-shadow: 0 0 0 0 rgba(0,0,0,0.05);}
|
||||
.nav.scroll{ background: #FFF; box-shadow: 0 3px 3px 0 rgba(0,0,0,0.05); transition: 0.3s}
|
||||
.nav .layui-container{position: relative; transition: all 400ms ease-out;}
|
||||
.nav .nav-logo{height: 100%; position: absolute; top: 0; left: 15px; line-height: 80px;}
|
||||
.nav .nav-list{display: inline-block; height: 80px;}
|
||||
.nav .nav-list button{width: 25px; height: 30px; position: absolute; top: 30px; right: 15px; background-color: transparent; border: none; outline: none; cursor: pointer;}
|
||||
.nav .nav-list button span{display: block; width: 25px; height: 2px; background: #2db5a3; margin-bottom: 6px; transition: 0.5s;}
|
||||
.nav .nav-list button span.spa1{transform: rotate(45deg);}
|
||||
.nav .nav-list button span.spa3{transform: rotate(-45deg) translate(5px,-5px);}
|
||||
.nav .layui-nav{width: 100%; position: absolute; top: 80px; right: 0; color: #000; background: transparent;}
|
||||
.nav .layui-nav .layui-nav-item{display: block; line-height: 60px;}
|
||||
.nav .layui-nav *{font-size: 18px;}
|
||||
.nav .layui-nav .layui-nav-item a{padding: 0 0; color: #000;}
|
||||
.nav .layui-nav-bar,
|
||||
.nav .layui-nav .layui-this:after{height: 2px; background-color: #2db5a3;}
|
||||
.nav .layui-nav .layui-this a
|
||||
,.nav .layui-nav .layui-nav-item a:hover{color: #2db5a3;}
|
||||
|
||||
/*轮播*/
|
||||
#banner img{min-width: 100%; height: 898px;}
|
||||
#banner .panel{width: 400px; position: absolute; top: 25%; left: 50%; margin-left: -200px; text-align: center;}
|
||||
#banner .panel p{color: #8c8c8c; font-size: 44px; line-height: 80px; letter-spacing: 15px;}
|
||||
#banner .panel p.title{color: #4a4a4a; font-size: 54px; letter-spacing: 10px;}
|
||||
|
||||
/*主体—产品*/
|
||||
.main-product{padding-top: 90px; padding-bottom: 130px;}
|
||||
.main-product p{font-size: 16px; color: #ababab; line-height: 28px;}
|
||||
.main-product p.title
|
||||
,.main-service p.title{color: #484848; font-size: 24px; text-align: center; line-height: 160px;}
|
||||
.main-product p.title span
|
||||
,.main-service p.title span{color: #2db5a3;}
|
||||
.main-product .content{border: 1px solid #DEDEDE; padding: 30px 36px 0 36px; text-align: center; transition: 0.3s;}
|
||||
.main-product .content p.label{font-size: 18px; color: #939393; line-height: 46px; padding-top: 6px;}
|
||||
.main-product .content a{font-size: 18px; color: #a1d8cb; line-height: 68px;}
|
||||
.main-product .content:hover{box-shadow: 0 0 3px 3px #EEE; transition: 0.3s;}
|
||||
.main-product .content img{transition: 2s;}
|
||||
.main-product .content img:hover{transform: rotateY(180deg);}
|
||||
|
||||
/*主体-服务*/
|
||||
.main-service{background: #f8f8f8;}
|
||||
.main-service .content{position: relative;}
|
||||
.main-service .content .content-left{width: 50%;}
|
||||
.main-service .content .content-left img{width: 100%;}
|
||||
.main-service .content .content-right{box-sizing: border-box; background: #FFF; padding: 58px 40px 0 48px; width: 50%; height: 100%; position: absolute; top: 0; right: 0; transition: 0.3s; overflow: hidden;}
|
||||
.main-service .content .content-right p{color: #adadad; line-height: 32px; overflow: hidden; text-overflow: ellipsis;}
|
||||
.main-service .content .content-right p.label{font-size: 16px; color: #4a4a4a;}
|
||||
.main-service .content .content-right span{display: block; width: 50px; height: 2px; background: #2cb6a1; margin-bottom: 23px;}
|
||||
.main-service .content .content-right:hover{box-shadow: 2px 2px 2px #EEE; transition: 0.3s;}
|
||||
.main-service .service-more{padding-top: 80px; padding-bottom: 80px; text-align: center;}
|
||||
.main-service .service-more a{padding: 10px 62px; font-size: 23px; line-height: 46px;color: #FFF; background: #7fd3c6; border-radius: 3px;}
|
||||
|
||||
/*底部*/
|
||||
.footer{padding-bottom: 70px; background: #5e6664;}
|
||||
.footer .footer-web{padding-top: 50px; padding-bottom: 63px;}
|
||||
.footer .footer-web a{color: #a5aaa9; line-height: 22px; margin-right: 20px; transition: 0.3s;}
|
||||
.footer .footer-web a:hover{color: #dce1e0; transition: 0.3s;}
|
||||
.footer .footer-contact{color: #fff;}
|
||||
.footer .footer-contact a{color: #a5aaa9;}
|
||||
.footer .footer-contact .contact-top{padding-top: 20px; line-height: 30px;}
|
||||
.footer .footer-contact .contact-bottom{line-height: 35px;}
|
||||
|
||||
|
||||
/** 产品 */
|
||||
.banner{height: 320px; margin-top: 80px;}
|
||||
.banner.product{background: url(../img/nav_img1.jpg) no-repeat center top; background-size: cover;}
|
||||
.main.product{padding: 30px 0 75px 0;}
|
||||
.main.product .content{padding: 50px 0; border-bottom: 1px solid #e8e8e8;}
|
||||
.main.product .content .content-img{text-align: center;}
|
||||
.main.product .content .content-img img{max-width: 100%;}
|
||||
.main.product .content .label{color: #565656; font-size: 30px; line-height: 78px; margin-top: 32px;}
|
||||
.main.product .content .detail{font-size: 16px; line-height: 28px; color: #d7d7d7; padding-bottom: 30px;}
|
||||
.main.product .content a{color: #a0d2cc; font-size: 16px; line-height: 38px; padding:10px 11px 10px 23px; border: 1px solid #a0d2cc; border-radius: 3px;}
|
||||
|
||||
|
||||
/** 动态 */
|
||||
.banner.news{background: url(../img/nav_img3.jpg) no-repeat center top; background-size: cover;}
|
||||
.banner .title{padding-top: 170px;}
|
||||
.banner .title.active{padding-top: 120px; transition: 1.5s;}
|
||||
.banner .title p{color: #606060; font-size: 36px; text-align: center; line-height: 50px; letter-spacing: 5px;}
|
||||
.banner .title p.en{font-size: 20px; letter-spacing: 3px;}
|
||||
.main-news{padding: 70px 0 80px 0;}
|
||||
.main-news .content > div{padding-bottom: 40px; border-bottom: 1px dashed #eaeaea; position: relative;}
|
||||
.main-news .content .news-img{display: inline-block; width: 30%; vertical-align: top;}
|
||||
.main-news .content .news-img img{max-width: 90%;}
|
||||
.main-news .content .news-panel{display: inline-block; width: 70%; vertical-align: top; padding-left: 5px; box-sizing: border-box;}
|
||||
.main-news .content .news-panel strong a{display: block; color: #555; font-size: 18px; line-height: 26px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
|
||||
.main-news .content .news-panel p.detail{color: #777; line-height: 24px;}
|
||||
.main-news .content .news-panel p.read-push{color: #AAA; padding-top: 5px;}
|
||||
.main-news #newsPage .layui-laypage{display: block; text-align: center; margin-top: 70px;}
|
||||
.main-news #newsPage .layui-laypage a,.main-news #newsPage .layui-laypage span{font-size: 18px; line-height: 40px; height: 40px; margin-right: 20px; border-radius: 3px; color: #e3e3e3;}
|
||||
/*动态详情页*/
|
||||
.main-newsdate{margin-top: 80px; text-align: center;}
|
||||
.main-newsdate .news{text-align: left; line-height: 104px;}
|
||||
.main-newsdate h1{padding-top: 6px;}
|
||||
.main-newsdate .pushtime{color: #686868; font-size: 18px; line-height: 82px;}
|
||||
.main-newsdate .introTop{padding-bottom: 28px; font-size: 18px; line-height: 20px; text-align: left;}
|
||||
.main-newsdate .introBott{font-size: 18px; line-height: 42px; text-align: justify; padding: 40px 0 102px 0;}
|
||||
.main-newsdate img{max-width: 100%;}
|
||||
|
||||
|
||||
/** 案例 */
|
||||
.banner.case{background: url(../img/nav_img2.jpg) no-repeat center top; background-size: cover;}
|
||||
.main-case{padding: 30px 0 75px;}
|
||||
.main-case .content{width: 48%; text-align: center; padding-top: 120px; padding-bottom: 20px; border-bottom: 2px solid #c9c9c9;}
|
||||
.main-case .content.even{margin-left: 2%;}
|
||||
.main-case .content .case-img{border: 1px solid #e2e2e2; overflow: hidden;}
|
||||
.main-case .content .case-img img{width: 100%; transition: 2s;}
|
||||
.main-case .content .case-img img:hover{transform: scale(1.2,1.2); transition: 2s;}
|
||||
.main-case .content p.lable{padding-top: 13px; font-size: 30px; line-height: 76px;}
|
||||
.main-case .content p{font-size: 18px; line-height: 32px; color: #505050;}
|
||||
.main-case #casePage .layui-laypage{display: block; text-align: center; margin-top: 100px;}
|
||||
.main-case #casePage .layui-laypage a,.main-case #casePage .layui-laypage span{font-size: 18px; line-height: 40px; height: 40px; margin-right: 20px; border-radius: 3px; color: #e3e3e3;}
|
||||
|
||||
|
||||
/** 关于 */
|
||||
.banner.about{background: url(../img/nav_img4.jpg) no-repeat center top; background-size: cover;}
|
||||
.main-about{padding-bottom: 130px;}
|
||||
.main-about ul.aboutab{padding: 100px 0; text-align: center;}
|
||||
.main-about ul.aboutab li{display: inline-block; padding: 0 22px; margin-left: 15px; font-size: 20px; line-height: 46px; color: #b5b5b5; border: 1px solid #e2e2e2; border-radius: 3px; cursor: pointer;}
|
||||
.main-about ul.aboutab li:first-child{margin-left: 0;}
|
||||
.main-about ul.aboutab li.layui-this
|
||||
,.main-about ul.aboutab li:hover{color: #2ab5a3; border-color: #afddd7; transition: 0.3s;}
|
||||
.main-about .tabJob, .main-about .tabCour{display: none;}
|
||||
/*公司简介*/
|
||||
.main-about .tabIntro{padding-bottom: 15px;}
|
||||
.main-about .tabIntro .content{vertical-align: middle;}
|
||||
.main-about .tabIntro .content .img{width: 50%;}
|
||||
.main-about .tabIntro .content .img img{width: 100%;}
|
||||
.main-about .tabIntro .content .panel{width: 50%;}
|
||||
.main-about .tabIntro .content p{padding: 0 20px; line-height: 24px; text-align: justify;}
|
||||
.main-about .tabIntro .p_hidden{padding: 0 20px; display: none;}
|
||||
/*招贤纳士*/
|
||||
.main-about .tabJob .content{padding: 0 0 40px 20px; border: 1px solid #e2e2e2; border-top: 4px solid #65d0c5; margin-top: 90px;}
|
||||
.main-about .tabJob .content:first-child{margin-top: 10px;}
|
||||
.main-about .tabJob .content p{font-size: 18px; line-height: 40px;}
|
||||
.main-about .tabJob .content p.title{font-size: 24px; color: #545454; line-height: 60px;}
|
||||
.main-about .tabJob .content ol{padding-left: 20px; list-style-type: none; counter-reset: sectioncounter;}
|
||||
.main-about .tabJob .content ol li{color: #8d8d8d; font-size: 16px; line-height: 30px;}
|
||||
.main-about .tabJob .content ol li:before {content: counter(sectioncounter) "、"; counter-increment: sectioncounter;}
|
||||
/*发展历程*/
|
||||
.main-about .tabCour p.title{font-size: 28px; line-height: 28px; text-align: center;}
|
||||
.main-about .tabCour .timeline{position: relative; margin-top: 75px;}
|
||||
.main-about .tabCour .timeline:before{position: absolute; top: 0; bottom: 0; content: ""; width: 2px; background-color: #e2e2e2; left: 50px;}
|
||||
.main-about .tabCour .timeline li{position: relative; padding-top: 70px;}
|
||||
.main-about .tabCour .timeline li:first-child{padding-top: 0;}
|
||||
.main-about .tabCour .timeline li .cour-img{position: absolute; left: 0; width: 100px; border-radius: 50%;}
|
||||
.main-about .tabCour .timeline li .cour-img img{width: 100%;}
|
||||
.main-about .tabCour .timeline li .cour-panel{padding-top: 20px; padding-left: 120px; text-align: left;}
|
||||
.main-about .tabCour .timeline li .cour-panel p.label{font-size: 18px; color: #000;}
|
||||
.main-about .tabCour .timeline li .cour-panel p{color: #949494; line-height: 30px;}
|
||||
|
||||
|
||||
@media screen and (max-width: 480px){
|
||||
.main-service .content .content-right{padding: 10px 10px 0 10px;}
|
||||
.main-service .content .content-right p{line-height: 24px;}
|
||||
.main-news .content .news-panel p.read-push{font-size: 12px;}
|
||||
.main-case .content{padding-top: 60px;}
|
||||
.main-case .content p.lable{padding-top: 10px; font-size: 18px; line-height: 48px;}
|
||||
.main-case .content p{font-size: 12px; line-height: 20px; color: #505050;}
|
||||
.main-about ul.aboutab{padding: 70px 0;}
|
||||
.main-about ul.aboutab li{padding: 0 15px; font-size: 16px; box-sizing: border-box;}
|
||||
.main-about .tabIntro .content .img{width: 100%;}
|
||||
.main-about .tabIntro .content .panel{width: 100%;}
|
||||
.main-about .tabIntro .content .panel.p_block{display: none;}
|
||||
.main-about .tabIntro .p_hidden{display: block;}
|
||||
.main-news #newsPage .layui-laypage a,.main-news #newsPage .layui-laypage span
|
||||
,.main-case #casePage .layui-laypage a,.main-case #casePage .layui-laypage span{padding: 0 12px; font-size: 14px; line-height: 30px; height: 30px; margin-right: 4px;}
|
||||
}
|
||||
/*小屏幕*/
|
||||
@media screen and (min-width: 768px){
|
||||
.nav{max-height: 80px;}
|
||||
.nav.index{background: rgba(255, 255, 255 ,0.3);}
|
||||
.nav .nav-list button{display: none;}
|
||||
.nav .layui-nav{width: auto; position: absolute; top: 0; padding: 0 5px; border-radius: 0; margin: 0;}
|
||||
.nav .layui-nav .layui-nav-item{display: inline-block; margin:0 53px; line-height: 80px;}
|
||||
.main-product p.title
|
||||
,.main-service p.title{font-size: 36px; line-height: 216px;}
|
||||
.main.product .content .content-img{text-align: left;}
|
||||
.main-news .content .news-panel strong a{font-size: 20px; line-height: 30px;}
|
||||
.main-news .content .news-panel p.read-push{padding-top: 0; position: absolute; bottom: 40px;}
|
||||
.main-newsdate .pushtime{line-height: 142px;}
|
||||
.main-case .content{width: 45%;}
|
||||
.main-case .content.even{margin-left: 9%;}
|
||||
.main-about ul.aboutab li{padding: 0 32px; font-size: 24px; margin-left: 30px; line-height: 50px;}
|
||||
.main-about .tabIntro .content p{padding: 0 30px; font-size: 18px; line-height: 30px;}
|
||||
.main-about .tabJob .content p{font-size: 24px; line-height: 50px;}
|
||||
.main-about .tabJob .content p.title{font-size: 30px; line-height: 90px;}
|
||||
.main-about .tabJob .content ol li{font-size: 20px; line-height: 60px;}
|
||||
.main-about .tabCour .timeline:before{left: 50%;}
|
||||
.main-about .tabCour .timeline li{min-height: 195px; padding-top: 95px;}
|
||||
.main-about .tabCour .timeline li .cour-img{left: 50%; margin-left: -97.5px; width: 195px;}
|
||||
.main-about .tabCour .timeline li .cour-panel{padding-top: 55px; padding-left: 0;}
|
||||
.main-about .tabCour .timeline li.odd .cour-panel{text-align: right;}
|
||||
}
|
||||
@media screen and (min-width: 768px) and (max-width: 992px){
|
||||
.main.product .content div.right{padding-left: 20px;}
|
||||
.nav .layui-nav .layui-nav-item{margin:0 33px;}
|
||||
.main-service .content .content-right{padding: 10px 10px 0 15px;}
|
||||
.main-service .content .content-right span{margin-bottom: 20px;}
|
||||
.main-service .content .content-right p{line-height: 28px;}
|
||||
.main.product .content .label{line-height: 40px; margin-top: 0;}
|
||||
.main.product .content .detail{padding-bottom: 10px;}
|
||||
}
|
||||
/*大屏幕*/
|
||||
@media screen and (min-width: 992px){
|
||||
.main.product .content{padding: 100px 0;}
|
||||
.main.product .content div.right{padding-left: 0;}
|
||||
.main-news .content .news-img{width: 20%;}
|
||||
.main-news .content .news-panel{width: 80%;}
|
||||
.main-case .content{width: 31%;}
|
||||
.main-case .content.even{margin-left: 0;}
|
||||
.main-case .content.center{margin-right: 3%; margin-left: 3%;}
|
||||
.main-about .tabIntro .content p{padding: 0 50px; font-size: 20px; line-height: 40px;}
|
||||
}
|
||||
/*超大屏幕*/
|
||||
@media screen and (min-width: 1200px) {
|
||||
.main-news .content .news-img{width: 35%;}
|
||||
.main-news .content .news-panel{width: 65%;}
|
||||
.main-news .content:nth-child(odd){padding-right: 20px;}
|
||||
.main-news .content:nth-child(even){padding-left: 20px;}
|
||||
.main-about .tabCour .timeline li .cour-panel{padding-left: 50px;}
|
||||
.main-about .tabCour .timeline li.odd .cour-panel{padding-left: 0; padding-right: 50px;}
|
||||
}
|
||||
@media screen and (min-width: 1300px) {
|
||||
.layui-container{width: 1200px; padding: 0;}
|
||||
.main-about .tabJob .content:last-child{margin-bottom: 180px;}
|
||||
.nav .nav-logo{position: absolute; top: 0; left: 0;}
|
||||
.layui-col-space80{margin: -40px;}
|
||||
.layui-col-space80>*{padding: 40px;}
|
||||
}
|
||||
@@ -0,0 +1,451 @@
|
||||
/* =============== 重置与基础 =============== */
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
body { font-family: "Microsoft YaHei", "PingFang SC", sans-serif; line-height: 1.6; color: #333; background: #f5f5f5; }
|
||||
img { max-width: 100%; height: auto; }
|
||||
a { text-decoration: none; color: #333; transition: color 0.3s; }
|
||||
a:hover { color: #1E9FFF; }
|
||||
ul, ol { list-style: none; }
|
||||
|
||||
/* =============== 重构导航栏（彻底解决重合） =============== */
|
||||
.main-header {
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
height: 60px;
|
||||
transition: box-shadow 0.3s;
|
||||
}
|
||||
.main-header.scrolled {
|
||||
box-shadow: 0 2px 15px rgba(0,0,0,0.12);
|
||||
}
|
||||
.header-container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.header-inner {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Logo区域 */
|
||||
.logo-box {
|
||||
flex: 0 0 180px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.logo-link {
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #1E9FFF;
|
||||
line-height: 1;
|
||||
}
|
||||
.logo-text {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 导航菜单 */
|
||||
.nav-menu {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.nav-item {
|
||||
position: relative;
|
||||
margin: 0 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.nav-item a {
|
||||
color: #333;
|
||||
font-size: 16px;
|
||||
padding: 8px 0;
|
||||
display: block;
|
||||
line-height: 1;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.nav-item a i {
|
||||
margin-right: 5px;
|
||||
font-size: 15px;
|
||||
}
|
||||
.nav-item.active a,
|
||||
.nav-item:hover a {
|
||||
color: #1E9FFF;
|
||||
}
|
||||
.nav-item::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
background: #1E9FFF;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
.nav-item:hover::after,
|
||||
.nav-item.active::after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 汉堡菜单 */
|
||||
.nav-trigger {
|
||||
display: none;
|
||||
width: 28px;
|
||||
height: 22px;
|
||||
cursor: pointer;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
z-index: 10000;
|
||||
}
|
||||
.nav-trigger span {
|
||||
display: block;
|
||||
height: 3px;
|
||||
width: 100%;
|
||||
background: #333;
|
||||
border-radius: 2px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.nav-trigger.active span:nth-child(1) {
|
||||
transform: rotate(45deg) translate(5px, 5px);
|
||||
}
|
||||
.nav-trigger.active span:nth-child(2) {
|
||||
opacity: 0;
|
||||
}
|
||||
.nav-trigger.active span:nth-child(3) {
|
||||
transform: rotate(-45deg) translate(5px, -5px);
|
||||
}
|
||||
|
||||
/* =============== 主体内容安全距离 =============== */
|
||||
.main-wrapper {
|
||||
padding-top: 120px; /* 60px导航 + 60px缓冲 */
|
||||
transition: padding-top 0.3s;
|
||||
}
|
||||
.page-header {
|
||||
background: linear-gradient(135deg, #1E9FFF 0%, #0062cc 100%);
|
||||
color: #fff;
|
||||
padding: 80px 0 60px;
|
||||
text-align: center;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.page-title {
|
||||
font-size: 42px;
|
||||
font-weight: bold;
|
||||
margin: 15px 0;
|
||||
text-shadow: 0 2px 5px rgba(0,0,0,0.2);
|
||||
}
|
||||
.page-desc {
|
||||
font-size: 18px;
|
||||
opacity: 0.9;
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.breadcrumb {
|
||||
text-align: left;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.breadcrumb a {
|
||||
color: rgba(255,255,255,0.85) !important;
|
||||
}
|
||||
.breadcrumb a:hover {
|
||||
color: #fff !important;
|
||||
}
|
||||
.breadcrumb .layui-breadcrumb a cite {
|
||||
color: rgba(255,255,255,0.85) !important;
|
||||
}
|
||||
|
||||
/* =============== 面板通用样式 =============== */
|
||||
.panel {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,0.05);
|
||||
padding: 25px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.panel-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
.panel-header h2 {
|
||||
font-size: 20px;
|
||||
color: #333;
|
||||
}
|
||||
.panel-header h2 i {
|
||||
margin-right: 8px;
|
||||
color: #1E9FFF;
|
||||
}
|
||||
.more-link {
|
||||
color: #1E9FFF;
|
||||
font-size: 14px;
|
||||
}
|
||||
.more-link i {
|
||||
font-size: 12px;
|
||||
margin-left: 3px;
|
||||
display: inline-block;
|
||||
transition: transform 0.3s;
|
||||
}
|
||||
.more-link:hover i {
|
||||
transform: translateX(3px);
|
||||
}
|
||||
|
||||
/* =============== 返回顶部 =============== */
|
||||
.go-top {
|
||||
position: fixed;
|
||||
bottom: 30px;
|
||||
right: 20px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
text-align: center;
|
||||
background: rgba(30, 159, 255, 0.85);
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.2);
|
||||
display: none;
|
||||
z-index: 999;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.go-top:hover {
|
||||
background: #1E9FFF;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
/* =============== 页脚 =============== */
|
||||
.main-footer {
|
||||
background: #2c3e50;
|
||||
color: rgba(255,255,255,0.85);
|
||||
padding-top: 60px;
|
||||
margin-top: 50px;
|
||||
}
|
||||
.footer-top {
|
||||
padding-bottom: 40px;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.1);
|
||||
}
|
||||
.footer-top h3 {
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
margin-bottom: 20px;
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.footer-top h3::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 4px;
|
||||
height: 16px;
|
||||
background: #1E9FFF;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.footer-desc {
|
||||
line-height: 1.7;
|
||||
margin: 15px 0;
|
||||
font-size: 14px;
|
||||
}
|
||||
.social-links {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.social-links a {
|
||||
display: inline-block;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
background: rgba(255,255,255,0.1);
|
||||
color: #fff;
|
||||
margin-right: 10px;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.social-links a:hover {
|
||||
background: #1E9FFF;
|
||||
transform: translateY(-3px);
|
||||
}
|
||||
.footer-links li {
|
||||
line-height: 2.5;
|
||||
}
|
||||
.footer-links a {
|
||||
color: rgba(255,255,255,0.7);
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.footer-links a:hover {
|
||||
color: #1E9FFF;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.contact-list li {
|
||||
line-height: 2.2;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.contact-list i {
|
||||
color: #1E9FFF;
|
||||
margin-right: 8px;
|
||||
width: 20px;
|
||||
display: inline-block;
|
||||
}
|
||||
.contact-list a {
|
||||
color: rgba(255,255,255,0.85);
|
||||
}
|
||||
.work-time p {
|
||||
line-height: 2.2;
|
||||
}
|
||||
.time-range {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #1E9FFF;
|
||||
margin: 5px 0;
|
||||
}
|
||||
.holiday {
|
||||
font-size: 13px;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.footer-bottom {
|
||||
padding: 20px 0;
|
||||
text-align: center;
|
||||
color: rgba(255,255,255,0.6);
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
.icp-link {
|
||||
color: #1E9FFF !important;
|
||||
margin: 0 5px;
|
||||
}
|
||||
.copyright {
|
||||
font-size: 13px;
|
||||
opacity: 0.7;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
/* =============== 响应式断点 =============== */
|
||||
@media (max-width: 992px) {
|
||||
.logo-box { flex: 0 0 160px; }
|
||||
.logo-link { font-size: 19px; }
|
||||
.nav-item { margin: 0 12px; }
|
||||
.nav-item a { font-size: 15px; }
|
||||
.page-title { font-size: 36px; }
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
/* 汉堡菜单显示 */
|
||||
.nav-trigger { display: flex; }
|
||||
|
||||
/* 导航菜单移动端样式 */
|
||||
.nav-menu {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
right: -100%;
|
||||
width: 280px;
|
||||
height: calc(100vh - 60px);
|
||||
background: #fff;
|
||||
flex-direction: column;
|
||||
padding: 30px 0;
|
||||
box-shadow: -2px 0 15px rgba(0,0,0,0.15);
|
||||
transition: right 0.3s ease;
|
||||
z-index: 9998;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.nav-menu.active {
|
||||
right: 0;
|
||||
}
|
||||
.nav-item {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 30px;
|
||||
}
|
||||
.nav-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
.nav-item a {
|
||||
padding: 15px 0;
|
||||
font-size: 18px;
|
||||
text-align: left;
|
||||
display: block;
|
||||
}
|
||||
.nav-item::after { display: none; }
|
||||
|
||||
/* 移动端：二级菜单改为内嵌展开，不绝对定位 */
|
||||
.nav-item.has-child > a::after { display: none; }
|
||||
.sub-menu {
|
||||
position: static;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: none;
|
||||
box-shadow: none;
|
||||
background: #fafafa;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
min-width: 0;
|
||||
}
|
||||
.sub-item a {
|
||||
padding: 12px 30px 12px 50px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.sub-item a:hover,
|
||||
.sub-item.active a { background: #f0f6ff; }
|
||||
|
||||
/* Logo缩小 */
|
||||
.logo-box { flex: 0 0 140px; }
|
||||
.logo-link { font-size: 18px; }
|
||||
|
||||
/* 防止背景滚动 */
|
||||
body.nav-open {
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 内容区域调整 */
|
||||
.main-wrapper { padding-top: 100px; }
|
||||
.page-header { padding: 60px 0 45px; }
|
||||
.page-title { font-size: 28px; }
|
||||
.page-desc { font-size: 16px; }
|
||||
.breadcrumb { text-align: center; }
|
||||
|
||||
/* 面板调整 */
|
||||
.panel { padding: 20px 15px; }
|
||||
.panel-header h2 { font-size: 18px; }
|
||||
|
||||
/* 返回顶部 */
|
||||
.go-top {
|
||||
bottom: 20px;
|
||||
right: 15px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* 页脚调整 */
|
||||
.footer-top h3 { font-size: 17px; }
|
||||
.footer-links li, .contact-list li { line-height: 2.2; }
|
||||
.social-links a { width: 32px; height: 32px; line-height: 32px; }
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.logo-box { flex: 0 0 120px; }
|
||||
.logo-link { font-size: 17px; }
|
||||
.nav-item a { font-size: 17px; padding: 12px 0; }
|
||||
.page-title { font-size: 26px; }
|
||||
.main-wrapper { padding-top: 90px; }
|
||||
.panel { padding: 18px 12px; }
|
||||
}
|
||||
@@ -0,0 +1,318 @@
|
||||
/* =============== 全站置顶公告条（方案 A） =============== */
|
||||
.site-notice-bar { background: linear-gradient(90deg,#fff7e6,#fffbe6); border-bottom: 1px solid #ffe58f; font-size: 13px; }
|
||||
.site-notice-bar .notice-item { max-width: 1200px; margin: 0 auto; padding: 8px 15px; display: flex; align-items: center; gap: 10px; }
|
||||
.site-notice-bar .notice-badge { flex: none; background: #fa8c16; color: #fff; border-radius: 3px; padding: 1px 7px; font-size: 12px; }
|
||||
.site-notice-bar .notice-type-1 .notice-badge { background: #1890ff; }
|
||||
.site-notice-bar .notice-type-2 .notice-badge { background: #fa8c16; }
|
||||
.site-notice-bar .notice-type-3 .notice-badge { background: #52c41a; }
|
||||
.site-notice-bar .notice-type-4 .notice-badge { background: #8c8c8c; }
|
||||
.site-notice-bar .notice-title { flex: 1; color: #614700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.site-notice-bar .notice-link { flex: none; color: #d46b08; text-decoration: none; }
|
||||
.site-notice-bar .notice-link:hover { text-decoration: underline; }
|
||||
.site-notice-bar .notice-close { flex: none; cursor: pointer; color: #999; font-size: 18px; line-height: 1; padding: 0 4px; }
|
||||
.site-notice-bar .notice-close:hover { color: #666; }
|
||||
|
||||
/* =============== 站点广告位 =============== */
|
||||
/* 通用广告项 */
|
||||
.ad-slot { margin: 0; }
|
||||
.ad-item { margin: 12px 0; line-height: 0; }
|
||||
.ad-item img { max-width: 100%; height: auto; display: block; border-radius: 6px; }
|
||||
.ad-text-link, .ad-text { display: inline-block; padding: 8px 14px; color: #d46b08; background: #fff7e6; border: 1px solid #ffe58f; border-radius: 4px; text-decoration: none; font-size: 14px; line-height: 1.5; }
|
||||
.ad-text-link:hover { color: #ad4e00; }
|
||||
|
||||
/* 首页顶部横幅 */
|
||||
.ad-slot-home_top { max-width: 1200px; margin: 16px auto 0; }
|
||||
.ad-slot-home_top .ad-item { margin: 0 auto; text-align: center; }
|
||||
|
||||
/* 首页侧边浮层（固定右侧） */
|
||||
.ad-slot-home_side { position: fixed; right: 12px; top: 50%; transform: translateY(-50%); width: 160px; z-index: 50; }
|
||||
.ad-slot-home_side .ad-item { margin: 10px 0; }
|
||||
.ad-slot-home_side .ad-item img { border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.12); }
|
||||
@media (max-width: 1100px) { .ad-slot-home_side { display: none; } }
|
||||
|
||||
/* 列表底部 */
|
||||
.ad-slot-list_bottom { max-width: 1200px; margin: 20px auto 0; }
|
||||
.ad-slot-list_bottom .ad-item { text-align: center; }
|
||||
|
||||
/* 全站弹窗 */
|
||||
.ad-popup-mask { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 999; align-items: center; justify-content: center; }
|
||||
.ad-popup-box { position: relative; max-width: 90%; max-height: 86%; overflow: auto; background: #fff; border-radius: 8px; padding: 10px; box-shadow: 0 10px 40px rgba(0,0,0,.3); }
|
||||
.ad-popup-box img { max-width: 100%; height: auto; display: block; }
|
||||
.ad-popup-close { position: absolute; top: -12px; right: -12px; width: 28px; height: 28px; line-height: 26px; text-align: center; background: #fff; color: #666; border-radius: 50%; cursor: pointer; font-size: 20px; box-shadow: 0 2px 8px rgba(0,0,0,.2); z-index: 2; }
|
||||
.ad-popup-close:hover { color: #333; }
|
||||
.ad-popup-item { line-height: 0; }
|
||||
.ad-popup-item .ad-text-link, .ad-popup-item .ad-text { line-height: 1.5; }
|
||||
|
||||
/* 首页底部 */
|
||||
.ad-slot-home_bottom { max-width: 1200px; margin: 24px auto 0; }
|
||||
.ad-slot-home_bottom .ad-item { text-align: center; }
|
||||
|
||||
/* 全站悬浮角标（固定右下角，可关闭） */
|
||||
.ad-float { position: fixed; right: 16px; bottom: 16px; width: 120px; z-index: 80; }
|
||||
.ad-float-item { line-height: 0; }
|
||||
.ad-float-item img { width: 100%; height: auto; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,.18); display: block; }
|
||||
.ad-float-item .ad-text-link, .ad-float-item .ad-text { width: 100%; box-sizing: border-box; text-align: center; line-height: 1.4; }
|
||||
.ad-float-close { position: absolute; top: -10px; right: -10px; width: 22px; height: 22px; line-height: 20px; text-align: center; background: #fff; color: #666; border-radius: 50%; cursor: pointer; font-size: 16px; box-shadow: 0 2px 6px rgba(0,0,0,.25); z-index: 2; }
|
||||
.ad-float-close:hover { color: #333; }
|
||||
@media (max-width: 768px) { .ad-float { width: 92px; right: 10px; bottom: 10px; } }
|
||||
|
||||
|
||||
/* =============== 重构导航栏（解决重合核心） =============== */
|
||||
.main-header {
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
height: 60px; /* 固定高度避免抖动 */
|
||||
}
|
||||
.header-container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.header-inner {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Logo区域：固定宽度+弹性收缩 */
|
||||
.logo-box {
|
||||
flex: 0 0 180px; /* 固定宽度避免挤压 */
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.logo-link {
|
||||
display: block;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #1E9FFF;
|
||||
text-decoration: none;
|
||||
line-height: 1;
|
||||
}
|
||||
.logo-text {
|
||||
display: inline-block;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 导航菜单 */
|
||||
.nav-menu {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
}
|
||||
.nav-item {
|
||||
position: relative;
|
||||
margin: 0 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.nav-item a {
|
||||
color: #333;
|
||||
font-size: 16px;
|
||||
padding: 8px 0;
|
||||
transition: all 0.3s;
|
||||
display: block;
|
||||
line-height: 1;
|
||||
}
|
||||
.nav-item.active a,
|
||||
.nav-item:hover a {
|
||||
color: #1E9FFF;
|
||||
border-bottom: 2px solid #1E9FFF;
|
||||
}
|
||||
.nav-item.active::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: #1E9FFF;
|
||||
transform: scaleX(0);
|
||||
transform-origin: right;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
.nav-item.active::after {
|
||||
transform: scaleX(1);
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
/* 二级下拉菜单（navMenus.has-child） */
|
||||
.nav-item.has-child > a::after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
margin-left: 6px;
|
||||
border: 4px solid transparent;
|
||||
border-top-color: currentColor;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.sub-menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
min-width: 160px;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 6px 0;
|
||||
background: #fff;
|
||||
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
|
||||
border-radius: 6px;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translateY(8px);
|
||||
transition: all 0.25s ease;
|
||||
z-index: 9999;
|
||||
}
|
||||
.nav-item.has-child:hover > .sub-menu {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translateY(0);
|
||||
}
|
||||
.sub-item a {
|
||||
display: block;
|
||||
padding: 9px 18px;
|
||||
color: #333;
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.sub-item a:hover,
|
||||
.sub-item.active a {
|
||||
color: #1E9FFF;
|
||||
background: #f5f9ff;
|
||||
}
|
||||
|
||||
/* 汉堡菜单（移动端专属） */
|
||||
.nav-trigger {
|
||||
display: none;
|
||||
width: 28px;
|
||||
height: 22px;
|
||||
cursor: pointer;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
z-index: 10000;
|
||||
}
|
||||
.nav-trigger span {
|
||||
display: block;
|
||||
height: 3px;
|
||||
width: 100%;
|
||||
background: #333;
|
||||
border-radius: 2px;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.nav-trigger.active span:nth-child(1) {
|
||||
transform: rotate(45deg) translate(5px, 5px);
|
||||
}
|
||||
.nav-trigger.active span:nth-child(2) {
|
||||
opacity: 0;
|
||||
}
|
||||
.nav-trigger.active span:nth-child(3) {
|
||||
transform: rotate(-45deg) translate(5px, -5px);
|
||||
}
|
||||
|
||||
/* =============== 响应式断点 =============== */
|
||||
@media (max-width: 992px) {
|
||||
.nav-item { margin: 0 10px; }
|
||||
.logo-link { font-size: 18px; }
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
/* 显示汉堡菜单，隐藏导航 */
|
||||
.nav-trigger { display: flex; }
|
||||
.nav-menu {
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
right: -100%;
|
||||
width: 280px;
|
||||
height: calc(100vh - 60px);
|
||||
background: #fff;
|
||||
flex-direction: column;
|
||||
padding: 30px 0;
|
||||
box-shadow: -2px 0 10px rgba(0,0,0,0.1);
|
||||
transition: right 0.3s ease;
|
||||
z-index: 9998;
|
||||
}
|
||||
.nav-menu.active {
|
||||
right: 0;
|
||||
}
|
||||
.nav-item {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
.nav-item a {
|
||||
padding: 15px 30px;
|
||||
font-size: 18px;
|
||||
text-align: left;
|
||||
border-bottom: none !important;
|
||||
}
|
||||
.nav-item::after { display: none; }
|
||||
|
||||
/* Logo区域缩小 */
|
||||
.logo-box { flex: 0 0 150px; }
|
||||
.logo-link { font-size: 18px; }
|
||||
|
||||
/* 防止页面滚动时导航抖动 */
|
||||
body.nav-open {
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.logo-box { flex: 0 0 120px; }
|
||||
.logo-link { font-size: 16px; }
|
||||
.nav-item a { padding: 12px 25px; font-size: 17px; }
|
||||
}
|
||||
|
||||
/* 顶部安全距离（避免内容被固定导航遮挡） */
|
||||
.main-wrapper {
|
||||
padding-top: 100px; /* 60px导航 + 40px缓冲 */
|
||||
transition: padding-top 0.3s;
|
||||
}
|
||||
.banner-wrapper {
|
||||
margin-top: 60px; /* 与导航高度一致 */
|
||||
}
|
||||
.banner-carousel { border-radius: 0; }
|
||||
@media (max-width: 768px) {
|
||||
.main-wrapper { padding-top: 80px; }
|
||||
.banner-wrapper { margin-top: 60px; }
|
||||
.banner-carousel { height: 220px !important; }
|
||||
}
|
||||
|
||||
/* 返回顶部按钮样式 */
|
||||
.go-top {
|
||||
position: fixed;
|
||||
bottom: 30px;
|
||||
right: 20px;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
text-align: center;
|
||||
background: rgba(30, 159, 255, 0.85);
|
||||
color: #fff;
|
||||
border-radius: 50%;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.2);
|
||||
display: none;
|
||||
z-index: 999;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
.go-top:hover {
|
||||
background: #1E9FFF;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.go-top { bottom: 20px; right: 15px; width: 40px; height: 40px; line-height: 40px; }
|
||||
}
|
||||
@@ -0,0 +1,179 @@
|
||||
/**
|
||||
* admin.templte.css
|
||||
*/
|
||||
|
||||
/********************************
|
||||
|
||||
模板开始
|
||||
|
||||
*******************************/
|
||||
|
||||
|
||||
/* 产品版本选择面板 */
|
||||
.layadmin-panel-selection{width: 768px; margin: 30px auto;}
|
||||
.layadmin-panel-selection .layui-panel-window{padding: 30px 50px; border-top-color: #ddd; text-align: center;}
|
||||
.layadmin-panel-selection .layui-panel-window h2{padding-bottom: 15px; font-size: 18px;}
|
||||
.layadmin-panel-selection .layui-panel-window ul{margin-top: 15px; text-align: left;}
|
||||
.layadmin-panel-selection .layui-btn-container{margin-top: 30px;}
|
||||
.layadmin-panel-selection .layui-btn-container .layui-btn{width: 100%;}
|
||||
|
||||
/* 通讯录面板 */
|
||||
.layadmin-maillist-fluid .layadmin-contact-box{padding:20px;background-color: #fff;
|
||||
border: 1px solid #e7eaec;overflow: hidden;}
|
||||
.layadmin-maillist-fluid .layadmin-text-center{text-align: center;}
|
||||
.layadmin-maillist-fluid .layadmin-text-center img{max-width: 80%;border-radius: 50%;margin-top: 5px;}
|
||||
.layadmin-maillist-fluid .layadmin-font-blod{font-weight: 600;}
|
||||
.layadmin-maillist-fluid .layadmin-maillist-img{margin-top: 5px;}
|
||||
.layadmin-maillist-fluid .layadmin-title{margin:5px 0 10px 0;}
|
||||
.layadmin-maillist-fluid .layadmin-textimg{line-height: 25px;margin-bottom: 10px;}
|
||||
.layadmin-maillist-fluid .layadmin-address{line-height: 1.5;margin-bottom: 20px;}
|
||||
.layadmin-maillist-fluid .layadmin-padding-left20{padding-left: 20px;}
|
||||
|
||||
/* 个人主页 */
|
||||
.layadmin-homepage-shadow{box-shadow: 0 1px 1px rgba(0,0,0,.05);background-color: #fff;border-bottom: 1px solid rgba(0,0,0,0.17);border-radius: 0;border: 1px solid #e7ecf3;}
|
||||
.layadmin-homepage-panel{margin-bottom: 15px;}
|
||||
.layadmin-homepage-panel .text-center{text-align: center;}
|
||||
.layadmin-homepage-information{padding: 15px; border-bottom: 1px solid #e9e9e9;}
|
||||
.layadmin-homepage-pad-ver{ padding-top: 15px;padding-bottom: 15px;}
|
||||
.layadmin-homepage-pad-img{box-shadow: 0 0 0 4px rgba(0,0,0,0.1);border-radius: 50%;}
|
||||
.layadmin-homepage-font{font-weight: 600;color: #2b425b;font-size: 1.2em;}
|
||||
.layadmin-homepage-min-font{margin:5px 0 10px 0;font-size: 0.9em;color: #afb9c3;}
|
||||
.layadmin-homepage-pad-ver a{line-height: 1.1em;font-size: 1.3em;vertical-align: middle; cursor: pointer;background-color: transparent;color: inherit;padding: 6px 12px;}
|
||||
.layadmin-homepage-pad-ver a:hover{background: #16b777; color:#fff;}
|
||||
|
||||
.layadmin-homepage-about{padding: 15px;font-weight: 600;color: #2b425b;}
|
||||
.layadmin-homepage-list-group{font-size: 0.9em;line-height: 1.25;margin-bottom: 5px;}
|
||||
.layadmin-homepage-list-group li{ padding: 5px 15px;border: 1px solid #ddd;margin-bottom: -1px;border-width: 1px 0;border-radius: 0; background-color: transparent;border-color: transparent;color: inherit;}
|
||||
.layadmin-homepage-list-group li i{font-size: 1.333em;line-height: 1.095em;vertical-align: middle; margin-right: 4px;}
|
||||
.layadmin-homepage-list-group li a.color{color:#337ab7;}
|
||||
.layadmin-homepage-pad-hor{ padding-left: 15px; padding-right: 15px;border-bottom: 15px;color: #758697; text-indent:20px;}
|
||||
.layadmin-homepage-list-inline{margin-left: 15px;margin-right: 15px;padding-bottom: 20px}
|
||||
.layadmin-homepage-list-inline a{display: inline-block;}
|
||||
.layadmin-homepage-list-inline .layui-btn{font-size: .9em;line-height: 1.42857;vertical-align: middle;height: auto;padding:4px 7px;margin-left: 0px;margin:0 10px 10px 0;}
|
||||
|
||||
/* 左侧个人信息区域 */
|
||||
.layadmin-homepage-text-center{text-align: center;margin-bottom: 15px;}
|
||||
.layadmin-homepage-padding15{padding:15px;margin-bottom: 15px;}
|
||||
.layadmin-homepage-padding8{padding: 0 8px;}
|
||||
.layadmin-homepage-paddingmb{margin-bottom: 15px;margin: 0 -7.5px;}
|
||||
.layadmin-homepage-content{margin-left: 15px;padding: 0;}
|
||||
.layadmin-homepage-content .new-section-xs{margin: 12px 0;color: inherit;border: 0!important;height: 0px;box-sizing: content-box;}
|
||||
.layadmin-homepage-content .h4{font-size: 16px;font-weight: 600;color: #2b425b;}
|
||||
.layadmin-homepage-content small{color: #afb9c3}
|
||||
.layadmin-homepage-text-center .layui-icon{color:#FFB800;padding-right:5px;}
|
||||
.layadmin-homepage-padding15 .layui-col-sm5 a{font-size: 11px;height: auto;line-height: 1.5;padding:5px 10px;float: right;}
|
||||
.layadmin-homepage-padding15 .layui-btn-normal{margin:0 15px;}
|
||||
.layadmin-homepage-list-imgtxt .layui-col-sm10,.layadmin-homepage-list-imgtxt .layui-col-sm2{background: none}
|
||||
.layadmin-homepage-list-imgtxt .panel-body{padding: 15px 20px 25px;overflow: hidden;margin-bottom: 15px;}
|
||||
.layadmin-homepage-list-imgtxt .panel-body .media-left{display: block;float: left;vertical-align: top;padding-right: 10px;}
|
||||
.layadmin-homepage-list-imgtxt .panel-body .media-left img{border-radius: 50%;}
|
||||
.layadmin-homepage-list-imgtxt .media-body{width: auto;display: block;overflow: hidden;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .pad-btm{padding-bottom: 15px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .pad-btm p:first-child{padding-bottom: 5px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .min-font{margin-bottom: 10px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .min-font .layui-breadcrumb a{font-size: 11px;}
|
||||
.layui-breadcrumb span[lay-separator]{margin:0 5px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .pad-btm .fontColor a{font-weight: 600;color: #337ab7;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .pad-btm .fontColor span{color: #758697;font-weight: 600;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .h-img{display: block;max-width: 100%;height: auto;margin-top: 10px;}
|
||||
.layadmin-homepage-list-imgtxt .img-xs{width: 32px;height: 32px;border-radius: 50%;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media{margin-top: 15px;overflow: hidden;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media .media-right{float: right;padding-top: 10px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media .media-right .list-inline{margin-bottom: 10px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media .list-inline li{padding:0 5px;display: inline-block;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media .media-right .list-inline li span{font-weight: 600;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media .media-left{display: block;overflow: hidden;width: auto;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media .media-left .font-blod{font-weight: 700;color: #758697;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list{padding-top: 15px;margin-top: 15px;border-top: 1px solid #e9e9e9;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .media-item{padding-bottom: 15px;margin-top: 15px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .media-item-left{display:inline-block;padding-right: 10px;margin-bottom: 5px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .media-item-left img{display: block;float: left;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .media-text{overflow: hidden;width: auto;display: inline-block;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .media-text a{margin-right: 10px;font-weight: 600;display: inline-block;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .media-text div:nth-child(2){margin-top: 5px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .layui-btn{height: 24px;line-height: 24px;font-size: 12px;padding:0 20px;margin-bottom: 10px;}
|
||||
.layadmin-homepage-list-imgtxt .media-body .media-list .layui-btn{height: 24px;line-height: 24px;font-size: 12px;padding:0 20px;margin-bottom: 10px;}
|
||||
|
||||
/* 个人内容区域 */
|
||||
|
||||
.homepage-top .layui-card-body img{width: 100%}
|
||||
.homepage-top .layui-card-body .margin-top10{margin-top: 10px;}
|
||||
.homepage-top .layui-card-body .layui-btn{width: 100%;display: block;}
|
||||
.homepage-top{padding-bottom: 20px;}
|
||||
.layadmin-privateletterlist-item{position: relative;display: block;padding: 10px 15px;}
|
||||
.homepage-bottom .layui-card-body{padding:0;}
|
||||
.homepage-bottom .layui-card-body img{width: 32px;height: 32px;border-radius: 50%;margin-top: 10px;}
|
||||
.homepage-bottom .layui-card-body .meida-left{display: table-cell;padding-right: 10px;}
|
||||
.homepage-bottom .layui-card-body .meida-right{display: table-cell;vertical-align: top;}
|
||||
.homepage-bottom .layui-card-body a:hover{background: #F2F2F2;}
|
||||
.homepage-bottom .layui-card-body{background: #fff;}
|
||||
.layui-card-header .panel-title .layui-icon{position: relative;left: 0;right: 0px;}
|
||||
|
||||
/* 右侧信息栏 */
|
||||
.layadmin-cmdlist-fluid{padding-bottom: 60px;}
|
||||
.cmdlist-container{background: #fff;border:1px solid transparent;}
|
||||
.cmdlist-container:hover{border:1px solid #e8e8e8;}
|
||||
.cmdlist-container img{width: 100%;}
|
||||
.cmdlist-text{padding:20px;}
|
||||
.cmdlist-text .info{height: 40px;font-size: 14px;line-height: 20px;width: 100%;overflow: hidden;color: #5F5F5F;margin-bottom:10px;}
|
||||
.cmdlist-text .price{font-size: 14px;}
|
||||
.cmdlist-text .price b{margin-right: 20px;}
|
||||
.cmdlist-text .price p{display: inline-block;}
|
||||
.cmdlist-text .flow{text-align: right;float: right;}
|
||||
#demo0{text-align: center;}
|
||||
|
||||
/* 商品列表 */
|
||||
.layadmin-message-fluid .layui-col-md12{background: #fff;height: auto;padding-bottom: 50px;}
|
||||
.layadmin-message-fluid .layui-input-block{margin-left: 0;}
|
||||
.layadmin-message-fluid .layui-form{padding:45px 40px 0 40px;}
|
||||
.layadmin-message-fluid .layui-form-label{text-align: left;font-size: 18px;padding-left: 10px;}
|
||||
.layadmin-message-fluid .layui-textarea{min-height: 100px;font-size: 16px;}
|
||||
.layadmin-message-fluid .layui-input-right{float: right;}
|
||||
.layadmin-messag-icon{overflow: hidden;float: left;}
|
||||
.layadmin-messag-icon .layui-icon{font-size: 24px;line-height: 30px;margin-right: 15px;color: #C4CBCF;}
|
||||
.layadmin-messag-icon{margin-top: 4px;}
|
||||
.message-content{padding:0 40px;}
|
||||
.message-content .media-body{margin-bottom: 60px;}
|
||||
.message-content .media-body .pad-btm{padding-bottom: 0;}
|
||||
.message-content .media-left{float: left;margin-right: 10px;}
|
||||
.message-content .media-left img{border-radius: 50%;}
|
||||
.message-text{padding-top: 10px;}
|
||||
.message-content-btn{text-align: center;}
|
||||
.message-content .layui-btn{height: auto;line-height: 26px; padding: 5px 30px; font-size: 16px;}
|
||||
|
||||
/* 搜索结果页面 */
|
||||
.layadmin-serach-main .layui-card-header{height: auto; line-height: 24px; padding: 15px;}
|
||||
.layadmin-serach-list{margin-bottom: 10px; padding: 10px 0; border-bottom: 1px solid #f6f6f6;}
|
||||
.layadmin-serach-list h3{padding: 10px 0;}
|
||||
.layadmin-serach-list h3 .layui-badge{top: -2px;}
|
||||
.layadmin-serach-list p{color: #5F5F5F;}
|
||||
.layadmin-serach-list li{margin-bottom: 20px; padding-bottom: 20px; clear: both;}
|
||||
.layui-serachlist-cover{float: left; margin-right: 15px;}
|
||||
.layui-serachlist-cover img{width: 90px; height: 90px;}
|
||||
|
||||
|
||||
|
||||
/* 用户列表开始 */
|
||||
.layadmin-caller{background: #fff;padding: 30px;}
|
||||
.layadmin-caller em{font-style: normal;}
|
||||
.layadmin-caller .caller-fl{float: left;}
|
||||
.layadmin-caller .caller-fr{float: right;}
|
||||
.layadmin-caller .caller-seach{position: relative;padding-bottom:40px;}
|
||||
.layadmin-caller .caller-seach .caller-icon{font-size: 18px;position: absolute;top: 9px;}
|
||||
.layadmin-caller .caller-seach-icon{left: 6px;}
|
||||
.layadmin-caller .caller-dump-icon{right: 6px;cursor: pointer;}
|
||||
.layadmin-caller .caller-pl32{padding:0 32px;}
|
||||
.layadmin-caller .caller-tab{margin:0;}
|
||||
.layadmin-caller .caller-contar{padding-bottom:20px;}
|
||||
.layadmin-caller .caller-contar .caller-item{padding:25px 0;overflow: hidden;border-bottom: 1px solid #e0e0e0;}
|
||||
.layadmin-caller .caller-contar .caller-item .caller-main{margin-left: 20px;}
|
||||
.layadmin-caller .caller-contar .caller-item .caller-main p{line-height: 100%;padding:8px 0;}
|
||||
.layadmin-caller .caller-contar .caller-item .caller-main p:first-child{padding-top:0;}
|
||||
.layadmin-caller .caller-contar .caller-item .caller-main em{margin-left: 5px;}
|
||||
.layadmin-caller .caller-contar .caller-item .caller-main .caller-adds i{padding-right: 5px;margin:0;}
|
||||
.layadmin-caller .caller-contar .caller-item .caller-main .caller-adds{padding-bottom:12px;}
|
||||
.layadmin-caller .caller-contar .caller-iconset i{margin:0 5px;}
|
||||
.layadmin-caller .caller-contar .caller-iconset i:first-child{margin-left: 0;}
|
||||
.layadmin-caller .caller-contar button{margin-top: 22px;}
|
||||
.layadmin-caller .caller-contar .caller-img{width: 40px;height: 40px;border-radius: 100%;}
|
||||
/****** 模板结束 ******/
|
||||
Reference in New Issue
Block a user