Hvordan endre skriftstørrelse på Mobil Squarespace
I denne bloggopplæringen kan du lære hvordan du justerer skriftstørrelser spesifikt for mobilvisning på Squarespace-nettstedet ditt
La oss dykke inn..
Se videoen 👇
Sjekk ut YouTube-videoen nedenfor
Det jeg ønsker å oppnå er å gjøre skriftstørrelsen mindre på mobilvisningen i Squarespace.
For å gjøre det, må vi legge til en egendefinert kode som tildeler en annen skriftstørrelse for mobil.
Gå til Sider → Nettstedverktøy → Tilpasset CSS
Kopier og lim inn følgende kode:
@media screen and (max-width: 767px) {
h1 { // Endre dette til stilen du vil utløse
skriftstørrelse: 2rem !viktig; // endre størrelse til ønsket størrelse - kan også følge andre størrelsesformater som (px, rem og em)
}
}
Merk at du ikke trenger å bruke rem for skriftstørrelse; du kan bruke rem, em, px og andre enheter også.
Du kan også justere skriftstørrelsen for flere elementer. I koden ovenfor målrettet jeg h1 , men du kan endre den til å inkludere h2, h3, h4 og p også. Bare legg til en kodeblokk for hver overskrift du vil justere. Det vil se omtrent slik ut:
@media screen and (max-width: 767px) {
h1 { // Endre dette til stilen du vil utløse
skriftstørrelse: 2rem !viktig; // endre størrelse til ønsket størrelse - kan også følge andre størrelsesformater som (px, rem og em)
}
h2 { // Endre dette til stilen du vil utløse
skriftstørrelse: 2rem !viktig; // endre størrelse til ønsket størrelse - kan også følge andre størrelsesformater som (px, rem og em)
}
p {// Endre dette til stilen du vil utløse
skriftstørrelse: 2rem !viktig; // endre størrelse til ønsket størrelse - kan også følge andre størrelsesformater som (px, rem og em)
}
}
Du vil også legge merke til at dette kun endrer skriftstørrelsen på mobil og ikke påvirker nettvisningen.
Din designer
Jeg er Victor Rolf, en ekspert Squarespace-designer. Hvis du vil diskutere et potensielt prosjekt, kan du sende meg en e-post på victor@rolfmade.com eller ta kontakt her . Alternativt kan du sette opp en gratis 15-minutters konsultasjonssamtale her.
