打印JSON字符串并用HTML和CSS格式化

我正在尝试打印和格式化我从数据库中获得的json代码，并用我的ejs文件和CSS打印它。现在我只是在看一个JSON字符串，我不知道如何格式化，有人知道我应该怎么做吗？我正在制作一个活动计划器Web应用程序

我试图做的是让用户创建一个帐户并登录，然后一旦他们登录，他们就能够查看已经创建的事件的详细信息。正如您从屏幕截图中看到的，您可以看到json字符串，但我希望能够将其转化为一些有意义的设计，而不仅仅是一个随机的元素字符串

电流输出：

正文{
背景色：#FEF5DF；
}
.集装箱1{
宽度：300px；
高度：400px；
位置：绝对位置；
排名：0；
右：0；
左：0；
底部：0；
保证金：自动；
背景：url（“https://i.pinimg.com/564x/6f/5a/b1/6f5ab1b470beeeeaf285bb451c63ac8f.jpg");
背景色：黑色；
背景尺寸：封面；
光标：指针；
-网络工具包盒阴影：0 0 5px#000；
盒影：0 0 5px#000；
}
.覆盖1{
宽度：100%；
身高：100%；
显示：网格；
网格模板列：1fr；
网格模板行：1fr 2fr 2fr 1fr；
背景：rgba（77,77,77,9）；
颜色：#FEF5DF；
不透明度：0；
过渡：均为0.5s；
字体系列：“Playfair显示”，衬线；
}
.项目1{
左侧填充：20px；
字母间距：3px；
}
.总目1{
字体大小：30px；
线高：40px；
变换：translateY（40px）；
过渡：所有0.7秒；
hr1{
显示：块；
宽度：0；
边界：无；
边框底部：实心2px$bg；
位置：绝对位置；
底部：0；
左：20px；
过渡：全部5秒；
}
}
.价格1{
字体大小：22px；
线高：10px；
字体大小：粗体；
不透明度：0；
变换：translateY（40px）；
过渡：所有0.7秒；
.老{
文字装饰：线条贯通；
颜色：变浅（rgb（77,77,77），40%）；
}
}
.cart1{
字体大小：12px；
不透明度：0；
字母间距：1px；
字体系列：“Lato”，无衬线；
变换：translateY（40px）；
过渡：所有0.7秒；
我{
字体大小：16px；
}
span1{
左边距：10px；
}
}
.容器1：悬停。覆盖1{
不透明度：1；
&.头{
变换：translateY（0px）；
}
&人力资源{
宽度：75px；
过渡延迟：0.4s；
}
&.价格{
变换：translateY（0px）；
过渡延迟：0.3s；
不透明度：1；
}
&.购物车{
变换：translateY（0px）；
过渡延迟：0.6s；
不透明度：1；
}
}

仪表板 欢迎光临

---

在这种情况下，我不认为JSON是你的问题。您正在使用EJS，这是一个JavaScript模板库。因此，您必须使用HTML并在模板中插入所需的数据，如下所示：

也许json不适合这样做，比如说，如果使用标准XML，可能会节省大量工作；尽管您可以使用JavaScript使其工作。或者你是说你想让它看起来像json，只是打印得很漂亮？