在您的新Angular6项目中,如果Bootstrap4和媒体查询不起作用,可能是由于以下几个原因导致的:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js"></script>
d-sm-none
类来隐藏在小屏幕设备上不需要显示的元素。bootstrap
和jquery
依赖。您可以使用以下命令来安装它们:npm install bootstrap jquery
安装完成后,您需要在angular.json
文件中的styles
和scripts
数组中添加相应的引用:
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.css"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js",
"node_modules/bootstrap/dist/js/bootstrap.min.js"
]
以上是解决Bootstrap4和媒体查询不起作用的一般步骤。如果问题仍然存在,您可以进一步检查浏览器的开发者工具,查看是否有任何错误或警告信息。另外,您还可以参考腾讯云提供的前端开发相关产品,如腾讯云Web+和腾讯云CDN等,以提高项目的性能和稳定性。
领取专属 10元无门槛券
手把手带您无忧上云