Template:Tsinghua-A/CSSTest

/*网页基础设置*/ div {

   display: block;
   word-wrap: break-word; 

word-break: normal; }

html, body { scroll-behavior:smooth; }

a { text-decoration: none; transition: all .2s ease; }

a:hover {

   color: red;

}

a:active {

   font-size:0.9em;
   transition:all 2s;

}

span {

   display: inline-block;

}

h5, .h5 {

   font-size: 1em;
   line-height: 1.85714286em;

}

h5, .h5 {

   font-weight: 600;

}

li {

   display: list-item;
   text-align: -webkit-match-parent;

}

h4, .h4 {

   font-size: 21px;
   line-height: 1.36842105em;
   color: #353535;
   font-weight: 700;
   margin-bottom: 0.8em !important;

}

ul, ol {

   list-style: none;
   line-height: 3.857143em;

}

.demo img{

   -webkit-filter: drop-shadow(10px 10px 10px rgba(0,0,0,.5)); /*考虑浏览器兼容性：兼容 Chrome, Safari, Opera */
   filter: drop-shadow(10px 10px 10px rgba(0,0,0,.5));
   background-size:contain|cover;
   width:100%;
   height: auto;
   border-radius:20px; 

}

/* 动画效果 */ .font_big:hover {

   transform: scale(1.05);
   cursor: pointer;
   transition: all 0.6s;

}

/* 开头图片 */ .top_pic {

   flex: 0 0 83.3333333333%;
   max-width: 83.3333333333%;

}

/* 下方主体容器 */ .my_container {

   max-width: 80%;
   width: 100%;
   padding-right: 15px;
   padding-left: 15px;
   margin-right: 10%;
   margin-left: 10%;

}

/* .my_container {

   max-width: 960px;

}

• /

.row {

   display: flex;
   flex-wrap: wrap;
   margin-right: -15px;
   margin-left: -15px;

}

/* 左侧导航栏容器 */ .left_part { flex: 0 0 20%; max-width: 20%; }

.tabs-container.tabs--vertical {

   overflow:hidden;

}

.page-navigator {

   position: fixed;
   padding: 0;
   top: 40%;
   
   right: 1.85714286em;
   z-index: 10;

}

.page-navigator ul {

   display: inline-block;
   padding: 0.92857143em;
   background: transparent;
   /* background: rgba(0, 0, 0, 0.4); */
   border-radius: 1.85714286em;
   transition: all .2s ease;
   list-style-type: square;

}

.page-navigator li a {

   width: 8px;
   /* height: 8px; */
   /* background: #fff; */
   border-radius: 50%;
   transition: all .2s ease;
   /* display: block; */
   position: relative;

}

ul.lateral {

   padding-top: initial !important;
   background-color: #f3f3f3 !important;
   padding-bottom: initial !important;
   width: 70%;
   border-radius: 0.4em !important;
   margin-left: 0;
   padding: 1em 1em 1em 2.6em !important;
   list-style-position: outside;

}

li.lateral {

   margin-bottom: 0px !important;
   padding-bottom: 1em !important;
   padding-top: initial !important;
   padding-left: 0em !important;

}

li.lateral a { transition: background 0.8s ease-in 0.3, ease-out 0.3; }

/* 右侧正文栏设置 */ .right_part { flex: 0 0 65%; max-width: 65%;

   padding-left: 3em;
   padding-right: 7em;

}