使用 material 框作为卡片图片

Question

我正在尝试使用 material 框来存储卡片图像。我的目标是点击卡片图片并全屏查看。

  <div class="card large hoverable">
    <div class="card-image">
      <img materialize="" class="materialboxed" width="650" src.bind="movie.poster">
    </div>
    <div class="card-content">
      <span class="card-title activator grey-text text-darken-4">${movie.title + " - " + movie.imdbRating}<i class="material-icons right">more_vert</i></span>
      <p>${movie.genre.join(', ')}</p>
    </div>
    <div class="card-reveal">
      <span class="card-title grey-text text-darken-4">${movie.title}<i class="material-icons right">close</i></span>
      <p>${movie.director}</p>
      <p>${movie.genre.join(', ')}</p>
      <p>${movie.actors.join(', ')}</p>
      <p>${movie.plot}</p>
    </div>
  </div>

问题是无法使图像容器变大。所以图片会被放大但是因为容器很小所以不能显示所有的图片。

Answer 1

这是他们上次提交时修复的问题：

https://github.com/Dogfalo/materialize/issues/2091

使用 material 框作为卡片图片

using material box for card images

materialize