sass 相关问题

Sass（Syntactically Awesome Style Sheets）是CSS的扩展，添加了嵌套规则，变量，mixins和类扩展等功能。这使开发人员能够编写结构化，可管理且可重用的CSS。 Sass被编译成标准CSS。

有没有办法在React应用程序的vite库模式下导出样式？

我有一个带有 JSX 组件、mudule.scss 和全局 css 文件的 vite React TS 应用程序。当我使用库模式构建它时，我得到了分离的 .js、.d.ts 和 .css。但是当我将其安装在任何其他应用程序中时，

css reactjs typescript sass vite

回答 1 投票 0

Bit.dev如何创建scss组件？

我尝试创建一个bit.dev scss。我正在使用这个命令，但它不起作用。位创建 scss 变量/颜色

reactjs sass bit.dev

回答 1 投票 0

如何创建下载按钮

我的下载按钮不起作用，我将鼠标悬停在它上面，它会在屏幕左下角显示下载链接，但我单击它，动画会播放，但不会开始下载。这是 html...

javascript html css sass

回答 1 投票 0

更改材质设计中的复选框勾选颜色

在角度中，我试图将复选框代码和输入值下划线更改为绿色，而不是默认的紫色。我怎样才能解决这个问题？在角度中，我试图将复选框代码和输入值下划线更改为绿色，而不是默认的紫色。我该如何解决这个问题？ <div class="label-input-block top-centre-form"> <mat-form-field class="green-input" name="gadsCustomerId" formControlName="gadsCustomerId" id="gadsCustomerId"> <mat-label>Select accounts</mat-label> <mat-select [formControl]="selectedCidList" multiple> <mat-option *ngFor="let cid of customer_list" [value]="cid.id"> {{ cid.account_name }} [{{ cid.id }}] </mat-option> </mat-select> </mat-form-field> </div> <ng-template matStepLabel>Configure date range</ng-template> <div class="label-input-block top-centre-form"> <mat-form-field class="green-input"> <mat-label class="green-input">From Days Ago</mat-label> <input type="number" class="green-input" name="fromDaysAgo" formControlName="fromDaysAgo" id="fromDaysAgo" matInput /> </mat-form-field> </div> https://imgur.com/a/1deeM0L https://imgur.com/a/fFJJOxM 请通读 angular-material theming documentation 这包含为您的角度材质组件主题化的完美说明，目前，下面是我使用 green-palette 将所有组件设置为绿色主题时的工作示例。这将帮助您达成最终解决方案！主题 ... $theme-primary: mat.define-palette(mat.$green-palette); $theme-accent: mat.define-palette(mat.$green-palette); ... 完整主题scss // Custom Theming for Angular Material // For more information: https://material.angular.io/guide/theming @use '@angular/material' as mat; // Plus imports for other components in your app. // Include the common styles for Angular Material. We include this here so that you only // have to load a single css file for Angular Material in your app. // Be sure that you only ever include this mixin once! @include mat.core(); // Define the palettes for your theme using the Material Design palettes available in palette.scss // (imported above). For each palette, you can optionally specify a default, lighter, and darker // hue. Available color palettes: https://material.io/design/color/ $theme-primary: mat.define-palette(mat.$green-palette); $theme-accent: mat.define-palette(mat.$green-palette); // you can also do below // $theme-accent: mat.define-palette(mat.$green-palette, A200, A100, A400); // The warn palette is optional (defaults to red). $theme-warn: mat.define-palette(mat.$red-palette); // Create the theme object. A theme consists of configurations for individual // theming systems such as "color" or "typography". $theme: mat.define-light-theme( ( color: ( primary: $theme-primary, accent: $theme-accent, warn: $theme-warn, ), typography: mat.define-typography-config(), ) ); // Include theme styles for core and each component used in your app. // Alternatively, you can import and @include the theme mixins for each component // that you are using. @include mat.all-component-themes($theme); html <div class="label-input-block top-centre-form"> <mat-form-field class="green-input" name="gadsCustomerId" id="gadsCustomerId"> <mat-label>Select accounts</mat-label> <mat-select multiple> <mat-option *ngFor="let cid of customer_list" [value]="cid.id"> {{ cid.account_name }} [{{ cid.id }}] </mat-option> </mat-select> </mat-form-field> </div> <div class="label-input-block top-centre-form"> <mat-form-field class="green-input"> <mat-label class="green-input">From Days Ago</mat-label> <input type="number" class="green-input" name="fromDaysAgo" id="fromDaysAgo" matInput /> </mat-form-field> </div> <mat-label class="green-input">checkbox</mat-label> <mat-checkbox class="example-margin">Check me!</mat-checkbox> 堆栈闪电战

angular sass angular-material

回答 1 投票 0

对 <tbody> 的展开/折叠进行动画处理：寻求一些 CSS 魔法

我目前正在开发一个项目，在该项目中，我可以使用 JavaScript 成功地显示和隐藏表中的一个元素。然而，我希望为用户体验增添更多的魅力。 ...

javascript css animation sass stenciljs

回答 1 投票 0

当 sass 一起使用 calc 和 var 时，React 构建失败

我正在使用 create-react-app 来构建我的应用程序，当我在开发模式下运行它时，它可以正常工作，没有任何错误或警告。当我在 sass 中同时使用 calc 和 var 时，我得到了一个 b...

css reactjs build sass create-react-app

回答 4 投票 0

我正在尝试从JS获取幻灯片图像并在SCSS中调整它们的大小

JS 中的幻灯片图像被放大到超出屏幕的参考范围。我正在尝试调整 SCSS 中的上述图像的大小以适合所有类型的屏幕。请耐心等待，因为我仍在学习......