再去设计一下每个卡片组件的代码结构 .. 先给片卡添加一个容器 . . 上面加上一个 ui 还有 card .. semantic ui 这套样式框架里面本身就有 card 组件的样式 .. 不过我想自己动手去创建这个组件的样式 ..

每个卡片分成了两部分 .. 上面是 image ，下面是文字内容 .. 先给图像添加一个包装 .. 上面加上 image 这个类 ..

文字的内容放在一个带 content 类的包装里面 .. 这个 image 还有 content 元素它们是兄弟关系 ...它们的共同的爸爸就是这个 ui card 元素 ..

图像的包装里面用一个 img 标签，插入一张图片 .. 你可以在项目的 app .. images 这里，可以找到我准备的图像 ..

然后在 content 这里去添加文字内容 .. 用一个带 header 类的容器 .. 可以使用 h3 这个标签 .. 揽胜

在这个 h3 标签里面，我们再添加一个子标题 ... 用一个 div .. 加上一个 sub ，还有一个 header 类 ..

Range Rover

然后是卡片上的描述内容 .. 用一个带 description 类的包装 .. 里面是一些文字 ..

无与伦比，世界顶级奢华SUV的极致巅峰

描述的下面是一描述元数据 ... 这些内容的包装上面可以加上一个 meta 类 ..

RMB 1,588,000 起

这些就是一个卡片组件的代码结构 .. 下面我们要用点 css 去设计一下它的样式 ...