html+css网页登录练习2

最新推荐文章于 2023-06-06 20:38:42 发布

zhoukeguai

最新推荐文章于 2023-06-06 20:38:42 发布

阅读量247

点赞数

分类专栏： html+css 文章标签： html+css

本文链接：https://blog.csdn.net/zhoukeguai/article/details/89022771

版权

html+css 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

今天做了第二个练习，还是有些生疏，不过比昨天好了一点。margin和padding用的不好，还要仔细学学！
参考地址：https://blog.csdn.net/Biexiansheng/article/details/70240203

<html>
<head>
<title>我的网页登录练习2</title>
<style type="text/css">
body{
margin:0 auto;
padding:0;
}
.beijing{
width:1000px;
height:1000px;
background-color:yellow;
margin:0 auto;
}
.zhongjian{
padding:150px 0px;
width:600px;
height:600px;
margin:0 auto;
text-align:center;
}
.zhongjian h1{
text-align:center;
font-size:50px;
font-weight:30px;
color:blue;
border-radius:40px;
border:1px solid white;
width:520px;
height:74px;
background-color:pink;
margin:10 auto 50 auto;/*这里要注意一下*/
}
form input{
width:300px;
height:50px;
border-radius:30px;
text-align:center;
border:0;
padding:20px 5px;
display:block;/*这里要注意一下*/
margin:10 auto 10 auto;/*上  右 下  左*//*这里要注意一下*/
font-size:30px;
font-family:"楷体";
}
form button{
width:94px;
height:46px;
border:0px;
background-color:grad;
border-radius:20px;
font-size:15px;
font-family:"黑体";
}
</style>
</head>
<body>
<div class="beijing">
<div class="zhongjian">
<h1>柠檬学院</h1>
<form><!--这里要注意一下-->
<input type="text" name="username" placeholder="请输入账号"><br />
<input type="password" name="mima" placeholder="请输入密码"><br />
<button type="submit">登&nbsp录</button>
<button type="submit">找回密码</button>
</form>
</div>
</div>
</body>
</html>

效果图如下：
在这里插入图片描述

zhoukeguai

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
html+css网页登录练习2

今天做了第二个练习，还是有些生疏，不过比昨天好了一点。margin和padding用的不好，还要仔细学学！参考地址：https://blog.csdn.net/Biexiansheng/article/details/70240203<html><head><title>我的网页登录练习2</title><style type="te...
复制链接

扫一扫

专栏目录