Html 如何在下面演示的右侧添加图像？

我在CSS技巧中发现了一篇很棒的HTML和CSS堆叠卡片文章。在该演示中没有图像，但我想在下面的代码中在卡的右侧添加一个图像，附加一个图像以供参考。我尽我所能尝试过，但我无法让它看起来像我所附的图片。谁能帮帮我吗

.wrapper{
边缘顶部：100px；
填充顶部：150px；
垫底：1000px；
最大宽度：700px；
保证金：0自动；
字体系列：-苹果系统、BlinkMacSystemFont、“Segoe UI”、Roboto、Helvetica、Arial、无衬线、“苹果颜色表情”、“Segoe UI表情”、“Segoe UI符号”；
}
.card1、.card2、.card3、.card4、.card5、.card6、.card7{
顶部：30px；
位置：粘性；
边框：1px实心#ccc；
长方体阴影：5px 5px 5px rgba（0,0,0,0.1）；
背景色：白色；
颜色：#333；
填充：40px；
边界半径：10px；
边缘底部：20px；
高度：380px；
}
.card1:n个孩子（1n）{
顶部：20px；
}
.card2:n个孩子（2n）{
顶部：40px；
}
.card3:n个孩子（3n）{
顶部：60px；
}
.card4:n个孩子（4n）{
顶部：80px；
}
.card5:n个孩子（5n）{
顶部：100px；
}
.card6:n个孩子（6n）{
顶部：120px；
}
.card7:n个孩子（7n）{
顶部：140px；
}
.卡：第n个孩子（8n）{
顶部：160px；
}
.card1{
背景色：#CAC5F5；
}
.card2{
背景色：#C0FFD6
}
.card3{
背景色：#FCF4B0
}
.card4{
背景色：#FFB1B0
}
.card5{
背景色：#8AC9FF
}
.类名{
背景色：#44c767；
文本缩进：0；
显示：内联块；
颜色：#ffffff；
字体大小：15px；
字体风格：普通；
高度：50px；
线高：50px；
宽度：140px；
文字装饰：无；
文本对齐：居中；
}.classname:悬停{
背景色：#5cbf2a；
}.classname:活动{
位置：相对位置；
顶部：1px；
}

项目#1项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

项目#2项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

项目#项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

项目#项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

项目#5项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

.wrapper{
边缘顶部：100px；
填充顶部：150px；
垫底：1000px；
最大宽度：700px；
保证金：0自动；
字体系列：-苹果系统、BlinkMacSystemFont、“Segoe UI”、Roboto、Helvetica、Arial、无衬线、“苹果颜色表情”、“Segoe UI表情”、“Segoe UI符号”；
}
.card1、.card2、.card3、.card4、.card5、.card6、.card7{
顶部：30px；
位置：粘性；
边框：1px实心#ccc；
长方体阴影：5px 5px 5px rgba（0,0,0,0.1）；
背景色：白色；
颜色：#333；
填充：40px；
边界半径：10px；
边缘底部：20px；
高度：380px；
}
.card1:n个孩子（1n）{
顶部：20px；
}
.card2:n个孩子（2n）{
顶部：40px；
}
.card3:n个孩子（3n）{
顶部：60px；
}
.card4:n个孩子（4n）{
顶部：80px；
}
.card5:n个孩子（5n）{
顶部：100px；
}
.card6:n个孩子（6n）{
顶部：120px；
}
.card7:n个孩子（7n）{
顶部：140px；
}
.卡：第n个孩子（8n）{
顶部：160px；
}
.card1{
背景色：#CAC5F5；
}
.card2{
背景色：#C0FFD6
}
.card3{
背景色：#FCF4B0
}
.card4{
背景色：#FFB1B0
}
.card5{
背景色：#8AC9FF
}
.类名{
背景色：#44c767；
文本缩进：0；
显示：内联块；
颜色：#ffffff；
字体大小：15px；
字体风格：普通；
高度：50px；
线高：50px；
宽度：140px；
文字装饰：无；
文本对齐：居中；
}.classname:悬停{
背景色：#5cbf2a；
}.classname:活动{
位置：相对位置；
顶部：1px；
}
* {
框大小：边框框；
}
/*创建两个相邻浮动的相等列*/
.栏目{
浮动：左；
宽度：50%；
填充：10px；
高度：300px；/*应移除。仅用于演示*/
}
/*清除列后的浮动*/
.罗：之后{
内容：“；
显示：表格；
明确：两者皆有；
}

项目#1项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

项目#2项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

项目#项目名称
Lorem ipsum dolor sit，amet Concertetur Adipising Elite。例如，连续不断地进行劳动和合理实践所需的时间

计划#