Bootstrap表单的input框为什么没样式?

子谦(打工版) 阅读 4

我用Bootstrap 5写了个简单表单,但input框看起来就是原生样式,完全没有Bootstrap的默认边框和圆角。我已经引入了bootstrap.min.css,也按文档加了form-control类,可还是没效果。

这是我的代码:

<form>
  <div class="mb-3">
    <input type="text" class="form-control" placeholder="请输入内容">
  </div>
</form>

是不是漏了什么依赖?还是类名写错了?实在搞不懂为啥样式不生效……

我来解答 赞 1 收藏
二维码
手机扫码查看
2 条解答
FSD-文雅
看起来你引入了 bootstrap.min.css 但样式还是没生效,可能是路径或者加载顺序的问题。先检查一下你的 bootstrap.min.css 是否正确加载了,可以通过浏览器的开发者工具看下是否有404错误。确保 bootstrap.min.css 的路径是正确的,并且放在 标签里。

如果路径没问题,代码逻辑上没发现明显问题,可以试试把 form-control 类加在 标签上是正确的,但为了保险起见,可以优化成这样:








确保这段代码没有被其他CSS覆盖掉,可以在浏览器里检查一下 input.form-control 的样式是否被其他样式影响了。如果还是不行,可以尝试清除浏览器缓存或者换一个浏览器看看。有时候浏览器缓存会捣乱。
点赞
2026-03-22 16:12
国凤 ☘︎
检查一下你引入的bootstrap.min.css路径对不对,有时候路径错了或者文件没加载上,样式就不会生效。还有,确保你的HTML结构没问题,class名写得没错。你这段代码看起来没问题,所以问题可能出在引入CSS的地方。可以试试在浏览器里打开开发者工具,看看有没有404错误或者css文件加载失败的信息。如果路径没问题,那就再检查一下是不是有其他CSS覆盖了Bootstrap的样式,可以用浏览器的开发者工具看下具体的样式应用情况。
点赞
2026-03-22 15:04