Difference between revisions of "Template:Tongji Software/css/default css"

(Created page with "@font-face { font-family: 'icomoon'; src:url('../fonts/icomoon.eot?rretjt'); src:url('../fonts/icomoon.eot?#iefixrretjt') format('embedded-opentype'), url('../fonts/icomo...")
 
Line 1: Line 1:
−
@font-face {
 
−
font-family: 'icomoon';
 
−
src:url('../fonts/icomoon.eot?rretjt');
 
−
src:url('../fonts/icomoon.eot?#iefixrretjt') format('embedded-opentype'),
 
−
url('../fonts/icomoon.woff?rretjt') format('woff'),
 
−
url('../fonts/icomoon.ttf?rretjt') format('truetype'),
 
−
url('../fonts/icomoon.svg?rretjt#icomoon') format('svg');
 
−
font-weight: normal;
 
−
font-style: normal;
 
−
}
 
−
 
−
[class^="icon-"], [class*=" icon-"] {
 
−
font-family: 'icomoon';
 
−
speak: none;
 
−
font-style: normal;
 
−
font-weight: normal;
 
−
font-variant: normal;
 
−
text-transform: none;
 
−
line-height: 1;
 
−
 
−
/* Better Font Rendering =========== */
 
−
-webkit-font-smoothing: antialiased;
 
−
-moz-osx-font-smoothing: grayscale;
 
−
}
 
−
 
−
body, html {  padding: 0; margin: 0;}
 
−
 
−
/* Reset */
 
−
*,
 
−
*:after,
 
−
*:before {
 
−
border: 0;
 
−
-webkit-box-sizing: border-box;
 
−
-moz-box-sizing: border-box;
 
−
box-sizing: border-box;
 
−
}
 
−
 
−
.cf:before,
 
−
.cf:after {
 
−
content: ' ';
 
−
display: table;
 
−
}
 
−
 
−
.cf:after {
 
−
clear: both;
 
−
}
 
−
 
 
body {
 
body {
−
font-family: 'Avenir Next', Avenir, 'Helvetica Neue', 'Lato', 'Segoe UI', Helvetica, Arial, sans-serif;
+
margin: 0;
−
margin: 0;
+
overflow: hidden;
−
color: #cecece;
+
−
background: #1d1e21;
+
−
-webkit-font-smoothing: antialiased;
+
−
-moz-osx-font-smoothing: grayscale;
+
 
}
 
}
−
 
+
#webgl-output{
−
a {
+
    position: absolute;
−
text-decoration: none;
+
    z-index: -1;
−
color: #5c5edc;
+
−
outline: none;
+
 
}
 
}
 +
#indexTitle1{
 +
    /*background-color: antiquewhite;*/
 +
    width: 100%;
 +
    float: left;
 +
    position: absolute;
 +
    left: 7%;
 +
    top: 32.5%;
 +
    margin: 0;
 +
    font-size: 1.75vh;
 +
    /* font-family: "Cambria"; */
 +
    font-weight: bold;
 +
    cursor: default;
 +
    color: white;
 +
    letter-spacing:2px;
  
−
a:hover {
+
    text-shadow: 0 0 25px #fff;
−
color: #fff;
+
 
}
 
}
  
