html-QQ登陆界面

最新推荐文章于 2023-12-14 23:07:52 发布

梦想做程序员的剪辑师

最新推荐文章于 2023-12-14 23:07:52 发布

阅读量1.9w

点赞数 18

分类专栏：笔记

本文链接：https://blog.csdn.net/straw_/article/details/104365412

版权

这是一篇关于初学者通过30节HTML课程实践制作QQ登录界面的文章。作者花费数小时完成了界面仿制，虽然代码存在冗余、命名不规范等问题，但作为学习过程的一部分，作者表示将继续努力提升。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

初学30节课html的入门课程，花了几个小时模仿了一个qq的登陆界面。
效果图如下：
在这里插入图片描述
代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>QQ登陆界面</title>
		<style type="text/css">
			body{
   
				background-color: #F2F2F2;
				background-image: url(img/背景.png);
			}
			#登陆界面{
   
				height: 400px;
				width: 600px;
				margin: auto;
				margin-top: 200px;
				background-color:#FFFFFF;
			}
			.背景图{
   
				margin: auto;
				height: 200px;
				width: 600px;
				background-image: url(img/14627.jpg);
				background-size: 150% 280%;
			}
			.close{
   
				font-size