File manager - Edit - /home/kridsana/webapp.cm.in.th/663012801/u66301280015/สอบ IP/Select.html
Back
<!DOCTYPE html> <html lang="th"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>เลือกเวอร์ชันของเว็บไซต์</title> <style> * { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { display: flex; height: 100vh; background-color: #f0f2f5; } .container { display: flex; width: 100%; transition: all 0.5s ease; } .section { flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; transition: 0.3s; cursor: pointer; padding: 20px; color: white; text-decoration: none; } /* ตกแต่ง Version 1 */ .v1 { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); } /* ตกแต่ง Version 2 */ .v2 { background: linear-gradient(135deg, #2af598 0%, #009efd 100%); } .section:hover { flex: 1.2; filter: brightness(1.1); } h1 { font-size: 3rem; margin-bottom: 1rem; } p { font-size: 1.2rem; margin-bottom: 2rem; opacity: 0.9; } .btn { padding: 15px 40px; background: white; color: #333; border-radius: 50px; font-weight: bold; text-transform: uppercase; box-shadow: 0 4px 15px rgba(0,0,0,0.2); } /* ปรับแต่งสำหรับมือถือ */ @media (max-width: 768px) { body { flex-direction: column; } .container { flex-direction: column; } h1 { font-size: 2rem; } } </style> </head> <body> <div class="container"> <a href="VLSM2.html" class="section v1"> <h1>VLSM Version 1</h1> <p>สัมผัสประสบการณ์แบบคลาสสิก ใช้งานง่าย</p> <div class="btn">เข้าชมเวอร์ชัน 1</div> </a> <a href="VLSM3.html" class="section v2"> <h1>VLSM Version 2</h1> <p>ดีไซน์ใหม่ล่าสุด พร้อมฟีเจอร์จัดเต็ม</p> <div class="btn">เข้าชมเวอร์ชัน 2</div> </a> </div> </body> </html>
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Generation time: 0.46 |
proxy
|
phpinfo
|
Settings