−
.bgcolor-1 { background: #f0efee; }
+
#indexTitle2{
−
.bgcolor-2 { background: #f9f9f9; }
+
    /*background-color: antiquewhite;*/
−
.bgcolor-3 { background: #e8e8e8; }/*light grey*/
+
    width: 500px;
−
.bgcolor-4 { background: #2f3238; color: #fff; }/*Dark grey*/
+
    float: left;
−
.bgcolor-5 { background: #df6659; color: #521e18; }/*pink1*/
+
    position: absolute;
−
.bgcolor-6 { background: #2fa8ec; }/*sky blue*/
+
    /* position: relative; */
−
.bgcolor-7 { background: #d0d6d6; }/*White tea*/
+
    left: 7%;
−
.bgcolor-8 { background: #3d4444; color: #fff; }/*Dark grey2*/
+
    top: 35%;
−
.bgcolor-9 { background: #ef3f52; color: #fff;}/*pink2*/
+
    margin: 0;
−
.bgcolor-10{ background: #64448f; color: #fff;}/*Violet*/
+
    font-size: 7vh;
−
.bgcolor-11{ background: #3755ad; color: #fff;}/*dark blue*/
+
    /* font-family: "Cambria"; */
−
.bgcolor-12{ background: #3498DB; color: #fff;}/*light blue*/
+
    font-weight: bold ;
−
/* Header */
+
    cursor: default;
−
.htmleaf-header{
+
    color: white;
−
padding: 6em 10vw 2em;
+
−
}
+
−
.htmleaf-header h1 {
+
−
font-weight: 600;
+
−
font-size: 2em;
+
−
line-height: 1;
+
−
margin-bottom: 0;
+
−
font-family: "Microsoft YaHei","宋体","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif, FreeSans, Arimo;
+
−
}
+
−
.htmleaf-header h1 span {
+
−
font-family: "Microsoft YaHei","宋体","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif, FreeSans, Arimo;
+
−
display: block;
+
−
font-size: 60%;
+
−
font-weight: 400;
+
−
padding: 0.8em 0 0.5em 0;
+
−
color: #c3c8cd;
+
−
}
+
−
.bp-header {
+
−
padding: 6em 10vw 2em;
+
−
}
+
  
−
.bp-header__title {
+
    text-shadow: 0 0 25px #fff;
−
font-size: 2.125em;
+
    /*color:#ffffff;*/
−
font-weight: 700;
+
−
line-height: 1.3;
+
−
margin: 0;
+
−
letter-spacing: 2px;
+
−
text-transform: uppercase;
+
−
color: #fff;
+
−
}
+
  
−
.bp-header__desc {
+
    letter-spacing:5px;
−
font-size: 0.95em;
+
−
margin: 0.5em 0 1em;
+
−
padding: 0;
+
 
}
 
}
  
−
.bp-header__present {
+
#indexTitle3{
−
font-size: 0.85em;
+
    /*background-color: antiquewhite;*/
−
font-weight: 700;
+
    width: 100%;
−
position: relative;
+
    float: left;
−
z-index: 100;
+
    position: absolute;
−
display: block;
+
    left: 7%;
−
padding: 0 0 0.6em 0.1em;
+
    top: 55%;
−
letter-spacing: 0.5em;
+
    margin: 0;
−
text-transform: uppercase;
+
    font-size: 1.75vh;
−
color: #5c5edc;
+
    /* font-family: "Cambria"; */
−
}
+
    font-weight: bold;
 +
    cursor: default;
 +
    color: white;
 +
    letter-spacing:2px;
  
−
/*nav*/
+
    text-shadow: 0 0 25px #fff;
−
.htmleaf-demo a{color: #1d7db1;text-decoration: none;}
+
−
.htmleaf-demo{width: 100%;padding-bottom: 1.2em;}
+
−
.htmleaf-demo a{display: inline-block;margin: 0.5em;padding: 0.6em 1em;border: 3px solid #1d7db1;font-weight: 700;}
+
−
.htmleaf-demo a:hover{opacity: 0.6;}
+
−
.htmleaf-demo a.current{background:#1d7db1;color: #fff; }
+
−
/* Top Navigation Style */
+
−
.htmleaf-links {
+
−
position: relative;
+
−
display: inline-block;
+
−
white-space: nowrap;
+
−
font-size: 1.5em;
+
−
text-align: center;
+
 
}
 
}
−
 
+
.findMore1{
−
.htmleaf-links::after {
+
    position: absolute;
−
position: absolute;
+
    float: left;
−
top: 0;
+
    left: 100px;
−
left: 50%;
+
    top: 730px;
−
margin-left: -1px;
+
−
width: 2px;
+
−
height: 100%;
+
−
background: #dbdbdb;
+
−
content: '';
+
−
-webkit-transform: rotate3d(0,0,1,22.5deg);
+
−
transform: rotate3d(0,0,1,22.5deg);
+
 
}
 
}
−
 
+
.findmore2{
−
.htmleaf-icon {
+
    list-style-type: none;
−
display: inline-block;
+
−
margin: 0.5em;
+
−
padding: 0em 0;
+
−
width: 1.5em;
+
−
text-decoration: none;
+
 
}
 
}
−
 
+
div.findMore1 li a{
−
.htmleaf-icon span {
+
    font-family: "Cambria";
−
display: none;
+
    font-weight: bold;
 +
    font-size: 18px;
 +
    letter-spacing:2px;
 +
    border: 1px solid;
 +
    border-radius:10px;
 +
    border-color: white;
 +
    text-align: center;
 +
    width: 280px;
 +
    height: 40px;
 +
    line-height: 40px;
 +
    background-color: rgba(0,0,0,0);
 +
    position: absolute;
 +
    color:white;
 +
    text-decoration: none;
 +
    transition: color 200ms,background-color 200ms;
 
}
 
}
−
 
+
div.findMore1 li a:hover{
−
.htmleaf-icon:before {
+
    color:black;
−
margin: 0 5px;
+
    background-color: rgba(255,255,255,1);
−
text-transform: none;
+
−
font-weight: normal;
+
−
font-style: normal;
+
−
font-variant: normal;
+
−
font-family: 'icomoon';
+
−
line-height: 1;
+
−
speak: none;
+
−
-webkit-font-smoothing: antialiased;
+
−
}
+
−
/* footer */
+
−
.htmleaf-footer{width: 100%;padding-top: 10px;}
+
−
.htmleaf-small{font-size: 0.8em;}
+
−
.center{text-align: center;}
+
−
/****/
+
−
.related {
+
−
color: #fff;
+
−
background: #333;
+
−
text-align: center;
+
−
font-size: 1.25em;
+
−
padding: 0.5em 0;
+
−
overflow: hidden;
+
−
}
+
−
 
+
−
.related > a {
+
−
vertical-align: top;
+
−
width: calc(100% - 20px);
+
−
max-width: 340px;
+
−
display: inline-block;
+
−
text-align: center;
+
−
margin: 20px 10px;
+
−
padding: 25px;
+
−
font-family: "Microsoft YaHei","宋体","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif, FreeSans, Arimo;
+
−
}
+
−
.related a {
+
−
display: inline-block;
+
−
text-align: left;
+
−
margin: 20px auto;
+
−
padding: 10px 20px;
+
−
opacity: 0.8;
+
−
-webkit-transition: opacity 0.3s;
+
−
transition: opacity 0.3s;
+
−
-webkit-backface-visibility: hidden;
+
−
}
+
−
 
+
−
.related a:hover,
+
−
.related a:active {
+
−
opacity: 1;
+
−
}
+
−
 
+
−
.related a img {
+
−
max-width: 100%;
+
−
opacity: 0.8;
+
−
border-radius: 4px;
+
−
}
+
−
.related a:hover img,
+
−
.related a:active img {
+
−
opacity: 1;
+
−
}
+
−
.related h3{font-family: "Microsoft YaHei", sans-serif;}
+
−
.related a h3 {
+
−
font-weight: 300;
+
−
margin-top: 0.15em;
+
−
color: #fff;
+
−
}
+
−
/* icomoon */
+
−
.icon-htmleaf-home-outline:before {
+
−
content: "\e5000";
+
−
}
+
−
 
+
−
.icon-htmleaf-arrow-forward-outline:before {
+
−
content: "\e5001";
+
−
}
+
−
.bp-nav {
+
−
margin: 0 0 0 -0.75em;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
 
+
−
 
+
−
@media screen and (max-width: 40em) {
+
−
.bp-header {
+
−
padding: 50px 20px 1em;
+
−
}
+
−
.bp-header__title {
+
−
font-size: 1.8em;
+
−
}
+
 
}
 
}

Revision as of 08:04, 5 October 2019

body { margin: 0; overflow: hidden; }

  1. webgl-output{
   position: absolute;
   z-index: -1;

}

  1. indexTitle1{
   /*background-color: antiquewhite;*/
   width: 100%;
   float: left;
   position: absolute;
   left: 7%;
   top: 32.5%;
   margin: 0;
   font-size: 1.75vh;
   /* font-family: "Cambria"; */
   font-weight: bold;
   cursor: default;
   color: white;
   letter-spacing:2px;

   text-shadow: 0 0 25px #fff;

}

  1. indexTitle2{
   /*background-color: antiquewhite;*/
   width: 500px;
   float: left;
   position: absolute;
   /* position: relative; */
   left: 7%;
   top: 35%;
   margin: 0;
   font-size: 7vh;
   /* font-family: "Cambria"; */
   font-weight: bold ;
   cursor: default;
   color: white;

   text-shadow: 0 0 25px #fff;
   /*color:#ffffff;*/

   letter-spacing:5px;

}

  1. indexTitle3{
   /*background-color: antiquewhite;*/
   width: 100%;
   float: left;
   position: absolute;
   left: 7%;
   top: 55%;
   margin: 0;
   font-size: 1.75vh;
   /* font-family: "Cambria"; */
   font-weight: bold;
   cursor: default;
   color: white;
   letter-spacing:2px;

   text-shadow: 0 0 25px #fff;

} .findMore1{ 

   position: absolute;
   float: left;
   left: 100px;
   top: 730px;

} .findmore2{ 

   list-style-type: none;

} div.findMore1 li a{ 

   font-family: "Cambria";
   font-weight: bold;
   font-size: 18px;
   letter-spacing:2px;
   border: 1px solid;
   border-radius:10px;
   border-color: white;
   text-align: center;
   width: 280px;
   height: 40px;
   line-height: 40px;
   background-color: rgba(0,0,0,0);
   position: absolute;
   color:white;
   text-decoration: none;
   transition: color 200ms,background-color 200ms;

} div.findMore1 li a:hover{ 

   color:black;
   background-color: rgba(255,255,255,1);

}