禁用角度材质的主题样式
是指在前端开发中，通过禁用角度材质（Angular Material）库所提供的主题样式，以自定义或覆盖默认样式。
角度材质是一个由Angular团队开发的UI组件库，它提供了一套现成的、美观的UI组件和样式，可以帮助开发者快速构建现代化的Web应用程序。然而，在某些情况下，开发者可能需要根据项目需求自定义样式，或者使用其他UI库的样式，这时就需要禁用角度材质的主题样式。
禁用角度材质的主题样式可以通过以下步骤实现：
- 引入角度材质库：在项目中引入角度材质库，可以通过npm包管理工具进行安装，或者直接引入CDN链接。
- 禁用主题样式：在项目的样式文件中，可以通过CSS选择器或者Sass变量的方式禁用角度材质的主题样式。具体的禁用方式取决于项目的具体需求和使用的样式预处理器。
- 自定义样式：禁用主题样式后，开发者可以根据项目需求自定义样式。可以通过修改CSS样式文件或者使用Sass等预处理器来实现。
禁用角度材质的主题样式的优势在于可以灵活地控制项目的外观和样式，满足项目的特定需求。同时，禁用主题样式也可以减小项目的体积，提高加载速度。
禁用角度材质的主题样式适用于各种Web应用程序开发场景，特别是那些需要高度定制化外观和样式的项目。例如，企业级管理系统、电子商务平台、社交媒体应用等。
腾讯云提供了丰富的云计算产品和服务，可以帮助开发者构建和部署各种类型的应用程序。在禁用角度材质的主题样式的情况下，腾讯云的相关产品和服务可以包括：
- 云服务器（CVM）：提供可扩展的虚拟服务器实例，用于部署和运行Web应用程序。
- 云数据库MySQL版（CDB）：提供高性能、可靠的关系型数据库服务，用于存储和管理应用程序的数据。
- 云存储（COS）：提供安全可靠的对象存储服务，用于存储和管理应用程序的静态资源文件。
- 人工智能（AI）：腾讯云提供了丰富的人工智能服务，如图像识别、语音识别、自然语言处理等，可以为应用程序添加智能功能。
- 云原生应用服务（TKE）：提供容器化应用程序的部署和管理服务，可以帮助开发者快速构建和扩展应用程序。
以上是一些腾讯云的相关产品和服务，更详细的产品介绍和使用方法可以参考腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
如何创建角度材质组件形状的主题？
、、、、
有没有办法在angular材质中创建组件形状的主题？我知道material设计有一个形状概念，允许你为所有的小/中/大组件创建更多的圆角，较少的圆角，甚至是切角。有没有办法在angular材质中实现这一点？
如果不是，那么在angular材质中全局定制组件的最佳方式是什么？假设我想去掉所有<mat-button>上的圆角？
浏览 17提问于2019-07-15得票数 5
回答已采纳
在这个中，我有一个背景图像，它通过CSS规则background-size:cover;覆盖了整个视区。
但是，只需包含角度材质CSS文件即可更改此行为，如您在链接插入器中所看到的那样，这样图像就不会停留在视口上，而是随页面内容一起滚动。
是什么导致了这种变化，我们如何在使用角度材料的同时恢复旧的行为？
浏览 2提问于2016-07-06得票数 1
1回答
我最近偶然发现了。但是，主题文件似乎没有自动包含在基本的角材料. are文件中。
为此，我必须手动包含我想要使用的所有颜色主题.
如果有人有这方面的经验，你知道这是一个错误，还是这是故意的。
下面是我正在使用的代码的链接。当页面运行时，所有非默认的md主题的进度循环项目都不会加载。位于角材质/主题/处的CSS文件不会自动加载。
浏览 1提问于2014-11-28得票数 4
回答已采纳
我最近在我的angular项目中添加了angular材质，但在将@angular/material添加到我的项目后不久，animate.js提供的一些动画就停止工作了。 有没有什么方法可以让animate.js和angular材质一起工作？ 控制台错误： Module build failed: Error: ENOENT: no such file or directory, open 'node_modules/zone.js/dist/zone-evergreen.js' 但我确实在那个路径上有那个文件。
浏览 39提问于2021-01-09得票数 0
2回答
我在我的angular 10项目中使用了angular材质10.2.5。我通过添加下面这一行来包含主题
@import '@angular/material/prebuilt-themes/deeppurple-amber.css';
在我的style.css中，我创建了一个组件，并使用了一个原色的材质按钮，但我的按钮颜色并未应用。
<button mat-button color="primary">Toogle</button>
按钮颜色必须为蓝色
有什么想法吗？
浏览 0提问于2020-10-27得票数 0
2回答
我正在使用新的Gui生成器，并希望在一个按钮中更改材质图标的颜色和大小。
有办法这样做吗？我找不到任何相关的网络和改变按钮的字体颜色似乎不会影响图标的颜色.
提前谢谢。
到目前为止，我拥有的是css样式：
mybutton {
background-color: lightgray;
border-radius: 4pt;
border: none;
box-shadow: 2pt 2pt 2pt 0px gray;
color: #ff0000;
font-family: "native:MainRegular";
浏览 4提问于2017-08-15得票数 1
回答已采纳
有没有办法改变Angular Material元件库中mat-slide-toggle元件的颜色属性？如何覆盖它的样式？
或者有没有人能建议我在angular 5中使用其他的滑动切换，比如材质滑动切换？
浏览 15提问于2018-06-13得票数 21
我使用的是Angular 8和angular material的最新版本。我有一个mat表单字段，选择正在工作等，但样式没有，它覆盖了我的文本，只有选定的文本应该去的地方。 这是图片：https://ibb.co/0YNs21L 在控制台中，我没有警告说没有包含angular材质主题，这是iI输入angular css主题的angular.json文件 <mat-form-field>
<mat-label>Select an option</mat-label>
<mat-select [(value)]="selected
浏览 11提问于2019-09-03得票数 0
我在我的angular项目中使用了和。我想改变mat-menu的位置。此外，我还使用以下代码片段添加到.scss文件中。
::ng-deep .cdk-overlay-pane {
transform: translate(78%, 10%);
}
但是，这也会导致我对话框面板位置发生变化。我向mat-menu添加了类，并尝试做同样的事情，结果没有什么不同。
<mat-menu #menu="matMenu" class="kebab-mat-menu" >
<button mat-menu-
浏览 1提问于2021-06-09得票数 0
1回答
我正在使用Angular 8和angular材质，虽然我已经导入了angular.json中包含的styles.css中的angular material css，但是Angular material CSS仍然没有加载到我的组件上(组件是延迟加载的)
这是我的angular.json代码，你可以检查我已经包含了styles.css
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectR
浏览 4提问于2019-10-31得票数 0
1回答
角度材料性能差，内存占用大：
Issue: When added md-input-container to a page, the number of $watchers increased from 6504 to 112507?, by total 17 times more than without the angular material tag* md-input-container和$mdDialog都会导致内存泄漏在Chrome中加载角度材料页面慢4倍，在IE中几乎无法加载。‘预期的行为是什么？期望Angular material应用程序与angular only应用程序执行类
浏览 0提问于2017-08-17得票数 1
1回答
未选中时，我尝试用background-color: gray填充Angular Material Checkbox，选中时，用background-color: red填充。 这是我已经尝试过的： mat-checkbox:not(.mat-checkbox-checked) .mat-checkbox-layout .mat-checkbox-background {
background-color: #C3C3C3;
}
mat-checkbox.mat-checkbox-checked .mat-checkbox-layout .mat-checkbox-background
浏览 26提问于2020-07-22得票数 1
回答已采纳
1回答
What the webpage looks like 因此，我正在尝试创建一个下拉列表，但当单击该下拉列表时，它显示的不是与其他输入重叠，而是在屏幕底部。 下面是相关的HTML代码块： <div class="form-row">
<!-- Grid column -->
<div class="col-md-6">
<mat-form-field>
浏览 15提问于2019-10-14得票数 0
我正在尝试添加材料设计到jhipster生成的网关。尽管它似乎在工作，但我在控制台上得到了这个警告；
Could not find Angular Material core theme. Most Material components may not work as expected. For more info refer to the theming guide: https://material.angular.io/guide/theming
Could not find HammerJS. Certain Angular Material components may not w
浏览 1提问于2017-07-04得票数 2
1回答
当我们从一个步骤切换到另一个步骤时，有没有办法禁用Angular材质的mat-stepper控件的动画？
浏览 7提问于2018-08-02得票数 12
回答已采纳
1回答
我想给定义在片段中的按钮上色。我创建了新的样式(我将其用作按钮中的主题)，并为启用状态定义了"colorAccent“，为禁用状态定义了"colorButtonNormal”，此样式的父样式为"Widget.AppCompat.Button“。我希望它的颜色完全一样，它是写在colorButtonNormal时，按钮是禁用的。
<style name="Material.Button.Primary" parent="@style/Widget.AppCompat.Button">
<item n
浏览 0提问于2019-05-16得票数 0
为了更好的使用芯片和ChipGroup，我在manifests.xml中设置了应用样式扩展Theme.MaterialComponents，然后ElegantNumberButton中的"+“和"-”颜色就变成了before after 这是我的风格(在使用MaterialComponents之后)： <style name="AppTheme" parent="Theme.MaterialComponents.Light">
<!-- Customize your theme here. -->
浏览 4提问于2020-04-06得票数 0
回答已采纳
1回答
我在使用Angular Material的MatTabsModule时遇到过这种奇怪的行为。标签标题拉伸当我点击一个标签时，虽然我在控制台中没有错误。
app.html
<nav mat-tab-nav-bar>
<a mat-tab-link>
Tab1 (click me to see the bug)
</a>
<a mat-tab-link>
Tab2
</a>
</nav>
我再说一遍，控制台中没有错误。我的依赖项是：
"dependencies": {
&
浏览 1提问于2018-02-06得票数 4
回答已采纳
1回答
目前我的项目是使用“手写笔”CSS预处理器，而不是SCSS，我想使用角度材料主题和切换主题。我可以使用SCSS编写所有文档，但不能使用手写笔，如果可以使用Angular 5+ Angular material + stylus实现Angular材质切换主题逻辑，有人能帮我吗？请帮助我提供任何文档或示例
浏览 2提问于2018-06-29得票数 4
我用angularjs开发了一个项目，并用angular材料设计了它。当我在我的项目中使用md-autocomplete时，我遇到了一个突出显示文本的问题。突出显示的文本不能正确显示。我试着修改，但失败了。我从angular material官网复制了md-autocomplete代码，并对其进行了修改。我的代码是
<div layout="row">
<div flex="50">
<md-autocomplete flex required
浏览 5提问于2017-08-03得票数 1
1回答
我正在尝试创建一个简单的mat-select，这是我在一个组件中指定代码的方式：
<mat-form-field>
<mat-select>
<mat-option>First Option</mat-option>
<mat-option>Second Option</mat-option>
</mat-select>
</mat-form-field>
这是我的app.component.ts的样子：
import { BrowserModule
浏览 10提问于2020-05-18得票数 1
回答已采纳
3回答
<com.google.android.material.button.MaterialButton
android:id="@+id/button_tour"
app:cornerRadius="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginHorizo
浏览 1提问于2019-12-03得票数 5
回答已采纳
1回答
对于角度材质主题，是否必须选择仅亮或暗？我已经检查了最新的角度材质工具：
它显示了三个选项，亮、暗，以及一个没有亮或暗的选项。
但当我访问mat-heme.scss时，我似乎只能选择‘mat-light- to’或‘mat-dark-to’。就像ColorPicker显示的那样，有没有亮或暗的选择？
浏览 0提问于2019-03-29得票数 0
4回答
如何改变机器人材质按钮的拐角半径。我试过设置拐角半径，但不起作用。
<com.google.android.material.button.MaterialButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:background=
浏览 3提问于2020-06-18得票数 1
回答已采纳
我试图在指令的链接函数中放入一个。从概念上讲，我不明白为什么这是不可能的。根据文档，$mdDialog.show位于一个作用域中，而$mdDialog.hide();位于由$mdDialog.show对象定义的控制器中。我已经能够使对话框弹出-尽管closeModal()会执行(我可以从console.log看出)，但$mdDialog.hide()不会执行，模式也不会隐藏。
angular.module('app', ['ngMaterial'])
.directive('addLayer', ['$mdDialog',
浏览 0提问于2015-06-09得票数 5
回答已采纳
1回答
我知道你可以改变为黑暗主题，轻主题或火虫火狐量子。但我有它的黑暗主题，但不喜欢颜色主题语法的主题。是否有办法将其改为Monokai或材质配色方案？
谢谢
浏览 5提问于2017-11-22得票数 1
回答已采纳
1回答
我有一点担心，到目前为止我还没能解决。我正在尝试启用一个材质工具提示，它是由Angular在Angular的材质图标上提供的。所以，我尝试了我在网上找到的多种东西，但都不能解决我的问题。我已经尝试在一个普通的按钮上应用mattooltip，对于按钮它工作得很好，所以我在导入模块和其他东西上绝对没有问题。唯一不起作用的是材质图标上的工具提示。也许你有一个解决方案的想法，我想我遗漏了一些非常简单的东西，但我不能弄明白……
以下是我到目前为止在图标上启用它的尝试：
<span class="material-icons" matTooltip ="TEST"&g
浏览 1提问于2021-01-18得票数 0
1回答
我正在使用primeng创建一个带有选项卡的对话框，这是我的模板：
<p-dialog [(visible)]="displayDialog" (onHide)="cancel()" [style]="{width: '50vw'}" [baseZIndex]="10000">
<p-tabView [controlClose]="displayDialog">
<p-tabPanel header="Header 1" [headerSty
浏览 2提问于2021-08-25得票数 0
回答已采纳
16回答
谁知道如何在Angular材质中更改无纺布的颜色？覆盖css不起作用。我尝试在材质文件中更改颜色，但它们只能导入，我不能在那里更改任何内容。我希望它是我的自定义颜色，而不是来自预置主题的颜色。
浏览 4提问于2018-02-14得票数 46
如何在NavigationView中更改字幕textAppearance？对于NavigationView材质组件。这里是文档：https://material.io/components/navigation-drawer/android#anatomy我认为没有办法改变它，但让我们试一试。
浏览 23提问于2021-02-05得票数 0
回答已采纳
我在我的应用程序中使用材料设计主题，API more和equal 21没有问题。但是对于API < 21，我有一些关键的问题，这些问题无法解决。
对于< 21接口，我使用AppCompat主题来获得素材主题效果。
让我们看一下Button示例：
<ImageButton
android:id="@+id/buttonShare"
android:layout_width="match_parent"
android:layout_height="60dp"
an
浏览 1提问于2017-10-22得票数 0
问题陈述:我正在实现Angular材质的mat-form-field属性。我将表单域外观作为轮廓。当选择输入时，我正在尝试更改输入边框的颜色。
预期行为。选择输入时，输入字段的轮廓边框颜色应该会更改。当表单域处于活动状态时，我想将轮廓的颜色更改为黑色。
当前行为:现在，当表单域处于活动状态时，它会显示角度材质的默认原色。
这些都是我的依赖
{
"dependencies": {
"@angular/animations": "^6.1.9",
"@angular/cdk": "^6.4.7&#
浏览 0提问于2018-10-15得票数 3
从Theme.AppCompat.Light更改为Theme.MaterialComponents.Light后
<style name="myRadioButtonTheme" parent="Theme.MaterialComponents.Light"> <!-- Theme.AppCompat.Light -->
<item name="colorControlNormal">@color/radio_bt_color</item>
<item name
浏览 8提问于2020-02-14得票数 1
1回答
我正在使用角度渲染引擎来渲染材质组件。但是当我呈现控件(在我的case Cards => mat-card中)时，它们没有任何样式。所以prebuilt-themes(node_modules\@angular\material\prebuilt-themes自带的所有东西)。
当我手动添加卡片时，=>
<mat-card> test</mat-card>
并在渲染过程中设置类属性，它工作于=>
renderer.setAttribute(matCard , "class", "mat-card");
所
浏览 12提问于2018-02-14得票数 2
回答已采纳
我尝试在css中添加背景颜色，用于角度材质日期选择器中的日历图标。我没有得到任何改变。
<mat-form-field class="mr3">
<input matInput [matDatepicker]="startdate" placeholder="Choose a date">
<mat-datepicker-toggle matSuffix [for]="startdate"></mat-datepicker-toggle>
<mat-da
浏览 3提问于2019-06-21得票数 0
2回答
很长时间的读者，第一次的海报。我想有一个材料汉堡包转换为"X“时，单击，然后转换回来时，再次单击在一个角度应用程序。网站显示有我想要的动画，但没有关于如何做的文档。
我尝试了CSS方法，但它不显示，这将是很好的保持项目与材料图标一致。
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls=
浏览 1提问于2019-06-19得票数 2
我正在尝试想办法让我的独立/可重用组件库在Angular中使用应用程序的材质主题。更具体地说，我尝试访问组件中的主题颜色，以便可以根据主题是亮还是暗来设置边框颜色。
浏览 2提问于2017-08-01得票数 1
回答已采纳
3回答
IE-11和IE-edge浏览器的角度材质有一个问题，
当正文内容垂直滚动时，angular meterial会在选择框周围显示黑色边框，如下图所示。
这也是重现问题的代码笔。
<md-input-container> <label>State</label> <md-select ng-model="ctrl.userState"> <md-option ng-repeat="state in ctrl.states" value="{{st
浏览 0提问于2016-06-30得票数 0
我一直在经历间歇性超时，这在量角器常见问题解答中被归咎于使用$timeout进行轮询(也就是waitForAngular超时)。我想知道它是否也失败了，在它不是轮询的情况下。对于我的团队来说，随着我们依赖于角度材料组件，它变得更加清晰。它们大量使用$timeout(func，0)进行动画交互。此问题类似于，但侧重于角度材料和量角器之间可能存在的问题。我真的很想知道大量使用Angular Material和Protractor的人是如何处理这些问题的，如果他们遇到这些问题的话。
有趣的是，我没有在量角器和角度材料github站点中看到任何彼此功能的利用。由于它们都是来自谷歌同一组的Angular
浏览 2提问于2015-04-30得票数 27
我想改变材质TextInputEditText的气泡和光标的颜色。我试了一下colorAccent，android:textCursorDrawable --这些都不能正常工作。
浏览 0提问于2019-02-01得票数 7
回答已采纳
1回答
角度材质主题问题
、、、
我在我的项目中使用了角度材质。我已经使用了侧面导航栏和步进器，但它们看起来不像在演示中那样。我已经导入了scss文件中所需的CSS主题。请找到下面的代码，
formstepper.component.html
<button mat-raised-button (click)="isLinear = !isLinear" id="toggle-linear">
{{!isLinear ? 'Enable linear mode' : 'Disable linear mode'}}
</button&g
浏览 0提问于2018-11-06得票数 1
1回答
我有一个简单的Framework7应用程序，我正在尝试谷歌材料设计，除了图标和涟漪效果(当用户点击可点击的元素时的视觉效果)之外，所有的东西都可以工作。图标根本不会显示，并且涟漪效果看起来就像iOS一样。我按原样包含了framework7 css和framework.min.js文件(版本1.5.3)。是否需要重新编译JS文件？
这是我的app.js：
// Initialize app
var myApp = new Framework7();
// If we need to use custom DOM library, let's save it to $$ varia
浏览 26提问于2017-02-25得票数 0
回答已采纳
1回答
当我通过http调用=>得到一个错误时，我正在尝试显示一个快餐栏。 constructor(
private actions$: Actions,
private getuserService: UserService,
private snackBar: MatSnackBar
) { }
@Effect()
getUser$ = this.actions$.pipe(
ofType<featureActions.getUser>(featureActions.ActionTypes.getUser),
swi
浏览 25提问于2019-05-24得票数 0
回答已采纳
1回答
我将angular material升级到6.0.2，我想使用badge功能，但它没有显示在我的页面中。包配置如下所示：
{
"name": "my.angular",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
浏览 0提问于2018-05-19得票数 10
回答已采纳
如何避免模式框在单击模式框内复选框时闪烁
<time-checkbox name="show" id="show" class="form-checkbox" >Show</time-checkbox>
我试过了，它不起作用
浏览 4提问于2016-06-28得票数 0
我使用的是CodenameOne蓝色主题(‘附带’CodenameOne)。我向BoxLayout.Y容器添加了复选框。选中其中一个复选框时，复选框会变得越来越小、越来越宽。我看了主题，但我找不到原因。在Android 4.4上测试
我添加了两张图片来展示发生了什么。在第一个中，METAR被选中(我猜是未选中)，在第二个中，TAF被选中。
选中另一个复选框后，之前选中的复选框大小再次正常。
浏览 1提问于2016-02-28得票数 1
当使用带有@角/材质的md菜单时，无论我如何堆叠组件，该菜单都会在我的路由器出口下面打开。我在这里错过了什么？
app.modules.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import
浏览 4提问于2016-12-21得票数 3
无法使用<mat-tab-group>获取选项卡
我已经安装了最新的nodejs、angular cli和angular material，但在浏览器中运行项目时无法获得选项卡
@angular/cli: 1.4.5
node: 8.7.0
os: linux x64
@angular/animations: 4.4.5
@angular/cdk: 2.0.0-beta.12
@angular/common: 4.4.5
@angular/compiler: 4.4.5
@angular/core: 4.4.5
@angular/forms: 4.4.5
@angular/http
浏览 1提问于2017-10-16得票数 4
回答已采纳
我当前使用的是angular 10，我想路由到两个不同的视图，然后出现了这个错误。我想要实现的是，每当我单击某个特定按钮时，它都会显示视图。我为视图创建了两个不同的组件。 core.js:4196 ERROR TypeError: Cannot read property 'viewContainer' of undefined
at MatTable._forceRenderHeaderRows (table.js:1637)
at MatTable.ngAfterContentChecked (table.js:1228)
at callHook
浏览 29提问于2020-07-28得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
