.Title1 {
    font-family: fantasy;
    font-size: 50px;
    background-color: skyblue;
}

span.Title2{
    font-size: 20px;
    font-weight: 900;
    color: green;
    background-color: aqua;
}

h1.hhh{
    text-align: center;
    /*position: sticky;
    top: 20px;*/
}
h2.hhh{
    text-align: right;
}


.leftfloat{
    width: 500px;
    height: 500px;
    float: left;
    background-color: blueviolet;

}
.rightfloat{
    width: 200px;
    height: 200px;
    background-color: darkgoldenrod;
}

p.right{
    text-align: right;
}

p.err{
    font-size:40px;
    border: 20px solid darkred;
    box-sizing: border-box;
    text-align: center;
    width: 500px;
    height: 500px;
    position: fixed;
    top: 25%;
    left: 35%;
    background-color: red;
}

div.first{
    overflow: auto;
    height: 500px;
    background-color: cornflowerblue;
}

div.SideColumn{
    float: left;
    overflow: auto;
    width: 400px;
    height: 79.8%;
    position: fixed/*sticky*/;
    top: 20.2%;
    background-color: aliceblue;
}
div.FGX{
    margin-top: 0;
    width: 1px;
    height: 2000px;
    float: left;
    position: relative;
    top: 0;
    background-color: black;
}
div.ZWK{
    margin-top: 0;
    width: 400px;
    height: 2000px;
    float: left;
    background-image: url("../IMAGE/ljt.jpeg");
    background-repeat: repeat-y;
    background-position: center;
}
div.trans{
    position: fixed;
    top: 50%;
    right: 0;
    width: 100px;
    height: 100px;
    background-color: cornflowerblue;
    transition: width 5s ease , height 5s ease;
    float: none;   /*定位为fixed ， 已经脱离文本流了 ，不需要float ，所以即使有float也会忽略*/
    overflow: hidden;
}
div.trans:focus{
    width: 300px;
    height: 300px;
}
div.trans:hover{
    width: 300px;
    height: 300px;
}
div.trans:active{
    width: 300px;
    height: 300px;
}
p.Title{
    font-size: 30px;
    font-family: "Abyssinica SIL";
    text-align: center;
}
p.left{
    margin-left: 500px;
    text-indent: 2em;
}
select.BIG{background-repeat: repeat-y;
    background-position: center;
    width: 50px;
    height: 50px;
}
table.center{
    margin-left: auto;
    margin-right: auto; /*此auto居中是以浮动元素剩下空间计算的居中 ， 则如果改成50%，以显示屏最左侧  ， 印证了之前想法,块与浮动元素重合，但会把文字鸡飞*/
}
div.fix{
    width: 100%;
    height: 20.5%;
    margin-bottom: 0;
    margin-top: 0;
    background-image: url("../IMAGE/222.png");
}
div.fix2{
    width: 100%;
    height: 18%;
    margin-bottom: 0;
    margin-top: 0;
    background-image: url("../IMAGE/222.png");
}
html,body{
    margin: 0;
    padding: 0;
    border: 0;
    height: 100%;
}