跟着慕课网的课程学习Angular,简直要被bootstrap的问题整死了,样式一直出不来,导航完全没有背景颜色。。

我在网上找了很多都试了,以下方法特别受用

1、把

"../node_modules/bootstrap/dist/css/bootstrap.css"

"../node_modules/jquery/dist/jquery.js",
"../node_modules/bootstrap/dist/js/bootstrap.js"

全部换成:

"node_modules/bootstrap/dist/css/bootstrap.css"

"node_modules/jquery/dist/jquery.js",
"node_modules/bootstrap/dist/js/bootstrap.js"

仔细看目录结构,它和src是在同一个目录的,所以不用返回上一层,改了这里样式出现了一点点,但是还是没用颜色

2、在网上找了很多答案后知道,bootstrap v3和v4的版本不一样,所以我们默认安装的是v4的,再用v3的样式就会不兼容

重新安装bootstrap v3:

npm install  bootstrap@3.3.7  --save

这个版本参考原博主

然后就perfect了!!!

angular关于Bootstrap样式不起作用问题的更多相关文章

  1. Angular中innerHTML标签的样式不起作用详解

    1.背景 在最近angular的项目中,需要用到[innerHTML]标签来指定一个div的样式: //HTML部分 <div class="contents" [inner ...

  2. Angular中使用bootstrap样式

    Angular中使用bootstrap样式 Angular中引入bootstrap的方法   方法1:在Angular.json中的styles数组中添加bootstrap路径 如下所示: " ...

  3. Angular.js+Bootstrap实现手风琴菜单

    说是Angular.js+Bootstrap实现手风琴菜单,其实就是用了Bootstrap的样式而已. 上一篇实现了表格+分页,接着学习实现的Demo. 主要练习自定义指令,向指令中传递参数,老规矩先 ...

  4. Yii2框架bootstrap样式理解

    Yii2框架默认採用了bootstrap作为CSS风格,各种视图类组件都如此.之前一直採用默认风格,并在必要的时候加入或者改动一下class来达到目的.但在改版Yii1.1的orange项目时.发现之 ...

  5. Bootstrap里的文件作用

    Bootstrap里的文件分别表示什么?都有什么用? bootstrap.css bootstrap.min.css bootstrap-responsive.css bootstrap-respon ...

  6. jqgrid+bootstrap样式实践

    jqgrid+bootstrap样式实践,报错数据加载,选中,删除等功能 需要引入的样式 bootstrap.min.css ui.jqgrid.css 需要引入的JS jquery.min.js b ...

  7. 前端 angular 和 bootstrap 的安装步骤

    1.安装bower模块: npm install -g bower --registry=http://registry.npm.taobao.org 2.创建.bowerrc 文件存放 前端相关的模 ...

  8. 从覆盖bootstrap样式谈css选择器优先级

    样式优先级 首先简单说几个定义样式的方式: 元素内嵌: <li><a href="" style="color:#ffffff;">SH ...

  9. 自定义bootstrap样式-9行样式自定义漂亮大气bootstrap导航栏

    有人说前端发展太快,框架太多,各有所需,各有所长.看看这幅图,估计都知道这些框架,但是大部分公司中实际要用到的也就那么几个. 发展再快,框架再多.还是得回到原点,不就是Html+Css+JavaScr ...

随机推荐

  1. 关于dfs的套路

    void dfs(答案, 搜索层数, 其他参数) { if (层数==maxdeep) { 更新答案 return; } (剪枝) for(下一层可能的状态){ 更新全局变量表示的状态的变量 dfs( ...

  2. 信息收集框架——recon-ng

    背景:在渗透测试前期做攻击面发现(信息收集)时候往往需要用到很多工具,最后再将搜集到的信息汇总到一块.          现在有这样一个现成的框架,里面集成了许多信息收集模块.信息存储数据库.以及报告 ...

  3. java多线程基础(二)--java线程各状态关系

    注意只有可运行(就绪态)和运行中(运行态)可以相互转换

  4. 5月29日 Java性能调优指南 读后感

    并行垃圾收集器 串行垃圾收集器 并发标记清除(CMS)垃圾收集器 Garbage First(G1)垃圾收集器 没有深入的学习G1的原理,只是看了大概的思想; SA工具:待学习

  5. Java 复制PDF文档的2种方法

    本文将介绍通过Java程序来复制PDF页面,包括: 跨文档复制,即从文档1复制到文档2 在同一文档内复制,即从页面A复制到页面B 使用工具:Free Spire.PDF for Java (免费版) ...

  6. JVM调优之经验

    在生产系统中,高吞吐和低延迟一直都是JVM调优的最终目标,但这两者恰恰又是相悖的,鱼和熊掌不可兼得,所以在调优之前要清楚舍谁而取谁.一般计算任务和组件服务会偏向高吞吐,而web展示则偏向低延迟才会带来 ...

  7. h5微信浏览器复制粘贴--ios兼容问题的解决方法(clipboard.js插件)

    前段时间在做微信h5的时候,遇到了ios兼容,使用clipboard.js插件完美解决 下载地址:下载地址: https://github.com/zenorocha/clipboard.js cnd ...

  8. Spring aop注解失效

    问题 在spring 中使用 @Transactional . @Cacheable 或 自定义 AOP 注解时,对象内部方法中调用该对象的其他使用aop机制的方法会失效. @Transactiona ...

  9. Kafka监控工具汇总

    对于大数据集群来说,监控功能是非常必要的,通过日志判断故障低效,我们需要完整的指标来帮我们管理Kafka集群.本文讨论Kafka的监控以及一些常用的第三方监控工具. 一.Kafka Monitorin ...

  10. idea设置docker远程插件

    简介 docker都是通过命令来操作容器,使用idea插件可以减少重复命令输入等. 使用步骤 Idea内安装插件 打开Idea,Preferences | Plugins 进入插件安装界面,在搜索框中 ...