yu.css.ui/css/component/card.css

纯CSS通用UI模块和组件

.yu-card {
  border: 1px solid #E4E7ED;
  border-radius: 4px; }
  .yu-card.card {
    width: 300px;
    display: inline-block;
    margin-right: 14px; }
  .yu-card.hoverable {
    transition: box-shadow 0.4s ease; }
    .yu-card.hoverable:hover {
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); }
  .yu-card .image {
    width: 100%; }
  .yu-card .header {
    font-size: 16px;
    font-weight: bold;
    padding: 14px;
    border-bottom: 1px solid #E4E7ED;
    color: #303133; }
    .yu-card .header .float.right {
      float: right; }
  .yu-card .content {
    padding: 14px; }
    .yu-card .content .header {
      padding: 0;
      padding-bottom: 14px;
      border: none; }
  .yu-card .footer {
    padding: 14px;
    border-top: 1px solid #E4E7ED; }
  .yu-card .description {
    font-weight: normal;
    font-size: 14px;
    color: #909399;
    padding-top: 8px; }