[前端] 如何让你的html button本身居中的实现

2210 0
黑夜隐士 2022-10-19 15:36:49 | 显示全部楼层 |阅读模式
如何让你的html button本身居中呢? 这个很好找思路, 在其父标签中设置居中属性啊, 如下:
  1. <html>
  2. <body>
  3. <center><button onClick="myClick()">hit me</button></center>
  4. <script>
  5. function myClick()
  6. {
  7. alert("123");
  8. }
  9. </script>
  10. </body>
  11. </html>
复制代码
或者:
  1. <html>
  2. <body>
  3. <div align="center"><button onClick="myClick()">hit me</button></div>
  4. <script>
  5. function myClick()
  6. {
  7. alert("123");
  8. }
  9. </script>
  10. </body>
  11. </html>
复制代码
按钮水平居中
button是一个行内块级元素display:inline-block;
所以处理方式很简单,可以用以下两种方式:
方式一:
  1. <div style="text-align:center">  
  2. <button>按钮居中</button>                     
  3. </div>
复制代码
方式二:
  1. <div>   
  2. <button  style="display:block;margin:0 auto">按钮居中</button>                     
  3. </div>
复制代码
到此这篇关于如何让你的html button本身居中的实现的文章就介绍到这了,更多相关html button居中内容请搜索中国红客联盟以前的文章或继续浏览下面的相关文章,希望大家以后多多支持中国红客联盟!
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

中国红客联盟公众号

联系站长QQ:5520533

admin@chnhonker.com
Copyright © 2001-2025 Discuz Team. Powered by Discuz! X3.5 ( 粤ICP备13060014号 )|天天打卡 本站已运行