/*
* mobile.css - 厦门大学高级计量经济学课程网站移动端适配补丁
* 适配范围: 320px - 768px (手机/平板竖屏)
* 覆盖页面: 首页(index.htm)、列表页(kccl.htm等)、内容页(info/1066/1211.htm等)
* 使用方式: 在 HTML 中添加:
*
*
*
* 更新记录:
* 2026-05-03 - 初始版本，适配首页
* 2026-05-03 - 新增列表页(kccl.htm)和内容页(info/xxx.htm)适配
*/
/* ========== 基础重置 ========== */
@media screen and (max-width: 768px) {
* {
box-sizing: border-box;
}
body {
font-size: 14px;
min-width: auto;
overflow-x: hidden;
}
/* ========== viewport 修复 ========== */
/* 必须先添加 */
/* ========== 顶部导航 ========== */
.topWrap {
border-top: 3px solid #0d6db9;
}
.topDiv {
width: 100% !important;
padding: 0 10px;
}
.topR {
width: 100% !important;
padding: 10px 0;
text-align: center;
float: none;
}
.topR_t {
float: none !important;
text-align: center;
}
/* ========== 导航栏 ========== */
.navWrap {
height: auto;
}
.nav {
width: 100% !important;
height: auto;
}
.nav ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.nav li {
float: none;
height: 40px;
line-height: 40px;
}
.nav li a {
padding: 0 15px;
font-size: 14px;
}
/* ========== Banner ========== */
.vsb-box {
width: 100%;
}
.vsb-container {
width: 100% !important;
}
.bannerWrap {
width: 100%;
}
.bannerWrap img,
.vsb-box img {
width: 100% !important;
height: auto !important;
}
/* ========== 主容器 ========== */
.container {
width: 100% !important;
padding: 0 10px;
}
.content {
width: 100% !important;
}
/* ========== 新闻信息区 - 改为单列 ========== */
.new_inforBox {
width: 100% !important;
padding: 0;
float: none;
}
.new_inforBox2 {
width: 100% !important;
}
.newBox {
width: 100%;
}
/* 课程材料/补充阅读等模块 */
.new_pic,
.new_pic1,
.new_pic2 {
width: 100% !important;
float: none;
padding: 0;
}
.new_pic img,
.new_pic1 img,
.new_pic2 img {
width: 100% !important;
height: auto;
}
/* 幻灯片适配 */
.slideBox1 {
width: 100% !important;
}
.slideBox1 .bd img {
width: 100% !important;
height: auto;
}
/* ========== 课程团队 ========== */
.new_list.teacher {
width: 100% !important;
float: none;
padding: 0;
}
.new_list.teacher ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding-inline-start: 0px;
width: 100%;
}
.new_list.teacher li {
width: 50%;
margin-bottom: 15px;
}
.new_list.teacher .img img {
width: 95% !important;
height: auto;
}
/* ========== 课程教材 ========== */
.new_list.book {
width: 100% !important;
float: none;
padding: 0;
}
.new_list.book li {
width: 50%;
}
.new_list.book .img {
width: 100%;
text-align: center;
}
.book div ul {
width: 100%;
}
.new_list.book .img img {
max-width: 200px;
width: 95% !important;
height: auto;
}
/* ========== 信息列表 ========== */
.infor_list {
width: 100%;
}
.dynamic_list {
width: 100%;
}
.dynamic_list li {
width: 100%;
height: auto;
line-height: 1.6;
padding: 8px 0;
background-position: 0 12px;
}
.dynamic_list li a {
white-space: normal;
overflow: visible;
text-overflow: clip;
display: block;
}
.dynamic_list li a em {
width: 100% !important;
float: none;
white-space: normal;
}
/* ========== 右侧信息栏 ========== */
.informBox,
.informBox4 {
width: 100% !important;
float: none;
padding: 0;
margin-top: 20px;
}
/* ========== 课程视频树形菜单 ========== */
.lecture {
width: 100%;
}
.lecture img {
width: 100% !important;
height: auto;
}
#browser {
width: 100%;
}
#browser li {
width: 100%;
}
#browser .folder,
#browser .file a {
font-size: 13px;
}
/* ========== 底部 ========== */
.footWrap {
margin-top: 20px;
}
.footDiv_one {
height: auto;
padding: 15px 0;
line-height: 1.8;
}
.foot_one {
width: 100% !important;
padding: 0 10px;
}
.foot_one p {
width: 100% !important;
}
.foot_two {
width: 100% !important;
padding: 0 10px;
}
.foot_three {
width: 100% !important;
padding: 0 10px;
}
/* ========== 标题样式调整 ========== */
.dynamic h2 {
font-size: 16px;
padding-bottom: 5px;
}
/* ========== 链接列表优化 ========== */
.infor_list ul li {
border-bottom: 1px dashed #eee;
padding: 10px 0;
}
.infor_list ul li:last-child {
border-bottom: none;
}
/* ========== 图片自适应 ========== */
img {
max-width: 100%;
height: auto;
}
/* ========== 清除浮动 ========== */
.clearfix::after {
content: "";
display: table;
clear: both;
}
/* ========== 隐藏一些桌面端元素 ========== */
.Search {
display: none;
}
/* ========== 列表页适配 (kccl.htm 等) ========== */
/* 主容器 */
.mainWrap {
width: 100% !important;
padding: 0 10px;
}
/* 左侧导航栏 */
.main_conL {
width: 100% !important;
float: none;
margin-bottom: 20px;
}
.main_conLT {
width: 100% !important;
}
.main_conLT dl dt {
width: 100% !important;
height: auto;
padding: 15px 0;
font-size: 18px;
}
.main_conLT dl dd {
width: 100% !important;
margin-top: 5px;
}
.main_conLT dl dd a {
width: 100% !important;
height: auto;
padding: 12px 0;
line-height: 1.5;
}
/* 右侧内容区 */
.main_conR {
width: 100% !important;
float: none;
margin-left: 0;
border-left: none;
padding-left: 0;
}
.main_conR h2 {
width: 100% !important;
line-height: 1.4;
padding: 15px 0;
font-size: 18px;
}
.main_conRC {
padding: 0;
}
/* 列表样式 - 列表页2 */
.main_conRCb {
width: 100%;
}
.main_conRCb ul {
width: 100%;
}
.main_conRCb ul li {
width: 100% !important;
height: auto;
line-height: 1.6;
padding: 12px 0;
background-position: 0 16px;
text-indent: 15px;
white-space: normal;
overflow: visible;
}
.main_conRCb ul li em {
width: 100% !important;
float: none;
display: block;
white-space: normal;
overflow: visible;
text-overflow: clip;
}
.main_conRCb ul li span {
float: none;
display: block;
margin-top: 5px;
color: #999;
font-size: 12px;
}
/* 列表页1 - 图文列表 */
.main_conRCa ul li {
width: 100% !important;
padding: 15px 10px;
height: auto;
overflow: hidden;
}
.main_conRCa ul li .main_rpicL {
float: none;
margin: 0 auto 10px;
text-align: center;
}
.main_conRCa ul li .main_rpicL img {
width: 100% !important;
max-width: 300px;
height: auto;
}
.main_conRCa ul li .main_rpicR {
width: 100% !important;
float: none;
padding: 0;
}
.main_conRCa ul li .main_rpicR h3 {
font-size: 15px;
line-height: 1.4;
}
.main_conRCa ul li .main_rpicR p {
font-size: 13px;
line-height: 1.6;
}
/* 分页组件 */
.p_pages {
width: 100%;
text-align: center;
margin: 20px 0;
}
.p_pages span,
.p_pages a {
display: inline-block;
padding: 8px 12px;
margin: 2px;
font-size: 13px;
}
.p_first_d, .p_prev_d, .p_next_d, .p_last_d {
display: inline-block;
}
.pb_sys_common {
width: 100%;
text-align: center;
}
/* ========== 内容页适配 (info/1066/1211.htm 等) ========== */
/* 主内容容器 */
.main_content {
width: 100% !important;
padding: 0 10px;
border: none;
}
/* 标题区 */
.main_contit {
width: 100% !important;
padding: 0;
}
.main_contit h2 {
width: 100% !important;
font-size: 18px;
line-height: 1.4;
padding: 20px 0;
margin-top: 0;
}
.main_contit p {
width: 100% !important;
font-size: 12px;
margin: 10px 0;
}
/* 内容区 */
.main_conDiv {
width: 100% !important;
margin: 20px 0;
padding: 0;
}
.main_conDiv p {
font-size: 14px;
line-height: 1.8;
text-indent: 2em;
margin-top: 15px;
}
.main_conDiv img {
max-width: 100% !important;
width: auto !important;
height: auto !important;
display: block;
margin: 10px auto;
}
/* 表格适配 */
.main_conDiv table {
width: 100% !important;
display: block;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.main_conDiv td {
padding: 8px;
font-size: 13px;
}
/* 文章底部 */
.main_art {
width: 100% !important;
margin: 30px 0 0;
padding: 15px;
}
.main_art ul li {
font-size: 13px;
line-height: 1.8;
margin-left: 0;
}
/* 面包屑导航 */
.main_tit {
height: auto;
line-height: 1.6;
padding: 10px 0;
border-bottom: 2px solid #0b6cb8;
}
.main_titT {
width: 100% !important;
float: none;
border-bottom: none;
}
.main_titT a {
font-size: 13px;
}
/* v_news_content 内容区 */
.v_news_content {
width: 100%;
font-size: 14px;
line-height: 1.8;
}
.v_news_content p {
margin: 15px 0;
text-indent: 2em;
}
.v_news_content img {
max-width: 100%;
height: auto;
}
/* bjh-p 段落 */
.bjh-p {
font-size: 14px !important;
line-height: 1.8 !important;
margin: 15px 0 !important;
}
/* index-module_textWrap 文本包装 */
.index-module_textWrap_3ygOc {
width: 100% !important;
padding: 0;
}
}
/* ========== 小屏手机额外优化 (<= 480px) ========== */
@media screen and (max-width: 480px) {
body {
font-size: 13px;
}
.nav li {
width: 100%;
text-align: center;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.nav li:last-child {
border-bottom: none;
}
.nav li a {
display: block;
padding: 10px;
}
.new_list.teacher li {
width: 50%;
}
.dynamic h2 {
font-size: 15px;
}
.dynamic_list li {
font-size: 13px;
}
/* 视频列表简化 */
#browser ul {
padding-left: 15px;
}
#browser .file a {
font-size: 12px;
}
/* 列表页小屏优化 */
.main_conRCb ul li {
padding: 10px 0;
font-size: 13px;
}
.main_conRCb ul li span {
display: block;
margin-top: 5px;
}
.main_conRCa ul li .main_rpicR h3 {
font-size: 14px;
}
.main_conRCa ul li .main_rpicR p {
font-size: 12px;
}
/* 内容页小屏优化 */
.main_contit h2 {
font-size: 16px;
padding: 15px 0;
}
.main_conDiv p {
font-size: 13px;
}
.main_conDiv table {
font-size: 12px;
}
.main_conDiv td {
padding: 5px;
}
/* 分页小屏 */
.p_pages span,
.p_pages a {
padding: 6px 10px;
font-size: 12px;
}
}
/* ========== 平板横屏优化 (768px - 1024px) ========== */
@media screen and (min-width: 769px) and (max-width: 1024px) {
.topDiv,
.nav,
.container {
width: 100% !important;
padding: 0 15px;
}
.new_inforBox {
width: 65% !important;
}
.informBox {
width: 30% !important;
}
/* 列表页平板 */
.mainWrap {
width: 100% !important;
padding: 0 15px;
}
.main_conL {
width: 200px !important;
}
.main_conR {
width: calc(100% - 220px) !important;
margin-left: 20px;
}
.main_conR h2 {
width: 100% !important;
}
/* 内容页平板 */
.main_content {
width: 100% !important;
padding: 0 15px;
}
.main_contit,
.main_conDiv {
width: 100% !important;
}
}