跟着慕课网的课程学习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. 最简单的DWR例子

    什么是DWR? DWR是一个Open Source的 java项目.DWR可以让JavaScript调用运行在Web服务器里面的JAVA程序.简单一点或者专业一点就是Easy AJAX for JAV ...

  2. Java——标准异常

    Throwable这个java类被用来表示任何可以作为异常被抛出的类,Throwable可以分为两种类型,Error用来表示编译时和系统错误,Exception是可以被抛出的基本类型. 1.Runti ...

  3. javaScript今日总结

    javascript简单介绍ECMAScript 1.语法 2.变量:只能使用var定义,如果在函数的内容使用var定义,那么它是一个局部变量,如果没有使用var它是一个全局的.弱类型! 3.数据类型 ...

  4. Flutter学习笔记(21)--TextField文本框组件和Card卡片组件

    如需转载,请注明出处:Flutter学习笔记(21)--TextField文本框组件和Card卡片组件 今天来学习下TextField文本框组件和Card卡片组件. 只要是应用程序就少不了交互,基本上 ...

  5. Django上线部署之Apache

    环境: 1.Windows Server 2016 Datacenter 64位 2.SQL Server 2016 Enterprise 64位 3.Python 3.6.0 64位 4.admin ...

  6. js全选与取消全选

    实现全选与取消全选的效果 要求1(将军影响士兵):点击全选按钮,下面的复选框全部选中,取消全选按钮,下面的复选框全部取消 思路:复选框是否被选中,取决于check属性,将全选按钮的check属性值赋值 ...

  7. 图数据库 Nebula Graph 的数据模型和系统架构设计

    Nebula Graph:一个开源的分布式图数据库.作为唯一能够存储万亿个带属性的节点和边的在线图数据库,Nebula Graph 不仅能够在高并发场景下满足毫秒级的低时延查询要求,而且能够提供极高的 ...

  8. 我是如何学习写一个操作系统(二):操作系统的启动之Bootloader

    前言 今天本来的任务看书和把之前写的FragileOS整理一下,但是到现在还在摸鱼,书也只看一点.后来整理了一下写这个系列的思路,原本的目的是对操作系统原理性的学习和对之前写的一个玩具型操作系统的回顾 ...

  9. Docker搭建Zookeeper&Kafka集群

    最近在学习Kafka,准备测试集群状态的时候感觉无论是开三台虚拟机或者在一台虚拟机开辟三个不同的端口号都太麻烦了(嗯..主要是懒). 环境准备 一台可以上网且有CentOS7虚拟机的电脑 为什么使用虚 ...

  10. 玩转 SpringBoot 2 快速搭建 | IntellJ IDEA篇

     IntellJ IDEA 介绍  IntelliJ IDEA 简称 IDEA,目前被认为是最好用的开发Java 语言开发工具之一.不过是收费的.和其同类型的工具有 Eclipse 和 MyEclip ...