Mukautettu CSS
Hosted- ja julkaistuja Spaces-sivustoja voidaan mukauttaa CSS:n avulla.
CSS-muutoksenne sisällytetään vain mukautettuun verkkotunnukseenne. Kun esikatselette julkaistua Space-sivustoa, sitä ei näytetä, joten se on julkaistava Production-ympäristöön.
Valitkaa space ja napsauttakaa Asetukset-kuvaketta ( ⚙️ ) avataksenne Avaruusasetukset
Etsikää Mukautettu koodi-välilehti Space Settings -ikkunasta
Siirtykää Mukautettu CSS-kenttään
Kirjoittakaa HTML <style>-tagit
Tallentakaa muutoksenne Custom CSS -kenttään.
<style>
/* add the CSS clases and the properties you want to change */
</style>
Turvallisuussyistä mukautettu koodi sisällytetään vain mukautettuun verkkotunnukseen.
Koko DOM:ssa löydätte HTML-elementtejä, joissa on CSS-luokka, joka alkaa merkkijonolla ab- . Voitte kohdistaa nämä luokat portaalin tyylittelyyn. Näiden luokkien taataan pysyvän muuttumattomina, jotta tyylittelynne ei rikkoudu järjestelmän päivityksen yhteydessä.
Jos elementillä, jota yritätte tyylitellä, ei ole luokkaa, joka alkaa merkkijonolla ab-, emme salli mukauttamista, ja tämä tehdään pääasiassa suojataksemme teitä itseltänne. Jos esimerkiksi muutamme rakennetta, se voi vaikuttaa tyylittelyynne.
Jokaisella sisältöosion elementillä ja lohkolla on myös vastaava luokka. Alta löydätte luettelon luokista. Jos haluatte tarkistaa ne, avatkaa selaimenne DevTools napsauttamalla hiiren oikealla painikkeella -> Inspect.
Tämä on luettelo tämänhetkisistä käytettävissä olevista CSS-luokista:
OpenAPI CSS-luokat
Tumma tila lisää dark-luokan HTML-puun yläosaan, ja voitte käyttää sitä tumman tilan tyylien kohdistamiseen.
Esimerkiksi näin muutatte tekstin punaiseksi tummassa tilassa:
<style>
.dark .ab-paragraph {
color: red !important ;
}
</style>