css 如何使用Fomantic UI将正确的功能区标签添加到卡片?

s5a0g9ez  于 2023-05-30  发布在  其他
关注(0)|答案(1)|浏览(74)

我是全新的Fomantic(和webdev一般),我试图使一个网站,有一个卡与丝带标签的右侧,就像他们在文档中,他们使用一个部分,而不是。然而,当我模仿示例中的代码,但用一张卡片而不是一段代码时,它不能正确显示,而且它完全破坏了卡片块。其他无色带卡显示正常。
这是我现在为我想要有丝带的卡片准备的:

<a class="ui large fluid card" href="blahblah">

<a class="ui right red ribbon label">Most coolest project</a>
                    <div class="content">
                        <div class="header">RL Stick-Shift Sim </div>
                        <div class="meta">
                            <span class="category">Summer 2023</span>
                        </div>
                        <div class="description">
                            <p>Project description blah blah.</p>
                        </div>
                    </div>
                    <div class="extra content">
                        <div class="right floated author" >
                            <img class="ui avatar image" src="/images/github-pfp.jpg" alt="GitHub profile picture"> myGithub (GitHub)
                        </div>
                    </div>
                </a>

有谁知道我该怎么解决这个问题吗?我不知道出了什么问题。

8yoxcaq7

8yoxcaq71#

<a class="ui large fluid segment" href="blahblah">

<a class="ui right red ribbon label">Most coolest project</a>
                    <div class="content">
                        <div class="header">RL Stick-Shift Sim </div>
                        <div class="meta">
                            <span class="category">Summer 2023</span>
                        </div>
                        <div class="description">
                            <p>Project description blah blah.</p>
                        </div>
                    </div>
                    <div class="extra content">
                        <div class="right floated author" >
                            <img class="ui avatar image" src="/images/github-pfp.jpg" alt="GitHub profile picture"> myGithub (GitHub)
                        </div>
                    </div>
                </a>

您正在尝试将色带标签与卡片一起使用。尝试用作段

相关问题