Benutzerdefinierte CSS
5 min
gehostete und veröffentlichte spaces können mit css angepasst werden ihre css änderungen werden nur auf ihrer benutzerdefinierten domain übernommen wenn sie ihren veröffentlichten space in der vorschau anzeigen, wird er nicht sichtbar sein, daher müssen sie ihn in die produktion veröffentlichen wählen sie einen space und klicken sie auf das einstellungen symbol ( ⚙️ ), um die space einstellungen zu öffnen suchen sie im fenster der space einstellungen den reiter benutzerdefinierter code gehen sie zum feld benutzerdefiniertes css geben sie die html \<style> tags ein speichern sie ihre änderungen im feld für benutzerdefiniertes css \<style> / add the css clases and the properties you want to change / \</style> aus sicherheitsgründen wird benutzerdefinierter code nur auf einer benutzerdefinierten domain eingebunden im gesamten dom finden sie html‑elemente mit einer css‑klasse, die mit ab beginnt sie können diese klassen anvisieren, um das portal zu stylen diese klassen werden garantiert niemals geändert, sodass wir ihr styling nicht beschädigen, wenn wir das system aktualisieren wenn das element, das sie stylen möchten, keine klasse besitzt, die mit ab beginnt, erlauben wir keine anpassung – hauptsächlich, um sie vor potenziellen problemen zu schützen wenn wir z b die struktur ändern, könnte dies ihr styling beeinträchtigen jedes element und jeder block im inhaltsbereich hat ebenfalls eine ähnliche klasse unten finden sie eine liste dieser klassen wenn sie sie überprüfen möchten, öffnen sie bitte die devtools in ihrem browser per rechtsklick → inspect dies ist eine liste der derzeit verfügbaren css‑klassen ab callout { } ab changeloc { } ab code editor { } ab minitasker { } ab graphiql { } ab horizontal divider { } ab jira { } ab map { } ab mermaid { } ab vertical split { } ab vertical split item { } ab video { } ab checklist { } ab blockquote { } ab diagram { } ab embed { } ab file { } ab iframe { } ab html { } ab image { } ab ul list { } ab ol list { } ab list item { } ab list item child { } ab table { } ab space { } ab collection { } ab space container { } ab collection container { } ab top navbar { } ab search input { } ab public search { } ab space content { } ab collection content { } ab tree navigation { } ab tree navigation link { } ab left nav chevron { } ab tree navigation link inactive { } ab space navigation { } ab doc name { } ab h1 { } ab h2 { } ab h3 { } ab expandable heading { } ab link { } ab link dynamic { } ab nav right { } ab nav right text { } ab bold { } ab code { } ab paragraph { } ab footer container { } ab search modal header { } ab search modal content { } ab auth jwt button { } ab auth saml button { } ab windy template { } ab color nav template { } ab booklet template { } openapi css klassen ab openapi { } ab open api param name { } ab open api param expand icon { } ab open api param type { } ab open api param description wrap { } ab open api param example wrap { } ab open api param custom type { } ab open api required star { } ab open api param example title { } ab open api param example { } ab open api param description title { } ab open api param description { } ab open api input wrap { } ab open api array input wrap { } ab open api schema wrap { } breadcrumb klassen ab breadcrumb item { } jedes breadcrumb label ab breadcrumb item clickable { } breadcrumb, das angeklickt werden kann, um zu navigieren ab breadcrumb item highlight { } das aktuell aktive/hervorgehobene breadcrumb ab breadcrumb separator { } das chevron symbol zwischen breadcrumbs ab breadcrumbs wrapper { } der container um die gesamte breadcrumb leiste ab breadcrumb ellipsis { } das " ", das angezeigt wird, wenn es zu viele breadcrumbs gibt der dunkelmodus fügt eine dark klasse am oberen rand des html baums hinzu, und sie können diese verwenden, um dark mode stile anzusprechen zum beispiel können sie so den text im dunkelmodus rot färben \<style> dark ab paragraph { color red !important ; } \</style>
Have a question?
Our super-smart AI, knowledgeable support team and an awesome community will get you an answer in a flash.
To ask a question or participate in discussions, you'll need to authenticate first.