Difference between revisions of "Template:GreatBay SCIE/CSS"

(Replaced content with "nothing here stop peeking")
Line 1: Line 1:
−
nothing here stop peeking
+
html, body{
 +
    height: 100%; /*为了让其他引用width的元素在屏幕合适的大小*/
 +
    margin: 0;
 +
    padding: 0;
 +
    scroll-behavior: smooth; /*让侧边栏点击时动画顺滑*/
 +
    background-color: #fde6e6; /*所有内容的背景颜色：淡粉色*/
 +
}
 +
.sidebar_inner{
 +
    float:left;
 +
    margin-left: 17px;
 +
    margin-top: 24.6px; /*调整距离*/
 +
    width: 175px;
 +
    height: 60%;
 +
    position: static;/*固定距离*/
 +
    /*top: auto;*/
 +
    z-index: 3;
 +
}
 +
.sidebar_inner.stick{
 +
    /*margin-top: 194.6px;*/
 +
    width: 175px;
 +
    top:0; position:fixed;
 +
}
 +
#top {
 +
    _position: absolute;
 +
    _bottom: auto;
 +
    _top: expression(eval(document.documentElement.scrollTop));
 +
}
 +
.sidebar_inner ul{ /*侧边栏整体*/
 +
    position:relative;
 +
    list-style: none;
 +
 
 +
    height: 100%; /*高度 多余的应该会被自动省略 毕竟是position fixed*/
 +
   
 +
    background-color:#f4e8e6; /*侧边栏背景颜色：淡粉色*/
 +
    opacity: 100%; /*透明度1*/
 +
 
 +
    margin-left:20px; /*离左边的距离*/
 +
    margin-top: 80px;
 +
    padding:0px 0px 0px 0px;
 +
 
 +
    display:block;
 +
    border-radius:20px; /*圆角效果*/
 +
    transition: 0.5s; /*过渡*/
 +
    box-shadow: 4px 4px 5px 4px #d0bec7; /*深粉色阴影*/
 +
}
 +
 
 +
.sidebar_inner ul:hover{
 +
    box-shadow: 7px 8px 0px 7px #d0bec7; /*深粉色阴影*/
 +
}
 +
.sidebar_inner ul li{ /*侧边栏上的按钮*/
 +
    /*border-top:1px solid #d0bec7;*/
 +
    border-bottom:1px solid #d0bec7; /*下border*/
 +
    border-radius:15px; /*圆角效果*/
 +
}
 +
.sidebar_inner ul li:hover{
 +
    background-color: #e9b6c2;
 +
    transition: all 0.15s ease;
 +
}
 +
.sidebar_inner ul li a{ /*侧边栏上的按钮文字*/
 +
    font-size: 90%; /*字体大小*/
 +
    font-weight: 700;
 +
    color:#9e8a98; /*文字颜色：黑*/
 +
    text-decoration:none;
 +
    display:block;
 +
 
 +
    margin-left: 44px;
 +
    margin-right: 35px; /*调位置*/
 +
    padding:3px 5px 3px 5px;
 +
 
 +
    font-family:"Klee"; /*字体*/
 +
   
 +
    transition: all 0.25s ease-out; /*过渡*/
 +
}
 +
.sidebar_inner ul li a:hover{/*侧边栏上的按钮悬浮*/
 +
    color:#9e8a98; /*悬浮时文字颜色*/
 +
    transition: all 0.15s ease; /*过渡*/
 +
    /*background-color:rgb(250, 233, 229); *//*悬浮时按钮的背景颜色：淡粉色 暂时取消*/
 +
    border-radius:10px; /*圆角效果*/
 +
}
 +
.sidebar_inner ul li a.active{ /*js类，请不要乱动
 +
    你乱动一下我打断你一根腿（威胁*/
 +
    color:#9e8a98;
 +
    transition: all 0.15s ease;
 +
    background-color:rgb(250, 233, 229);
 +
    border-radius:10px;
 +
}
 +
/*.sidebar ul li ul a{
 +
    font-size: 90%;
 +
    font-weight: 475;
 +
    text-align: left;
 +
    float:left;
 +
    margin-left: 0px;
 +
    display:block;
 +
}
 +
.sidebar ul li ul li a{
 +
    display:block;
 +
} 好像没用*/
 +
.text{
 +
    margin-top:72.9px;margin-left:24%;font-size:200px;
 +
}
 +
.sidebar_outer{
 +
    float:left;
 +
    /*margin-top: 72.6px;*/
 +
    /*margin-top: -16px;*/
 +
    margin-top: -16px;
 +
    width: 24%;
 +
    position: relative;
 +
    top: 0;
 +
    height: 100%;
 +
    background-color:#d6e2ee;
 +
    z-index: 1;
 +
}
 +
