Main Page/styles.css
Jump to navigation
Jump to search
.mainpage-title{ font-size:1.6em; font-weight: bold; } .text-container { position: relative; width: 100%; /* 可以根据需要调整 */ height: 64px; /* 可以根据需要调整 */ margin: 0 auto; /* 居中对齐 */ overflow: hidden; text-align: center; } .text-slide { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; animation: slide-animation 6s infinite; } .text-slide:nth-child(1) { animation-delay: 0s; } .text-slide:nth-child(2) { animation-delay: 2s; } .text-slide:nth-child(3) { animation-delay: 4s; } @keyframes slide-animation { 0%, 20% { opacity: 0; transform: translateX(0); } 25%, 45% { opacity: 1; transform: translateX(-1px); } 30%, 40% { transform: translateX(1px); } 50%, 100% { opacity: 0; transform: translateX(0); } } /*什么*/ .textbox { margin: 0 auto; max-width: 1320px; height: auto; padding: 20px 0; background-color: rgba(255, 255, 255, 0.25); display: flex; flex-wrap: wrap; } .left-child, .right-child { background-color: rgba(240, 240, 240, 0.25); flex: 1 1 100%; box-sizing: border-box; padding: 10px; } @media (min-width: 980px) { .left-child, .right-child { flex: 1; } .right-child { max-width:900px; } .left-child { border-right: 1px solid black; max-width:390px; } } .container { width: 100%; } .container p{ display: flex; flex-wrap: wrap; width: 100%; } .container p * a{ max-width:270px; min-width:190px; flex: 1 1 calc(33.333% - 10px); /* 3 items per row with space for borders */ height: 64px; font-weight: bold; font-size:20px; display: flex; justify-content: center; align-items: center; box-sizing: border-box; margin: 5px; /* Space between items */ text-decoration: none; transition: all 0.15s ease-in; } .container p * a.external{ background-image:none; display: none; } .container p .en a{ background-color: rgba(0, 0, 255, 0.6); /* 80% transparent blue */ border: 5px solid rgba(255, 0, 0, 0.6); /* 5px 80% transparent red */ } .container p .en a.external:visited{ color: white; } .container p .zh a{ background-color: rgba(255, 0, 0, 0.6); /* 80% transparent blue */ border: 5px solid rgba(255, 0, 0, 0.6); /* 5px 80% transparent red */ } .container p .zh a.external:visited{ color: #ffff00; }