QQ邮箱登录PC布局实战笔记四

本文说明:

经过几次的努力，一个完整的QQ邮箱静态页面已经搭建完成，自己的确在一些细节方面并没有很好地和人家百分百一致，但是也是通过自己的方法，得到了功能的实现。老实来讲，HTML和CSS的布局是一件很繁琐的事情，当然这是在你完全不依靠框架的基础上。它很注重细节，不过作为一个熟练的前端，布局还是很需要努力和细心的。

最终效果图:

相关代码:

• QQ登录部分实现(二维码快捷登录和微信类似，暂时省去)

1. html部分

 <div class="bottom_qq" id="qq">
                        <!-- QQ表单的内容区域 -->
                            <div class="qq_bottom">
                                <!-- 首先是一个表单 -->
                                <form action="https://blog.csdn.net/ljxzuishuai">
                                    <!-- 账号 -->
                                    <label for="username">
                                            <input type="text" id="username" name="username" placeholder=" 支持QQ号/邮箱/手机号登录"><br>
                                    </label>
                                   <!-- 密码 -->
                                   <label for="password">
                                        <input type="password" id="password" name="password" placeholder=" QQ密码"