Wie können semantische UI-Elemente in HTML-Segmente eingefügt werden?

Semantic UI Items und Segments sind nicht für die Zusammenarbeit gedacht (ich bin gerade auf dasselbe Problem gestoßen), also bestand meine Problemumgehung darin, die erforderliche css zu meinem Stylesheet hinzuzufügen, das auf ein .ui.segment.item Element angewendet wurde Legen Sie diese in die scss-Vorlagen und verwenden Sie stattdessen scss-Variablen für Farben, Abstände usw., um diese zu einem benutzerdefinierten Build von semantic-ui für Ihre Site zu kompilieren.

Also können Sie sowohl .item als auch .segment Stile auf die Blöcke anwenden, die beide Stile haben sollen (für alle Varianten wie piled oder compact müssten Sie diese Varianten als benutzerdefinierte Stile hinzufügen natürlich).

Ich habe es so gemacht, weil die Styles für ein Segment ziemlich eigenständig sind, aber die für ein Item recht umfangreich sind, so dass es schwieriger wäre, sie genau zu reproduzieren.

Der eingebaute Code-Runner scheint nicht richtig angezeigt zu werden, also hier ist eine Geige mit dem gleichen Code, der richtig funktioniert: Ссылка

'' '

'' '