使用bootstrap注意事项

最新推荐文章于 2021-09-10 17:05:41 发布

「已注销」

最新推荐文章于 2021-09-10 17:05:41 发布

阅读量268

点赞数

分类专栏：前端笔记文章标签： bootstarp

本文链接：https://blog.csdn.net/liangfu8023/article/details/81675075

版权

前端笔记专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1、导入js,css文件

<link rel="stylesheet" href="${pageContext.request.contextPath }/css/bootstrap.css">
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/bootstrap-theme.css">

<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/bootstrap.js"></script>

注：（1）jquery-3.3.1.min.js放在bootstrap.js前面
    （2）图片轮播要单独引入carousel.js文件
    （3）下拉菜单不支持1.8的jquery

2.bootstrap图标加载不出来
解决：glyphicons-halflings-regular.woff报404错notfound
glyphicons-halflings-regular.ttf报404错notfound
glyphicons-halflings-regular.woff2报404错notfound
当我检查js和css文件引入都没问题时，发现还是加载不出来那三个文件
添加fonts文件夹和文件，依然提示该错误，但是直接访问*.css文件就没问题。
想起静态资源的调用是通过tomcat手动配置的。
解决办法：在web.xml中配置，静态文件的引入

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.ttf</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.woff</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.woff2</url-pattern>
</servlet-mapping>