12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- <!-- templates/index.html -->
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>短网址生成器</title>
- <link rel="shortcut icon" href="https://29455906.s21i.faiusr.com/4/ABUIABAEGAAg9_TSrAYoxvHpgAcwgAI4gAI.png">
- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.0-alpha1/css/bootstrap.min.css" rel="stylesheet">
- <style>
- body {
- font-family: Arial, sans-serif;
- margin: 20px;
- }
- h1, h2, p {
- text-align: center;
- }
- form {
- max-width: 400px;
- margin: 20px auto;
- }
- input {
- width: 100%;
- padding: 10px;
- margin: 8px 0;
- box-sizing: border-box;
- }
- button {
- background-color: #4CAF50;
- color: white;
- padding: 10px 15px;
- border: none;
- border-radius: 5px;
- cursor: pointer;
- width: 100%;
- }
- button:hover {
- background-color: #45a049;
- }
- .result {
- margin: 20px;
- padding: 20px;
- border: 1px solid #ddd;
- border-radius: 5px;
- }
- </style>
- </head>
- <body>
- <div class="container">
- <h1 class="mt-5">短网址生成器</h1>
- <form class="mt-4" action="/shorten" method="post">
- <div class="mb-3">
- <label for="url" class="form-label">输入原始网址:</label>
- <input type="url" id="url" name="url" class="form-control" placeholder="https://example.com" required>
- </div>
- <button type="submit" class="btn btn-primary">生成短网址</button>
- </form>
- {% block content %}{% endblock %}
- </div>
- <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
- </body>
- </html>
|