如何解决如何使用 Bootstrap 框架居中表格
我正在对我的静态网站进行一些更改,添加一个支付网关,所以我添加了一个用贝宝创建的自定义按钮。问题是表格没有与页面上的其余内容对齐页面的中心。这是在支持页面中。这是paypal为按钮生成的部分代码......这是页面的链接 http://www.jvits.co/support.html
<table>
<tbody><tr><td><input type="hidden" name="on0" value="Get Remote Tech Support">Get Remote Tech Support</td></tr><tr><td><select name="os0">
<option value="Tech Support 1">Tech Support 1 $60.00 USD</option>
<option value="Tech Support 2">Tech Support 2 $120.00 USD</option>
<option value="Tech Support 3">Tech Support 3 $180.00 USD</option>
</select> </td></tr>
</tbody></table>
解决方法
您可以使用 Bootstrap 类“mx-auto”使表格居中:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" integrity="undefined" crossorigin="anonymous">
</head>
<body>
<div class="container">
<table class="mx-auto">
<tbody><tr><td><input type="hidden" name="on0" value="Get Remote Tech Support">Get Remote Tech Support</td></tr><tr><td><select name="os0">
<option value="Tech Support 1">Tech Support 1 $60.00 USD</option>
<option value="Tech Support 2">Tech Support 2 $120.00 USD</option>
<option value="Tech Support 3">Tech Support 3 $180.00 USD</option>
</select> </td></tr>
</tbody>
</table>
</div>
</body>
</html>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。