.sidebar_outer.stick{
 +
    margin-top: 72.6px; top:0; position:fixed;
 +
}
 +
p{
 +
    margin-left: 30%;
 +
}
 +
h2{
 +
    margin-left:30%;
 +
 
 +
}
 +
h1{
 +
    margin-left: 30%;
 +
}
 +
.content{
 +
    margin-top: 10%;
 +
}

Revision as of 10:09, 17 July 2021

html, body{ 

   height: 100%; /*为了让其他引用width的元素在屏幕合适的大小*/
   margin: 0;
   padding: 0;
   scroll-behavior: smooth; /*让侧边栏点击时动画顺滑*/
   background-color: #fde6e6; /*所有内容的背景颜色：淡粉色*/

} .sidebar_inner{ 

   float:left;
   margin-left: 17px;
   margin-top: 24.6px; /*调整距离*/
   width: 175px;
   height: 60%;
   position: static;/*固定距离*/
   /*top: auto;*/
   z-index: 3;

} .sidebar_inner.stick{ 

   /*margin-top: 194.6px;*/
   width: 175px; 
   top:0; position:fixed;

}

  1. top {
   _position: absolute;
   _bottom: auto;
   _top: expression(eval(document.documentElement.scrollTop));

} .sidebar_inner ul{ /*侧边栏整体*/ 

   position:relative;
   list-style: none;

   height: 100%; /*高度 多余的应该会被自动省略 毕竟是position fixed*/
   
   background-color:#f4e8e6; /*侧边栏背景颜色：淡粉色*/
   opacity: 100%; /*透明度1*/

   margin-left:20px; /*离左边的距离*/
   margin-top: 80px;
   padding:0px 0px 0px 0px;

   display:block;
   border-radius:20px; /*圆角效果*/
   transition: 0.5s; /*过渡*/
   box-shadow: 4px 4px 5px 4px #d0bec7; /*深粉色阴影*/

}

.sidebar_inner ul:hover{ 

   box-shadow: 7px 8px 0px 7px #d0bec7; /*深粉色阴影*/

} .sidebar_inner ul li{ /*侧边栏上的按钮*/ 

   /*border-top:1px solid #d0bec7;*/
   border-bottom:1px solid #d0bec7; /*下border*/
   border-radius:15px; /*圆角效果*/

} .sidebar_inner ul li:hover{ 

   background-color: #e9b6c2;
   transition: all 0.15s ease;

} .sidebar_inner ul li a{ /*侧边栏上的按钮文字*/ 

   font-size: 90%; /*字体大小*/
   font-weight: 700; 
   color:#9e8a98; /*文字颜色：黑*/
   text-decoration:none;
   display:block;

   margin-left: 44px;
   margin-right: 35px; /*调位置*/
   padding:3px 5px 3px 5px;

   font-family:"Klee"; /*字体*/
   
   transition: all 0.25s ease-out; /*过渡*/

} .sidebar_inner ul li a:hover{/*侧边栏上的按钮悬浮*/ 

   color:#9e8a98; /*悬浮时文字颜色*/
   transition: all 0.15s ease; /*过渡*/
   /*background-color:rgb(250, 233, 229); *//*悬浮时按钮的背景颜色：淡粉色 暂时取消*/
   border-radius:10px; /*圆角效果*/

} .sidebar_inner ul li a.active{ /*js类，请不要乱动 

   你乱动一下我打断你一根腿（威胁*/
   color:#9e8a98;
   transition: all 0.15s ease;
   background-color:rgb(250, 233, 229);
   border-radius:10px;

} /*.sidebar ul li ul a{ 

   font-size: 90%;
   font-weight: 475;
   text-align: left;
   float:left;
   margin-left: 0px;
   display:block;

} .sidebar ul li ul li a{ 

   display:block;

} 好像没用*/ .text{ 

   margin-top:72.9px;margin-left:24%;font-size:200px;

} .sidebar_outer{ 

   float:left;
   /*margin-top: 72.6px;*/
   /*margin-top: -16px;*/
   margin-top: -16px;
   width: 24%;
   position: relative;
   top: 0;
   height: 100%;
   background-color:#d6e2ee;
   z-index: 1;

} .sidebar_outer.stick{ 

   margin-top: 72.6px; top:0; position:fixed;

} p{ 

   margin-left: 30%;

} h2{ 

   margin-left:30%;

} h1{ 

   margin-left: 30%;

} .content{ 

   margin-top: 10%;

}