console
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
html,
body {
width: 100%;
height: 100%
}
body {
font-family: "华文细黑";
background: url("https://img2.baidu.com/it/u=2831116935,2095246577&fm=253&fmt=auto&app=138&f=JPG?w=642&h=500");
background-size: 100%;
}
.Logo {
background-color: rgb(42, 169, 224);
padding-left: 300px;
height: 120px;
text-align: center;
color: #FFFFFF;
padding-top: 20px;
margin: 0px;
}
.Nav {
background-color: rgb(83, 189, 250);
padding-left: 50px;
display: flex;
justify-content:Space-between;
}
a {
color: #FFFFFF;
}
.conment {
background-color: rgb(255, 255, 255);
margin-left: 500px;
margin-right: 200px;
width: 350px;
height: 300px;
border: 1px solid black;
border-radius:20px;
}
.front_page {
padding-left: 100px;
padding-right: 100px;
}
.writer {
padding-left: 100px;
padding-right: 100px;
}
.about {
padding-left: 100px;
padding-right: 100px;
}
.join {
padding-left: 100px;
padding-right: 100px;
}
.bird {
padding-left: 150px;
}
.landing {
padding-left: 150px;
}
.gugu {
padding-left: 110px;
}
.or {
padding-left: 60px;
}
.mailbox {
padding-left: 140px;
}
.forget {
padding-left: 135px;
}
</style>
<title>twitter登陆页面</title>
</head>
<body>
<div class="Logo">
<h1>正在发生</h1>
<p>What's happening</P>
</div>
<div class="Nav">
<div class="front_page"><a href="http://www.runoob.com">首页</a></div>
<div class="writer"><a href="http://www.runoob.com">作者</a></div>
<div class="about"><a href="http://www.runoob.com">关于</a></div>
<div class="join"><a href="http://www.runoob.com">加入我们</a></div>
</div>
<br/>
<br/>
<br/>
<div class="conment">
<div class="bird"><svg t="1647917700893" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
p-id="2290" width="50" height="50">
<path d="M377.248 896c-103.52 0-200-30.08-281.248-82.048 68.96 4.48 190.656-6.24 266.368-78.432-113.888-5.216-165.248-92.576-171.936-129.888 9.664 3.744 55.808 8.224 81.856-2.24-130.976-32.832-151.072-147.808-146.624-182.88 24.576 17.184 66.24 23.136 82.624 21.632-122.048-87.328-78.144-218.688-56.544-247.04 87.584 121.344 218.88 189.504 381.248 193.28a187.68 187.68 0 0 1-4.672-41.76C528.32 243.52 611.616 160 714.4 160a185.28 185.28 0 0 1 136 59.296c35.904-8.416 89.92-28.096 116.288-45.12-13.312 47.776-54.72 87.616-79.776 102.4 0.192 0.512-0.224-0.512 0 0 22.016-3.328 81.568-14.784 105.088-30.72-11.648 26.816-55.552 71.456-91.584 96.416C907.136 638.016 680.832 896 377.216 896z"
fill="#47ACDF" p-id="2291"></path>
</svg></div>
<div class="landing">
<h2>登陆</h2>
</div>
<div class="gugu"><button>使用谷歌账号登陆 </button></div>
<div class="or"><p>——————或——————</p></div>
<div class="mailbox"><input class="anniu" type="button" name="Submit" value="邮箱登陆"></div>
<br/>
<div class="forget"><button>忘记密码？</button></div>
</div>
<body/>
<html/>