您的位置：首页 > 其它

[置顶] 不设置宽高，制作按钮，并让文字居中

2017-03-17 12:00 288 查看 
1.效果如下：


2.代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>按钮</title>
<style>
/*做5个按钮，不许出现宽和高，文字居中*/
*{
margin: 0;
padding:0;
}
/*按钮1*/
/*			div{
padding: 30px;
}
span{
background-color: pink;
padding: 30px;
}*/

/*按钮2*/
div{
padding: 0px 30px;
background-color: paleturquoise;
}
span{
background-color: pink;
padding: 0px 30px;
}
/*第二种方法*/
.cls{
padding: 30px;
width: 100px;
background-color: darkgreen;
}
p{
background-color: blueviolet;
text-align: center;
margin: 10px;
}
</style>
</head>
<body>
<div>
<span>按钮</span>
<span>按钮</span>
<span>按钮</span>
<span>按钮</span>
<span>按钮</span>
</div>
<div class="cls">
<p>按钮</p>
<p>按钮</p>
<p>按钮</p>
<p>按钮</p>
<p>按钮</p>
</div>
</body>
</html>
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航