问题标签 [md-card]

我试图创建一个响应式卡片列表，该列表具有最小宽度，填充所有可用空间（根据浏览器大小排列 1、2、3 块）。

到目前为止，我有代码是做什么的：

什么技巧在第 2 行style="min-width: 460px;"和flex

但是，我面临的问题是最后一个元素也“弯曲”到整个宽度，例如，当一行中有 3 张卡片而最后一行只有 1 个元素时，这看起来很丑陋……

在这种情况下，我如何将最后一个元素调整为 1/3 并响应进一步的尺寸变化？

我正在使用带有角材料的 Angular 1.6.1。

我想为 Angular Material 卡片添加箭头效果（见下图），但我不知道该怎么做。我已经设置了一个小提琴来寻求帮助。

https://jsfiddle.net/er1187/rng1pv4u/1/

让我们以你下面的代码为例：

当我单击按钮时，我希望它具有从按钮开始并覆盖整个卡片的墨水效果，如下所示：

在 AngularJS 材料中可能吗？

Im trying to get 2 content "boxes" in one md-card. One where the user can enter some textfields, and on the other side i want a logo.

CSS

I think it's quite simple, but somehow i keep thinking wrong, because i dont get it.

我会将 mat-card-title 文本居中。所以我需要把它的宽度设置为 100% 但我没有得到结果，只有当我使用“px”时。

所以我尝试为所有父母容器设置宽度，但没有结果。

这是我的html文件

CSS 文件

我还在 app.component.ts 中添加了宽度百分比，我在其中调用了我的组件：

然后我将styles.css 文件添加width:100%到正文中。

我看不到宽度不为 x% 的元素在哪里

我有一个 Angular4 应用程序，在我的页面的一部分我有一个<md-card-content>标签，我试图在<p>标签中显示一些内容并且<p>有 20 厘米max-height！

它适用于短内容，但对于较长的内容则不起作用！<md-card-content>如果内容的高度超过 20 厘米，我该如何创建另一个？我想做一些像 Microsoft Word 这样的东西，当当前页面已满时移动到新页面！

这是我的一些html代码：

这是我的CSS：

我正在使用 AngularJS Material 并且在尝试使 md-cards 具有相同高度时遇到了问题。在屏幕上，卡片的高度相同，但我真的只希望内容部分增长以填充可用空间。下面你可以看到我的卡片高度相同，但我希望我的图像和图像标题保持不变，而下面的所有内容都会增长以适应最大高度：

我的卡片代码如下所示：

我的行和其中的卡片的 CSS 如下所示：

该行具有“父”类，三张卡片中的每一张都包含在 col-md-4 类中。

我尝试了一堆不同的与 CSS 相关的更改，但似乎没有任何效果。有人可以提供一些关于如何使卡片高度相同但卡片图像和卡片标题保持不变的指导吗？

我想创建一个按钮，单击后将更改 md-card 的颜色。我不确定我应该怎么做。我知道这里应该是变量，点击后从 false 变为 true，然后执行一些函数，但不知道里面应该是什么。

我正在寻找一种在 Angular 1 上以响应方式显示 4 张高度可变的卡片的方法。

在大屏幕上，它应该显示如下内容：

在小屏幕上应该显示如下：

这适用于响应要求，但如果另一张卡片更高，则在同一列上的卡片之间显示大空间

这适用于可变高度要求，但没有响应（请注意，此处卡片的顺序需要不同）：

卡片内的按钮无响应。我的目标是在单击每张卡片的按钮时显示和隐藏小时。我添加了 Javascript 来处理这个函数，但它似乎没有响应。当我在标签之外创建一个按钮时，按钮似乎功能正常并且脚本运行良好。任何和所有的见解都会非常感谢我缺少什么，因为我已经尝试了几乎所有我拥有的以下内容：