儀表板任意門 - Alex-Programer

儀表板任意門

2023年4月26日#代码片段487

AI 翻譯

這篇文章透過AI由簡體中文翻譯成繁體中文。查看原文

AI 生成的摘要

这段代码是用来获取一个名为"Alex-Programer"的图片，并根据不同的主题设置背景样式。代码中还包含了在不同屏幕尺寸下的样式调整。最后，提供了一个网站供参考了解如何展示卡片项。

獲取名稱#

主要程式碼#

注意將下面的 Alex-Programer 換成你的

有自定義過樣式的小夥伴請自行調整

header>div:nth-child(2)>div:nth-child(2) {
    padding-bottom: 200px;
    background: url(https://xlog-card.vercel.app/api/Alex-Programer?theme=light) no-repeat;
    background-position: bottom;
}

html.dark header>div:nth-child(2)>div:nth-child(2) {
    background: url(https://xlog-card.vercel.app/api/Alex-Programer?theme=dark) no-repeat;
    background-position: bottom;
}

@media only screen and (max-width: 768px) {

    header>div:nth-child(2)>div:nth-child(2),
    html.dark header>div:nth-child(2)>div:nth-child(2) {
        background-size: contain;
        padding-bottom: 110px;
    }
}

展示效果#

WX20230426-182932@2x

WX20230426-182949@2x

補充#

需要展示的卡片項目可以自行調整，可以參考 https://xlog-card.vercel.app/ 了解