123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109 |
- @import url(music.css);
- @import url(saying.css);
- * {
- margin: 0;
- padding: 0;
- }
- #container {
- width: 390px;
- height: 844px;
- margin: 0px auto;
- background: url('../imags/background/back3.png') no-repeat;
- background-size: 390px 844px;
- /* border: 1px solid rgb(240, 7, 7); */
- position: relative;
- border-radius: 30px;
- }
- .container1 {
- position: absolute;
- left: 70px;
- top: 180px;
- /* border: 1px solid rgb(240, 7, 7); */
- }
- .container1 p {
- font-family: 'SONG';
- font-size: 20px;
- color: black;
- text-align: center;
- line-height: 30px;
- letter-spacing: 5px;
- }
- .container1 p span {
- color: rgb(116, 48, 67);;
- }
- .container2 {
- position: absolute;
- left: 90px;
- top: 350px;
- /* border: 1px solid rgb(240, 7, 7); */
- }
- .container2>div>img {
- width: 200px;
- height: 160px;
- }
- .container3 {
- position: absolute;
- left: 105px;
- bottom: 80px;
- /* border: 1px solid rgb(240, 7, 7); */
- }
- .container3>div:first-child {
- /* border: 1px solid rgb(240, 7, 7); */
- margin-left: 10px;
- }
- .container3>div:nth-child(2) {
- /* border: 1px solid rgb(240, 7, 7); */
- margin-left: 10px;
- }
- .container3>div:last-child {
- /* border: 1px solid rgb(240, 7, 7); */
- margin-left: 10px;
- }
- .container3>div>img {
- width: 150px;
- height: 70px;
- cursor: pointer;
- /*鼠标手型改变*/
- transition: 0.3s ease-in-out;
- /*过渡时间:持续的时间 规定以慢速开始和结束,先加速后减速效果*/
- }
- .container3>div>img:hover {
- transform: scale(1.2);
- }
- #correct,
- #wrong {
- position: absolute;
- z-index: 100;
- left: 50%;
- transform: translateX(-50%);
- bottom: 500px;
- }
- .back img {
- position: absolute;
- top: 0px;
- left: 5px;
- width: 80px;
- cursor: pointer;
- }
- .go img {
- position: absolute;
- width: 100px;
- cursor: pointer;
- bottom: 0px;
- right: 10px;
- }
|