把按钮全部放在DIV里面,然后设置DIV的样式就可以了。
<title>无标题文档</title><style type="text/css">
#nav{ text-align:center}
</style>
</head>
<body id="nav">
<div class="1"><input name="" type="text" value="用户名"width="150px" height="20px"/></div>
<div class="2"><input name="" type="text" value="密码" width="150px" height="20px"/></div>
<div class="3"><input name="" type="button" value="登录" />
<input name="" type="button" value="注册"/>
<input name="" type="button" value="游客"/></div>
</div>
</body>
效果如图,直接就水平对齐。
那个是不是图片是不是作为button的背景图片,图片里面有文字的对吧?1、建议你可以使用a标签,这样a标签是个行内元素,这样大小就由图片做控制了
2、既然是作为背景的话,你可以用background-position,里面有xpos
ypos参数,可以定位使用
<style type="text/css">.box{width:1000pxheight:40pxmargin:50px autoborder:1px solid #3366CCline-height:40pxtext-align: center}
.btn-left{height:25pxwidth:25pxborder:1px solid #000}
.btn-right{height:25pxwidth:25pxborder:1px solid #000}
.fl{float:left}
ul{list-style:nonepadding: 0}
ul li{height:8pxwidth:8pxborder-radius:8px 8pxbackground-color:#888888float:leftmargin-left:3px}
.div1{
display: inline-block
}
</style>
</head>
<body>
<div class="box">
<div class="div1">
<button class="btn-left fl">asd</button>
<ul class="fl">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<button class="btn-right fl">asd</button>
</div>
</div>
</body>