博文卡片式超链接语法

Question

我希望在CSDN博文中加入：和下图一样的网站超链接效果，属于卡片式的，点击即可跳转相应网页。

期望回答：如何使用markdown语法编写该效果？

链接文本↓

[VMware Workstation 16 Pro](https://www.vmware.com/cn/products/workstation-pro/workstation-pro-evaluation.html)

有那个效果的博客参考（就是要如下效果，卡片式的点击跳转效果）

VMware Workstation 16 Pro虚拟机官方正版下载安装教程_vm16pro-CSDN博客 文章浏览阅读4.7w次，点赞8次，收藏36次。官网正版下载链接：下拉，找到VMware Workstation 16 Pro注意不同的系统，要选择不同的安装包。一般，我们都是用Windows系统。_vm16pro https://blog.csdn.net/Afghanis/article/details/127876412

（在提问的时候超链接加上%ra=card就可以达到该效果，但是在编写博客的时候该方法无效）

注意：不是以下这种效果
VMware Workstation 16 Pro

Answer 1

该回答引用自GPT-3.5,由博主GISer Liu编写：

要在CSDN博文中实现卡片式超链接效果，可以使用Markdown语法结合HTML来实现。具体步骤如下：

1. 准备超链接文本： 首先准备好你要显示的超链接文本，例如 "VMware Workstation 16 Pro"。
2. 编写Markdown代码： 使用Markdown语法编写超链接，示例代码如下：

[VMware Workstation 16 Pro](https://www.vmware.com/cn/products/workstation-pro/workstation-pro-evaluation.html)

1. 添加HTML代码： 在超链接Markdown代码外部添加HTML代码，实现卡片式效果。示例代码如下：

<div style="border: 1px solid #ccc; border-radius: 5px; padding: 10px; background-color: #f9f9f9; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
    [VMware Workstation 16 Pro](https://www.vmware.com/cn/products/workstation-pro/workstation-pro-evaluation.html)
</div>

这段HTML代码会在Markdown中显示一个带有边框和阴影的卡片，使超链接看起来更像一个按钮，点击后跳转到相应网页。你可以根据需要调整样式，比如修改边框颜色、背景色等。

如果该回答解决了您的问题，请采纳！如果没有，请参考以下方案进行修订