Difference between revisions of "Template:UESTC Software/divide dou css"

Revision as of 16:51, 18 September 2015 (view source) Dou (Talk | contribs) ← Older edit		Revision as of 17:15, 18 September 2015 (view source) Dou (Talk | contribs) Newer edit →
Line 27:		Line 27:
	}		}
	#c_h_s_meet{/*meetup图片*/		#c_h_s_meet{/*meetup图片*/
−	background: url(/wiki/images/f/f5/Uestc_software_forest.jpeg)center center no-repeat;	+	background: url(/wiki/images/8/87/Uestc_software_h_p_bg.jpg)center center no-repeat;
	background-size:cover;		background-size:cover;
	-webkit-background-size:cover;		-webkit-background-size:cover;
Line 40:		Line 40:
	#c_h_s_attr{/*attri*/		#c_h_s_attr{/*attri*/
	background: url(/wiki/images/thumb/5/53/Uestc_software_ff.jpg/800px-Uestc_software_ff.jpg) center center no-repeat;		background: url(/wiki/images/thumb/5/53/Uestc_software_ff.jpg/800px-Uestc_software_ff.jpg) center center no-repeat;
		+	background-size:cover;
		+	-webkit-background-size:cover;
		+	}
		+	#c_h_s_api{
		+	background: url(/wiki/images/3/3c/Uestc_software_api_bg.jpg) center center no-repeat;
	background-size:cover;		background-size:cover;
	-webkit-background-size:cover;		-webkit-background-size:cover;

---

Revision as of 17:15, 18 September 2015

/*金牌*/ .cd_half_section{/*通用*/

 position: relative;

} .cd_half_section h1{

 position: absolute;
 width: 80%;
 height: 90px;
 line-height: 90px;
 text-align: center;
 margin: auto;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 color: #f7f7f7;
 font-family: "faricy-new-web",helvetica,sans-serif;
 font-size: 70px;

} .cd_half_section p{

 font-family: "faricy-new-web", helvetica, sans-serif;
 color:#f7f7f7;
 position:absolute;
 right:10px;
 bottom:10px;
 font-size:0.8rem;

}

1. c_h_s_meet{/*meetup图片*/

 background: url(/wiki/images/8/87/Uestc_software_h_p_bg.jpg)center center no-repeat;
 background-size:cover;
 -webkit-background-size:cover;

}

1. c_h_s_medals{/*金牌图片*/

 background: url(/wiki/images/1/1f/Uestc_software_sunrise.jpg) center center no-repeat;
 background-size:cover;

-webkit-background-size:cover; }

1. c_h_s_attr{/*attri*/

 background: url(/wiki/images/thumb/5/53/Uestc_software_ff.jpg/800px-Uestc_software_ff.jpg) center center no-repeat;
 background-size:cover;
 -webkit-background-size:cover;

}

1. c_h_s_api{

 background: url(/wiki/images/3/3c/Uestc_software_api_bg.jpg) center center no-repeat;
 background-size:cover;
 -webkit-background-size:cover;

} .dou_medal_content{

 color: #666;

}

1. gold{

} h3.medal_kind{

 text-align:center;
 font-weight: 600;
 margin-top:100px;
 margin-bottom:20px !important;
 font-family: "faricy-new-web",helvetica,sans-serif;

} .medal_kind .m_medal{

 display: block;
 /*float: left;*/
 font-size: 30px;
 margin:25px 0;
 /*padding: 85px 0 0;*/

}

1. gold{

 color:#c48727;

}

1. silver{

 color:#a2aaaa;

}

1. bronze{

 color:#986936;
 

} .medal_kind img{

/* float: left;*/
 width: 100px;
 

} .dou_medal_content>ul>li{

 list-style-image: url(/wiki/images/a/a4/Uestc_software_Accept.png);
 font-size: 18px;
 line-height: 25px;
 text-align:justify;
 font-family: "faricy-new-web",helvetica,sans-serif;
 color:#222;

} .dou_medal_content ul li p{

 font-weight:bold;
 /*text-indent:2rem;*/

} .dou_medal_content ul li a{

 text-decoration:underline;
 color:#7b9977;

} .dou_medal_content>ul>li>ul>li{

 padding-left:20px;
 margin-top:20px;

} .medal_answer{

 padding-left:20px;

} /* --------------------------------

Main content

---

*/

