【HTML】@weijinhai0101：模仿酷狗登录页面半成品（CSS样式和HTML代码放在一起了）
生活随笔
收集整理的這篇文章主要介紹了
【HTML】@weijinhai0101：模仿酷狗登录页面半成品（CSS样式和HTML代码放在一起了）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
```
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>模仿酷狗登錄頁面</title><style type="text/css">/* 去掉外邊距 */* {margin: 0px;padding: 0px}.father {width: 490px;height: 618px;border: 2px solid lightgrey;border-image: white;text-align: center;margin: auto;}.delete img{float: right; }#clear{clear: both;}.biaoti{font-size: 38px;margin-top: 100px;font-family: 宋體;width: 490px;height: 38px;text-align: center;}/* 賬號文本框 */.zhanghao{margin-top: 68px;width: 490px;height: 50px;text-align: center; /* border: 1px solid red; */}.zhanghao input{background: url(img/QQ截圖20190629174740.png)320px 12px no-repeat;font-size: 18px;width: 365px;height: 50px;border: 1px solid lightgray;}/* 密碼文本框 */.pwd{margin-top: 10px;width: 490px;height: 50px;text-align: center; /* border: 1px solid red; */}.pwd input{background: url(img/QQ截圖20190629175348.png)250px 10px no-repeat;font-size: 18px;width: 365px;height: 50px;border: 1px solid lightgray;}.jizhumima{width: 490px;height: 50px;font-size: 18px;margin-top: 57px;/* border: 1px solid red; */}.password{width: 365px;height: 30px;/* border: 1px solid red; */margin-left: 62px;}/* 改變字體顏色 */.password a{color: black;}.denglu input{color: #FFFFFF;font-size: 30px;width: 365px;height: 50px;border: 1px solid deepskyblue;background: deepskyblue;}/* 去掉下劃線 */a{text-decoration: none;}.ziti{color: deepskyblue;}</style></head><body><div class="father"><div class="delete"><!-- 此圖片右浮動 --><img src="img/QQ截圖20190629180920.png" width="25" height="25"></div><!-- 清除浮動 --><div id="clear"></div><h2 class="biaoti">歡迎你的到來</h2><p class="zhanghao"><input type="text" placeholder="輸入賬號" /></p><p class="pwd"><input type="password" value="" placeholder="輸入密碼" /></p><div class="jizhumima"><div class="password"><input type="checkbox" class="jizhumima1" /><a href="#">記住密碼</a><input type="checkbox" class="jizhumima2" /><a href="#">自動登錄</a> <a href="#">注冊賬號</a></div></div><p class="denglu"><a href="#"><input type="submit" class="denglu1" value="登錄" /></a></p><p class="picture"><a href="#"><img src="img/QQ截圖20190629173646.png" width="40" height="40"></a><a href="#"><img src="img/QQ截圖20190629173726.png" width="40" height="40"></a><a href="#"><img src="img/QQ截圖20190629173746.png" width="40" height="40"></a></p><p>登錄代表你同意<a href=""><span class="ziti">用戶服務協議</span></a>和<a href=""><span class="ziti">隱私政策</span></a></p></div></body> </html>總結
以上是生活随笔為你收集整理的【HTML】@weijinhai0101：模仿酷狗登录页面半成品（CSS样式和HTML代码放在一起了）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 你真的了解“手机端的 C/S架构 向 B
- 下一篇： 本地HTML文档批量翻译软件