帮忙找一个酷炫星空的可用于登录页htnl的图
时间: 2024-06-10 08:06:58 浏览: 6
很高兴为您提供帮助!以下是一些酷炫星空图片的链接,您可以在其中选择并使用作为登录页的背景。
1. https://www.pexels.com/photo/starry-sky-984640/
2. https://unsplash.com/photos/8NejK4JZseQ
3. https://www.pexels.com/photo/stars-in-the-sky-594610/
4. https://unsplash.com/photos/OfTrfHVkKLI
希望这些图片能够满足您的需求!如果您有其他问题或需要帮助,请随时告诉我。
相关问题
写一个酷炫星空登录页html
很高兴能够帮助您,以下是一个简单的酷炫星空登录页的HTML代码示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>酷炫星空登录页</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
/* 设置全屏背景图 */
html, body {
height: 100%;
background-image: url("https://picsum.photos/1920/1080/?random");
background-size: cover;
}
/* 设置登录框样式 */
#login-box {
width: 300px;
height: 300px;
margin: auto;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 10px;
padding: 20px;
position: absolute;
top: 0; bottom: 0; left: 0; right: 0;
text-align: center;
}
/* 设置登录框标题样式 */
#login-box h1 {
margin-top: 0;
font-size: 40px;
color: #222;
text-shadow: 1px 1px 1px #eee;
}
/* 设置输入框样式 */
#login-box input {
display: block;
width: 240px;
height: 40px;
margin: 20px auto;
border: none;
border-radius: 5px;
padding: 10px;
font-size: 18px;
box-shadow: 1px 1px 1px #eee;
}
/* 设置登录按钮样式 */
#login-box button {
display: block;
width: 120px;
height: 40px;
margin: 20px auto 0;
border: none;
border-radius: 20px;
background: #1e90ff;
color: #fff;
font-size: 18px;
transition: background 0.5s;
cursor: pointer;
}
/* 鼠标悬浮时改变登录按钮颜色 */
#login-box button:hover {
background: #00bfff;
}
</style>
</head>
<body>
<div id="login-box">
<h1>酷炫星空登录页</h1>
<input type="text" placeholder="请输入用户名">
<input type="password" placeholder="请输入密码">
<button type="submit">登录</button>
</div>
</body>
</html>
```
希望能够对您有所帮助!
写一个背景是酷炫星空的登录页html
很高兴为您服务!关于您的问题,我可以提供以下示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>酷炫星空登录页</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">
body{
background-color: #111;
background-image: url('https://cdn.pixabay.com/photo/2018/03/27/18/16/stars-3272074__340.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
font-family: Arial, sans-serif;
font-size: 16px;
color: #fff;
padding: 0;
margin: 0;
}
form{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 200px;
text-align: center;
}
input[type="text"], input[type="password"]{
padding: 10px;
margin: 10px;
width: 300px;
border-radius: 20px;
border: none;
outline: none;
font-size: 18px;
background-color: rgba(255, 255, 255, 0.2);
color: #fff;
}
input[type="submit"]{
padding: 10px;
margin: 10px;
width: 200px;
border-radius: 20px;
border: none;
outline: none;
font-size: 18px;
background-color: #00ffff;
color: #111;
cursor: pointer;
}
</style>
</head>
<body>
<form>
<h1>欢迎登录酷炫星空</h1>
<input type="text" placeholder="请输入用户名">
<input type="password" placeholder="请输入密码">
<input type="submit" value="登录">
</form>
</body>
</html>
```
这个登录页的背景是一张酷炫的星空图片,登录表单的样式也非常简洁明了。如果您需要修改样式或添加其他元素,可以根据上述代码进行修改。
希望这个回答能够帮到您,如果您还有其他问题,欢迎随时向我提问!