Füge \u003cabbr\u003e-Tags zu Wörtern in Beiträgen hinzu

Anpassung Themenkomponente
30

Nachdem ich einen halben Tag lang herumgebastelt hatte, konnte ich den Code mit dem Discourse AI Bot von @Falco :muscle: erstellen.
Ich erhalte seit zwei Wochen Hilfe von einem Bot, sei es hier auf Meta (um die Bedeutung der Anfrage zu suchen) oder auf meiner Website beim Schreiben dieses oder jenes Codes. Hier ist der Code, den ich zusammenstellen konnte, um das obige Problem zu lösen:

abbr[title] {
    position: absolute;
    background: transparent; /* Прозрачный фон в неактивном состоянии */
    overflow: visible; /* Позволяет содержимому выходить за границы элемента */
}

@media (prefers-color-scheme: light) {
    abbr[title] {
        color: var(--primary); /* White or black hue for the script? */
    }
}
abbr[title]:hover {
    background: #FF6; /* Upon hovering, the background bathes in a vibrant hue of yellow.*/
}
abbr[title]:hover:after {
    content: " " attr(title) "";
    position: absolute;
    border-radius: 3px;
    bottom: 70%; /* Alter this value to control the discrepancy. */
    left: 0;
    width: 250px; /* Fixed breadth */
    height: auto; /*"Adjustable elevation" */
    padding: 2px;
    z-index: 9;
    background: #00FF00; /* Specify the background hue for the commentary. */
    color: #333;
    margin-bottom: 10px; /* Incorporate a lower margin to forge a separation. */
}

Ich hinterlasse das hier; vielleicht findet es jemand nützlich :slightly_smiling_face:

Ps. Seien Sie nachsichtig, falls Sie einen Fehler im Code finden, da ich keineswegs von Beruf Softwareentwickler bin.

6 „Gefällt mir“