Angular Materials 不会将样式应用于组件

2023-12-06

这是一个简单的片段:

.profilebutton  {
  float: right;
}
<!-- PROFILE BUTTON -->
  <div class="col-md-4 profilebuttoncontainer">
    <button md-button [routerLink]="'/welcome/profile'" class="profilebutton">Profile</button>
  </div>

我究竟做错了什么?我一直在尝试使用 Angular Materials 设计工具栏、对话框、复选框的样式,但它们都不适用。我可以使用 mat-(无论什么)下的检查器更改样式,例如 mat-button、mat-dialog-container,这很有效,但如何将其转换为 css?看来我无权修改垫子(东西)

我想做的就是将 md 按钮粘贴到容器的右侧。超级简单。


您的代码应该按预期工作。请看下面的代码,

<div class="profilebuttoncontainer">
     <button md-button class="temp-class">Click me!</button>
</div>

注意:使用下面的行在组件级别添加样式表引用

styleUrls:[`....`]

现场演示

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular Materials 不会将样式应用于组件 的相关文章

  • 在 jQuery Mobile 中设置 Listview
  • 高度
  • 我正在尝试调整大小 li 在我的 jQuery 移动网站 listview 中 似乎无法在 CSS 中找到合适的类来执行此操作 我基本上调整了一些元素的大小 页眉和页脚等 我有五个 li li 按钮垂直堆叠 按钮和页脚下方有间隙 我只想设置
  • 位置固定,无顶部和底部

    我发现了有趣的功能 但找不到它发生的原因 所以 我们有固定位置元素 它位于 body 下方 第一个元素有样式 firstEl width 100 height 200px background color green 第二个元素有 fixe
  • 角度文件上传

    我是 Angular 的初学者 我想知道如何创建 Angular 5文件上传部分 我试图找到任何教程或文档 但我在任何地方都没有看到任何内容 有什么想法吗 我尝试过ng4 文件 https github com bonjurmrfirst
  • 父元素的 mousedown 事件中的 offsetX 和 offsetY 错误

    我在 mousedown 上获取 offsetX 时遇到问题 下面是我的代码 div Click the text The mouseDown function is triggered when the mouse button is p
  • JHipster:使用标准过滤实体 - 预期的 Angular 客户端方法

    我最近开始使用JHipster http www jhipster tech 感谢这个出色项目的维护者 在 JHipster 的当前版本 撰写本文时为 4 10 2 中 实体可以通过实体子生成器启用过滤 或者通过包含filter Entit
  • 角 2 材料容器固定不工作

    我对 CSS 和 Angular 2 材质有疑问 任何固定定位元素的行为都不像固定在 md sidenav container 内 如果它不在容器内 则它可以正常工作 这是该问题的链接 只需将 md toolbar 复制并粘贴到容器内部 您
  • 如何为带有标题图像的移动设备设置 HTML,该图像占据浏览器的整个宽度?

    我担心的是我必须为移动设备建立一个网站 概念中是将图像设置为标题 现在的问题是 不同的智能手机具有不同的显示分辨率 有例如840x560 480x320 或 800x480 我必须编写什么元标签 CSS 等才能使 每个 现代智能手机中的图像
  • 如何在 RxJS 中“等待”两个可观察值

    在我的应用程序中我有类似的东西 this personService getName id concat this documentService getDocument subscribe response gt console log
  • 使用 ngrx 时 Angular 4 解析未完成

    我正在尝试在我的应用程序的解析中使用 ngrx 但由于某种原因它不起作用 这就是我之前获得它的方式 在我的解析路由中使用一个简单的服务 resolve return this service getData map data gt data
  • 标题的固定高度和更改宽度(HTML 表格)

    我需要确保表格标题的高度是固定的 并且宽度是根据标题单元格内容进行调整的 标题文本最多显示两行 我们如何使用样式来做到这一点 另外 我想确保表行的宽度与标题行的宽度相同 即标题行决定宽度 注 目前 交易部门负责人别名 是按行排列的 它需要分
  • Bootstrap 4 行布局没有响应

    我正在使用 Bootstrap 4 在 MEAN 堆栈上为新闻文章布局创建一个 html 模板 但这应该不重要 对于这种总体布局的要求是 一篇 特色 文章位于其自己的列中 而其他 8 篇文章位于另一列中的两行中 当在较小的屏幕或移动设备上查
  • 文本区域下的额外填充

    我的文本区域下面有额外的填充 但我似乎找不到它的来源 我已将单独的代码放在此页面上 http jsfiddle net wfuks http jsfiddle net wfuks 我似乎找不到它的来源 它有类 field field bac
  • IE8/9 - CSS 文件的最大字节数

    我目前正在开发的应用程序有过多的 CSS 样式 我们似乎已经达到了 IE8 9 以及它可以加载的 CSS 数量的某种限制 在某些时候 它会停止解释 CSS 从而破坏某些页面上的样式 我们正在使用 Combres 来压缩 缩小导致 CSS 文
  • 角度2问题错误TS1068:意外的令牌。需要构造函数、方法、访问器或属性。应用程序/chat.component.ts

    当我运行 npm start 时遇到以下问题 app chat component ts 20 9 错误 TS1068 意外的令牌 需要构造函数 方法 访问器或属性 app chat component ts 47 1 错误 TS1128
  • 自动溢出的容器中不会出现滚动条(IE10、Windows Phone 8)

    我有一个容器 比方说div with overflow auto 其中的元素完全按照预期滚动 但不会出现典型的触摸滚动条 我尝试设置 ms overflow style auto明确地 但没有任何改变 浏览器 IE10 设备 Windows
  • LESS CSS 在媒体查询中设置变量?

    我正在开发一个专门针对 iPad 的网站 为了使我的网站能够在视网膜显示屏 iPad 和旧版本 iPad 上运行 我想在媒体查询中的 LESS CSS 中设置一个变量 例如 media all and max width 768px rat
  • Angular 8 webpack-bundle-analyzer 寻找错误的polyfill 文件

    无论我做什么 构建项目后我都会收到以下错误 Error parsing bundle asset
  • Bootstrap下拉菜单文本颜色

    所以我第一次使用 Twitter 的 Bootstrap 我试图在下拉菜单折叠后更改其文本的颜色 如果有道理的话 I used 当您压缩网页以显示折叠菜单并转到下拉列表时 您会看到蓝色背景转移到下拉菜单项 但字体颜色为黑色 使其很难阅读 我
  • 如何显示不同页眉的页面? [关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 我正在为我的学校项目开发网站 但我遇到了一个问题 我在每个页面上显示一个标题 我的标题之一包含登录表单 另一标题包含用户名 搜索栏等 问题是
  • 使用带有箭头的 MaterializeCSS 轮播 - 如何使用普通 javascript 进行初始化

    我正在尝试使用 MaterializeCSS 创建带有箭头的轮播 我正在尝试使用这个代码笔 https codepen io Paco Cervantes pen ZLxKpj取得有限的成功 我想使用普通的 javascript 而不是 j

随机推荐