/*总设计*/ .wrap_content{

 width: 100%;
 position: relative;

}

.half_content{

 float: left;
 width:50%;

 overflow: hidden;

} /*下滑箭头*/ .wrap_content .swiper-button-next{

 position: absolute;
 width: 80px !important;
 height: 100px !important;
 bottom: 5px ;
 margin: auto !important;
 left: 0 !important;
 right: 0 !important;
 background-image: url(../assets/down_btn.png) !important;
 background-size:contain; 
 top: 80% !important;

} @keyframes btn_change{

 0%{bottom: 5px; }
 100%{bottom: 15px;}

} @-webkit-keyframes btn_change{

 0%{bottom: 5px; }
 100%{bottom: 15px;}

} @-moz-keyframes btn_change{

 0%{bottom: 5px; }
 100%{bottom: 15px;}

} @-o-keyframes btn_change{

 0%{bottom: 5px; }
 100%{bottom: 15px;}

} .up_down{

 animation:btn_change 0.2s infinite;
 -webkit-animation:btn_change 0.2s infinite;
 -moz-animation:btn_change 0.2s infinite;
 -o-animation:btn_change 0.2s infinite;
 animation-direction:alternate;
 -webkit-animation-direction:alternate;

} /*********************

• • • • • • 左边文字屏幕********
            • • • • • • • • • • • • • • • /

.define_content{

 height: 100%;

} .dou_define_wrap{

 width: 100%;
 height: 100%;

} .dou_define_container{

 width: 100%;
 height: 100%;

} /*********************

• • • • • • 左边文字屏幕end********
            • • • • • • • • • • • • • • • /

/*********************

• • • • • • 右边图片屏幕********
            • • • • • • • • • • • • • • • /

.images_content{

 float: left;
 width: 50%;
 min-width: 480px;
 height: 100%;

 overflow: hidden;
 right:0;
 background: #7b9977;
 

}

.dou_slide_wrap_single{

 position: relative;
 background: url(/wiki/images/c/c3/Uestc_software_bamboo.png);
 background-size:cover; 
 width: 100%;
 height: 100%;

}

.dou_slide_single_pc{/*max-width:1920*/

 position: absolute;
 margin:auto;
 height:605px;
 width: 400px;
 right: 0;
 top: 0;
 left: 0;
 bottom: 0;
 text-align: center;
 background: url(/wiki/images/b/b2/UESTC_Software_Phone_frame.png) center no-repeat;
 background-size: contain;
 padding: 80px 20px;

} .dou_slide_single_pc_container{

 overflow: hidden;
 position: relative;
 width: 100%;
 height: 100%;
 z-index: 1;

} /*.dou_slide_single_pc img{

 height: 100%;

}

• /

.dou_slide_single_define{

 position: absolute;
 margin: auto;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 width: 200px;
 height: 300px;

} .dou_slide_single_define ul{

 position: relative;

} @keyframes touming_change{

 0%{visibility:hidden;
   opacity: 0;}
 100%{visibility:visible;
   opacity: 1;}

} .dou_slide_single_define ul li{

 position: absolute;
 visibility: hidden;
 opacity: 0;
 transition:all 0.3s linear;
 -webkit-transition:all 300ms linear;
 -moz-transition:all 0.3s linear;
 -o-transition:all 0.3s linear;

} .dou_slide_single_define ul li.define_show{

 animation:touming_change 1s;
 animation-delay:1s;
 visibility: visible;
 opacity: 1;

} .dou_slide_single_define p{

 text-align: center;
 font-size: 40px;
 line-height: 40px;
 color: #f7f7f7;
 font-family: "faricy-new-web",helvetica,sans-serif;
 font-weight: 600;

}

.swiper-slide{

 text-align: center;
 font-size: 18px;
 background: #fff;
 display: relative;
 /* Center slide text vertically */
 display: -webkit-box;
 display: -ms-flexbox;
 display: -webkit-flex;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 -webkit-justify-content: center;
 justify-content: center;
 -webkit-box-align: center;
 -ms-flex-align: center;
 -webkit-align-items: center;
 align-items: center;

} .swiper-slide img{

 width: 100%;
 height: 100%;

} .swiper-pagination{

 top: 100px;

} .slide_p{

 width:80%;

} .slide_p h2{

 color: #7B9977;
  font-family: "faricy-new-web",helvetica,sans-serif;
 font-size: 3rem;
 line-height:3.5rem;
 text-align:left;
 margin-bottom: 50px !important;

} .manually{

 font-size: 4.5rem;
 font-weight: 600;

} .slide_p p{

 color:#666;
 font-family: "faricy-new-web",helvetica,sans-serif;
 font-size:1.6rem;

line-height:1.8rem;

 text-align: justify;

} /*右边屏幕end*/

