
CSS如何把text和Button做出这样的效果?
2个回答
展开全部
我大致描述一下吧,首先这是一个login, 直接new一个div就可以,设置样式为,有一个灰色的边框,大约三像素,border:3px solid #666,然后里面的文字,用户登录,可以直接用h1,设置一下下边框即可,当然宽度也要设置的,至于username 和 password input嘛,就更简单了, span ul li都可以实现,文字颜色和边框颜色基本一致,至于register 和login也更简单 直接new一个id设置样式就ok, 边框 文字即可,如果要代码我可以给你做一个,不要的话,我就写到这里了.
追问
登录名
密码
这样出来的效果是有内嵌的那种效果,我意思是怎样取消它这样种效果,然后再用一个灰色(padding?)框框住它。
展开全部
<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
*{margin:0;}
p{color:#aaa;}
.out{
display:block;
margin:10px 0 0 10px;
border:4px solid #888;
width:350px;
height:297px;}
p.title{
margin:20px auto 5px;
font-size:25px;
}
hr{
color:#aaa;
width:300px;
margin: 0 auto;
border:2px solid #aaa;
}
div.content{
font-size:20px;
margin-top:35px;
margin-left:50px;
}
p.name{margin-bottom:35px;}
input#name{border:2px solid #aaa;width:120px;}
input#pwd{border:2px solid #aaa;width:120px;}
div.btnDiv{
margin-top:20px;
margin-left:50px;
}
.btn{font-size:22px;color:#fff; height:35px;width:70px;background:#aaa;border:3px solid #666;}
#btn1{}
#btn2{}
</style>
</head>
<body>
<div class="out">
<p class="title"> 用户登陆</p>
<hr/>
<div class="content">
<p class="name">登陆名 <input type="text" id="name" /></p>
<p class="pwd">密 码 <input type="text" id="pwd" /></p>
</div>
<div class="btnDiv"><input type="button" class="btn" id="btn1" value="注册"/>
<input type="button" class="btn" id="btn2" value="确认"/></div>
</div>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询