angular组件样式修改不成功！

自己定义的css可以成功

组件的不行

style在模板字符串里 直接没有

class 是显示的 但是样式不生效

加上面 即可，为什么？我也不太清楚。有知道答案的请回复，万分感激

- - - - -- - -- - - -- - -- -- -- - --- -- - - --- -- - -- -- - - -- - -- - -- - ------------------------------------------------------------------------------------------------

官网看的不仔细的我又稍微看了下

:host 选择是是把宿主元素作为目标的唯一方式。除此之外，你将没办法指定它， 因为宿主不是组件自身模板的一部分，而是父组件模板的一部分。

要把宿主样式作为条件，就要像函数一样把其它选择器放在 :host 后面的括号中。

angular -——组件样式修改不成功的更多相关文章

  1. 解决vue中element组件样式修改无效

    vue中element组件样式修改无效 <style> .detail{ .el-input__inner { height: 48px; } } </style> 直接写st ...

  2. material UI中子组件样式修改的几种方案研究

      material UI是一个流行的与React配套的前端UI框架,对于开发者而言,熟悉它的样式修改方案是必要的.但目前相关资料并不直观,并且没有总结到一起.如果对相关特性不太清楚,开发者很可能会在 ...

  3. elementUI默认样式修改不成功的问题

    问题: login.vue中引入<style lang="postcss" src="./login.css" scoped></style& ...

  4. sencha touch 扩展篇之使用sass自定义主题样式 （下）通过css修改官方组件样式以及自定义图标

    上一讲我们讲解了如何使用官方的api来修改主题样式,这讲我们继续讲解sass的样式修改, 编译官方自带的主题包  在生成的项目以及官方sdk的目录下,自带了一些主题sass包,我们也可以通过修改sas ...

  5. vue中修改子组件样式

    一.问题叙述 项目里需要新添加一个表单页面,里面就只是几个select,这个几个select是原本封装好的组件,有自己原本的样式,而这次的原型图却没有和之前的样式统一起来,需要微调一下,这里就涉及到父 ...

  6. 【Angular】关于angular引用第三方组件库无法改变其组件样式 :host ::ng-deep

    [Angular]关于angular引用第三方组件库无法改变其组件样式 :host ::ng-deep css修改:无效 .ant-input-affix-wrapper .ant-input:not ...

  7. vue scoped 穿透_vue 修改内部组件样式问题

    何为scoped? 在vue文件中的style标签上,有一个特殊的属性:scoped.当一个style标签拥有scoped属性时,它的CSS样式就只能作用于当前的组件,也就是说,该样式只能适用于当前组 ...

  8. vue组件中的样式属性：scoped，解决在父组件中无法修改子组件样式问题

    Scoped CSS规范是Web组件产生不污染其他组件,也不被其他组件污染的CSS规范. vue组件中的style标签标有scoped属性时表明style里的css样式只适用于当前组件元素,它是通过使 ...

  9. vue+Elment-UI，修改element组件样式

    在用vue开发项目过程中,我们总是避免不了的会使用到elementUI,它里面提供的一些组件都为我们的开发带来了很大的便利,但是,当有时候我们需要使用这些组件的同时又要修改下组件的UI样式的话,我们该 ...

随机推荐

  1. spring-mvc基于注解的配置

    将配置文件修改为: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="htt ...

  2. labview线程相关

    两个结论.     1. 在 LabVIEW 上编写多线程程序非常方便,我们应该充分利用这个优势.一般情况下,编写程序时应当遵循这样的原则:可以同时运行的模块就并排摆放,千万不要用连线,顺序框等方式强 ...

  3. [LC] 295. Find Median from Data Stream

    Median is the middle value in an ordered integer list. If the size of the list is even, there is no ...

  4. jQuery中的bind(), live(), on(), delegate()

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  5. [LC] 17. Letter Combinations of a Phone Number

    Given a string containing digits from 2-9 inclusive, return all possible letter combinations that th ...

  6. ！！误解--var vm = new vue({}) 与 export default {} 是一回事儿？？

    这两者完全不是同一回事.export default {} 是es6的module中的语法, 而var vm = new vue({}) 是创建一个vue实例.引起误解是因为用了webpack开发vu ...

  7. JFreeChart插件使用

    以java project为例,首先需要导入需要的jar包:jcommon-1.0.23.jar, jfreechart-1.0.19.jar. 画饼状图示例: package com.it.jfch ...

  8. 对这些工程师来说，Skype Translator是他们自己的事——Skype Translator项目研发团队的故事

    Translator是他们自己的事--Skype Translator项目研发团队的故事" title="对这些工程师来说,Skype Translator是他们自己的事--Sky ...

  9. Python---9高级特性

    一.切片 取一个list或tuple的部分元素是非常常见的操作.比如,一个list如下: >>> L = ['Michael', 'Sarah', 'Tracy', 'Bob', ' ...

  10. 本地开启https服务

    ### ##自签名证书 ##配置Apache服务器SSL ##自己作为CA签发证书 ###这里是OpenSSL和HTTPS的介绍 OpenSSL HTTPS 开启HTTPS配置前提是已在Mac上搭建A ...