/************************

• • • • • • • • • 文字放置*********
                  • • • • • • • • • • • • • • • • /

.cd-section{/*单屏设置*/

 width: 100%;

} .cd-half-section{/*分页半屏高图片*/

 width: 100%;
 text-align: center;
 display: table;
  color: #f7f7f7;
  padding: 10rem 16rem;

} .cd-half-section h1{

 font-size: 2.4rem;

} .cd-half-section p{

 padding: 4rem 0;
 font-size: 1.8rem;

}

.cd-main-content {

 position: relative;
 width: 80%;
 max-width: 980px;
 margin: 0 auto;
 padding: 50px 0 0;
 transition:all 0.3s linear;
 -webkit-transition:all 300ms linear;
 -moz-transition:all 0.3s linear;
 -o-transition:all 0.3s linear;

} .cd-main-content p {

 font-family: "faricy-new-web",helvetica,sans-serif;
 font-size: 1rem;
 line-height: 1.4rem;
 color: #222;
 /*margin: 2em 0;
 text-align:justify;*/

} .back_to_top{

 display: none;
 position: fixed;
 cursor: pointer;
 bottom: 10px;
 right:15% ;
 width: 50px;
 text-align: center;
 height: 50px;
 line-height: 50px;
 color: #aaa;

} .back_to_top i{

 font-size:40px;

}

.dou_m_c_p{/*纯文章*/

 margin-top: 30px;
 width: 100%;

} .dou_m_c_pic{

 margin:30px 0;
 width: 100%;
 

}

.dou_m_c_pic_wrap{

 text-align:center;
 width:100%;

} .dou_m_c_pic_wrap img{

 width:100%;

} .dou_m_c_pic_wrap p{

 text-align: center;

} .dou_m_c_p>p{

 text-align: justify;

} .real_pic_wrap{

 position: relative;

} .real_pic_wrap img{

 box-shadow: 0 2px 10px #555;
 position: absolute;
 width: 60% !important;

}

1. real_pic1{

 z-index: 20;
 transform:rotate(0deg);
 transform-origin:50% 90%;
 top:0px;
 left: 0;

}

1. real_pic2{

 z-index: 19;
 transform:rotate(0deg);
 top:80px;
 left: 20%;

}

1. real_pic3{

 z-index: 18;
 transform:rotate(0deg);
 top: 120px;
 left:40%;

}

1. real_pic4{

 z-index: 17;
 box-shadow: 0 10px 10px #ccc;
 transform:rotate(15deg);

}

