﻿/*!
 * 插入自定义样式

 */


 /*            */

 /*      菜单颜色为黑      */

.bg-dark {
  background-color: #565864;

}

.bg-dark {
  background-color: #565864;

}





.bg-qianhui1 {
  background-color: #ebebeb;
  background-image: linear-gradient(180deg, #ebebeb 10%, #e5e5e5 100%);
  background-size: cover;
}


.bg-qianhui2 {
  background-color: #f4f4f4;
  background-image: linear-gradient(180deg, #f4f4f4 10%, f8f8f8 100%);
  background-size: cover;
}





/* 回到顶部样式 */

.scroll-to-top {   
  position: fixed;
  right: 20px;     /* 默认1rem，改右部往左20 */
  bottom: 88px;     /* 默认1rem，改底部往上88 */
  display: none;
  width: 2.75rem;
  height: 2.75rem;
  text-align: center;
  color: #fff;
  background: rgba(90, 92, 105, 0.5);
  line-height: 46px;

  
  
}

	
	
/* 页脚原样式设置 */

footer.sticky-footer {
  padding: 2rem 0;
  flex-shrink: 0;
}

footer.sticky-footer .copyright {
  line-height: 1;
  font-size: 0.8rem;
}

body.sidebar-toggled footer.sticky-footer {
  width: 100%;
}



.sticky-footer {   /* 页脚新样式设置 */
  position: fixed;   /* 固定 */
  bottom: 0;        /* 将 footer 沿着底部对齐 */
  width: 100%;   /* 宽100% */
  height: 71px; /* 设置一个合适的高度 */
  z-index: 9998;   /* 浮动在最上层 */
}



.my-bottom






/*底部菜单设计*/

    .my-ul {
  width: 100%;  /* 宽100% */
  height: 100%;   /* 高100% */
  display: flex;  /* flex 布局 */
  justify-content: center; /* flex 布局元素水平居中 */
  align-items: center;   /* flex 垂直居中对齐 */
  padding-left: 1px; /* 去除默认的左侧缩进*/
  list-style: none; /*li不要圆点*/
  gap: 10px;  /*每个元素之间留出 10px 的间距*/
 
 
    }
	
	.my-ul li {
  flex: 1;
  width: 100%;
  text-align: center;
  margin-top: 10px;
    margin: 3px;  /* 3px外间距*/
}
	
	
	
	
	
	
	
  .my-ul li img{

  width:55px ;  /* 设置 <div> 元素的宽度和高度  70px*/
  height:55px ; /* 设置内容的高度，与页脚sticky-footer相同 */

	  }
	
	

	
	
	
	
	
	
/* 未使用  */
   line-height: 50px; /* 调整内容的行高，让内容往下或往下 */
  
    display: inline-block;  /*设为块状，让内容保持在同一行
    text-align: center;
   white-space: nowrap;  /*强制不允许换行*/
  margin-right: 0.5%; /* 添加每个li的间距 */

  padding: 10px; /* 增加 <li> 元素的内边距 */


    .my-link  {
		
  border: 1px solid #000;  /* 设置边框 */
  display: block;   /* 设置块状 */
  width: 35px;
  height: 35px; /* 设置 <div> 元素的宽度和高度 */


    }
  


  
    .my-li a {
    color: #191919; /* 将链接的字体颜色设置为黑色 */
	text-decoration: none;  /* 不显示下划线 */
	
  }
  
  
  .my-li.current a {
  color: green; /* 将链接的字体颜色设置为绿色 */
}
  

  

  .my-li{
  list-style: none; /*li不要圆点*/
  height: 55px; /* 设置内容的高度，与页脚sticky-footer相同 */

  display: inline-block;  /*设为块状，让内容保持在同一行*/
  white-space: nowrap;  /*强制不允许换行*/
  line-height: 35px; /* 调整内容的行高，让内容往下或往下 */
  padding: 10px; /* 增加 <li> 元素的内边距 */
  margin-right: 0.5%; /* 添加每个li的间距 */
 /* background: linear-gradient(to bottom, #565864, #565864);  设置每个 <li> 元素的渐变背景色，当前为单色 */
   background-image: url("img/qb.png");

  }







  
  
  



  
    .my-li img {
  /* 在这里添加你想要设置的正常状态图标的样式 */
  content: url("http://explore.yc1971.com/test_zone/admin2/img/qb.png");
}
  
 
  
  
  /*底部菜单设计2*/
.my-li.current {
 /*  background: linear-gradient(to bottom, #41424b, #41424b); 设置每个 <li> 元素的渐变背景色，当前为单色  */ 
  background-image: url("http://explore.yc1971.com/test_zone/admin2/img/hb.png");

  background-repeat: no-repeat;

  background-position: 20px center; /* 将背景图片向右偏移 10px */
  background-size: 25px 25px; /* 调整背景图片的大小 */
  padding-left: 60px; /* 为文字内容留出 60px 的空间 */
  width: 200px; /* 调整 <li> 元素的宽度 */
  height: 60px; /* 调整 <li> 元素的高度 */
  
  font-size: 24px; /* 将文字大小设置为 24px */
} 
  


/* 调整页面内容样式，用于登录页 不好用，弃了*/




  .my_container {
  max-width: 100%;
    width: 100%;
    margin: 0 auto; /* 使元素水平居中 */  
	  
	  
	  

  }






.my_outline {
  width: 80%;
}

@media (min-width: 769px) {
  .my_outline {
    width: 35%;
  }
}




/* 默认样式 */
.my_outline {
  width: 50%;
  margin: auto; /* 上下左右居中，如果异常，就用margin: 0 auto; 只将盒子水平居中  */
}

/* 在屏幕宽度小于等于 768px 的设备上，将 .my_outline 的宽度设置为 100% */
@media (max-width: 768px) {
  .my_outline {
    width: 80%;
  }
}

/* 在屏幕宽度大于 768px 且小于等于 1024px 的设备上，将 .my_outline 的字体大小设置为 20px */
@media (min-width: 769px) and (max-width: 1024px) {
  .my_outline {
    width: 20%;
  }
}

/* 在屏幕宽度大于 1024px 的设备上，将 .my_outline 的字体大小设置为 24px */
@media (min-width: 1025px) {
  .my_outline {
    width: 660px;
  }
}








 



}











  
  
  