web前端--html 5---qq注册

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>qq注册</title>

<link rel="import" href="component.html">

<style>

.theme{

width: 300px;

height: 600px;

margin: 0px auto;

}

.theme1 select{

padding:5px 10px;

border:none;

border-color: #B8B8B8;

box-sizing: border-box;

font-size: 14px;

color: #B8B8B8;

}

.a1{

color: #4b7cde;

}

.form-group1 input{

width: 100%;

padding:10px 10px;

border-radius:5px;

border-color: #B8B8B8;

box-sizing: border-box;

font-size: 15px;

}

.form-group2 select{

width: 25%;

padding:10px 10px;

border-radius:5px;

border-color: #B8B8B8;

box-sizing: border-box;

font-size: 15px;

}

.form-group2 input{

width: 73.5%;

padding:10px 10px;

border-radius:5px;

border-color: #B8B8B8;

box-sizing: border-box;

font-size: 15px;

}

.form-group3{

width:100%;

padding: 10px 10px;

border: none;

border-radius:10px;

background-color:#2c5df0;

color: white;

font-size: 20px;

cursor:pointer;

transition:background-color 0.3s;

}

.form-group4{

font-size: 15px;

color:#B8B8B8

}

</style>

</head>

<body>

<table>

<tr>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>

<span class="theme1">

<img style="width: 40px;height: 40px;" src="img/down.jpeg" alt="qq">

<select >

<option value="简体中文">简体中文</option>

<option value="繁体">繁体</option>

<option value="English">English</option>

</select>

<font size="2" color=#B8B8B8>意见反馈</font>

</span>

</td>

</tr>

<tr >

<td rowspan="2">

<img style="width: 300px; height: 700px;" src="./img/屏幕截图 2024-10-16 170937.png" alt="qq注册">

</td>

<td style="width: 300px; height: 600px;">&nbsp;</td>

<td>

<div class="theme">

<h1>欢迎注册QQ</h1>

每一天,乐在沟通。&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<SPAN class="a1">免费靓号</SPAN>

<form accept="#" method="post">

<div class="form-group1" >

<p><input type="text" name="username" id="username" placeholder="昵称"></p>

<p><input type="password" name="password" id="password" placeholder="密码"></p>

</div>

<div class="form-group2">

<select >

<option value="+86">+86</option>

</select>

<input type="text" name="number" id="number" placeholder="手机号码">

<font size="2" color=#B8B8B8>可通过手机号找回密码</font>

</div>

<P><button type="submit" name="ENER" class="form-group3">登录</button> </P>

<div class="form-group4">

<P><input type="checkbox" name="checkbox" value="checkbox">我已阅读并同意</P>

</div>

<div>

<p>&nbsp;

</p>

<p>&nbsp;

</p>

<p>&nbsp;

</p>

<p>&nbsp;

</p>

<font size="2" color=#B8B8B8>copyringmi@ 18346-54244Tencent UK HJDGUSD</font>

</div>

</form>

</div>

</div>

</td>

</tr>

</table>

</body>

</html>

相关推荐
学嵌入式的小杨同学3 小时前
从零打造 Linux 终端 MP3 播放器!用 C 语言实现音乐自由
linux·c语言·开发语言·前端·vscode·ci/cd·vim
weixin_425543734 小时前
TRAE CN3.3.25 构建的Electron简易DEMO应用
前端·typescript·electron·vite·nestjs
Mr Xu_5 小时前
【Vue3 + ECharts 实战】正确使用 showLoading、resize 与 dispose 避免内存泄漏
前端·信息可视化·vue·echarts
0思必得05 小时前
[Web自动化] Selenium设置相关执行文件路径
前端·爬虫·python·selenium·自动化
雯0609~5 小时前
hiprint:实现项目部署与打印1-官网提供普通html版本
前端·html
不绝1916 小时前
UGUI——进阶篇
前端
Exquisite.6 小时前
企业高性能web服务器(4)
运维·服务器·前端·网络·mysql
2501_944525546 小时前
Flutter for OpenHarmony 个人理财管理App实战 - 账户详情页面
android·java·开发语言·前端·javascript·flutter
2601_949857437 小时前
Flutter for OpenHarmony Web开发助手App实战:快捷键参考
前端·flutter
wangdaoyin20107 小时前
若依vue2前后端分离集成flowable
开发语言·前端·javascript