.dou_title{

 font-family: "faricy-new-web",helvetica,sans-serif;
 /*margin-top: 100px;*/
 color: #666666;
 text-align: center;

} .dou_title h2{

 font-weight: 600;
 margin-top: 2rem;
 font-size: 1.8rem;
 line-height:2rem;
 color:#7b9977;
 margin-bottom:60px !important;

} .dou_title h3{

 font-weight:bold;
 font-size:1.6rem;
 line-height:1.8rem;
 margin-bottom:40px !important;
 color:#7b9977;

} /*左侧导航*/ .dou_navbar{

 position: fixed;
 left: 0;
 width: 200px;
 border: 1px solid #7b9977;
 border-top-right-radius:5px;
 border-bottom-right-radius:5px;
 z-index:999999;
 background:#fff;
  transition:all 0.3s linear;
 -webkit-transition:all 0.3s linear;
 -moz-transition:all 0.3s linear;
 -o-transition:all 0.3s linear;

} .dou_navbar_wrap{

 display:table;
 width:100%;

} .dou_navbar ul{

 width:90%;

} .dou_navbar ul li{

 position: relative;
 font-size: 1.2rem;
 cursor: pointer;
 padding: 12px 10px; 
 color: #555;
 transition:all 0.3s linear;
 -webkit-transition:all 300ms linear;
 -moz-transition:all 0.3s linear;
 -o-transition:all 0.3s linear;

} .dou_navbar ul li a{

 font-family: "faricy-new-web",helvetica,sans-serif;

 color: #555;
 text-decoration:none;

} .dou_navbar>ul>li>a{

 font-family: "faricy-new-web",helvetica,sans-serif;
 font-weight:bold;
 color: #555;
 text-decoration:none;

} .dou_navbar ul li a:hover{

 color:#7b9977;
 
 text-decoration:none;

} .dou_navbar ul li.current a{

 color: #7b9977;
 

} .dou_navbar ul li.navbar_hover{

 color: #7b9977;

} .dou_navbar ul li.dou_one{

 /*border:1px solid #7b9977;*/
 

} .dou_navbar ul li.second_nav{

 padding: 0 20px;
 font-size: 1rem; 

} .navb_show{

 left:-160px;

} .dou_navButton{

 cursor:pointer;
 position:relative;
 border-top-right-radius:5px;
 border-bottom-right-radius:5px;
 right:0;
 background:#7b9977;
 color:#fff;
 border-top:1px solid #7b9977;
 border-right:1px solid #7b9977;
 border-bottom:1px solid #7b9977;
 height:80px;
 width:50px;
 display:table-cell;
 vertical-align:middle;
 text-align:center;

} /*响应式*/ @media screen and (max-width:1600px){

 .back_to_top{
  right:5% !important ;
 }
 /*.dou_navbar{
  width:15%;

} .navb_show{

 left:-11%;

}*/ } @media screen and (max-width:1024px){

/* .dou_navbar{
  width:20%;

} .navb_show{

 left:-11%;

}*/ } /*documentation 2015.09.12*/ .dou_table{

 width:85%;
 margin:0 auto;

} .dou_table_title{

  font-size:2.4rem !important;
  margin-bottom:50px !important;

}

.dou_table table{

  width:100%;

} .dou_table table tr{

  height:2rem;
  line-height:2rem;

} .dou_table table tr td{

  font-family: "faricy-new-web",helvetica,sans-serif;
  font-size:1.2rem;
 
  border:1px solid #aaa;

text-align:center; } .dou_t_des{

  font-family: "faricy-new-web",helvetica,sans-serif;
  width:85%;   

margin:20px auto 0;

  font-size:1.4rem;
  

} .even_bg{

  background:#f2f2f2;
  

} /*user_guide*/ .dou_table_ug{

 width:100%;

} .dou_table_ug table{

 width:100%;

} .dou_table_ug table tr{

 height:2rem;
 line-height:2rem;

} .dou_table_ug table tr td{

  font-family: "faricy-new-web",helvetica,sans-serif;
  font-size:1.4rem;
  font-weight:bold;
 text-align:center;

} .dou_table_ug table tr td a{

 color:#31bb7c;

} /*user_guide end*/ /*documentation end*/