- Adobe Fonts User Guide
- Introduction
- Font licensing
- Font licensing
- Manage your account
- Licensing for Creative Cloud for enterprise customers
- Adding font licenses to your account
- Removing fonts from the subscription library
- Adobe Fonts not available to Adobe IDs registered in China
- Why aren't these fonts included in my Creative Cloud subscription?
- Morisawa font removal September 2021
- Getting and using fonts
- Using Adobe Fonts in Creative Cloud apps
- Manage your fonts
- Resolve missing fonts in desktop applications
- Using fonts in InDesign
- Fonts and typography
- Using web fonts in HTML5 Canvas documents
- Using fonts in InCopy
- Using web fonts in Muse
- Packaging font files
- Troubleshooting guide: Adding fonts
- Added fonts aren't showing to font menu
- "Unable to add one or more fonts" or "A font with the same name is already installed"
- What happens when a font I'm using is updated by the foundry?
- Web design and development
- Add fonts to your website
- Troubleshooting guide: Adding fonts to a website
- Troubleshoot font issues
- Using web fonts in HTML email or newsletters
- Using web fonts with Accelerated Mobile Pages (AMP)
- CSS selectors
- Customize web font performance with font-display settings
- Embed codes
- Dynamic subsetting & web font serving
- Font events
- Why are my web fonts from use.typekit.net?
- Site can't connect to use.typekit.net
- Using web fonts with CodePen
- Browser and OS support
- Domains
- Using web fonts when developing locally
- Content security policy
- Printing web fonts
- Language support and OpenType features
- Font technology
CSS-väljare talar om för webbläsaren var webbteckensnitten ska användas, samt vikten och stilen på teckensnittet som ska användas i texten.
Använda font-family-namnen i CSS-koden
På sidan Webbprojekt anges CSS-font-family-namnet, den numeriska vikten och teckensnittsstilen för varje teckensnitt i projektet. Klicka på länken Redigera projektet för att se CSS-detaljerna för varje projekt.
När du har infogat inbäddningskoden i ditt dokument ska du använda dessa font-family-namn i CSS-koden för att tillämpa teckensnitten på texten. Exempel:
h1 {
font-family: "brandon-grotesque", sans-serif;
}
Ange reservteckensnitt
Om en användares webbläsare inte stöder webbteckensnitt eller om de inte läses in av någon anledning, kommer reservteckensnitten i CSS-stacken att användas i stället.
Teckensnittsstacken bör innehålla minst ett reservteckensnitt som är tillgängligt på alla plattformar (t.ex. Georgia eller Arial), följt av ett generiskt teckensnittsfamiljenamn (t.ex. serif eller sans-serif). Om webbläsaren inte kan hitta det första teckensnittet försöker den med det andra och så vidare.
Använda flera vikter och stilar
Du kan ange andra teckensnittsvikter än ”normal” och ”bold” genom att använda numeriska teckensnittsviktsvärden i CSS-koden. De numeriska värdena motsvarar oftast dessa vikter:
- 100 = thin
- 200 = extra-light
- 300 = light
- 400 = normal, book
- 500 = medium
- 600 = demi-bold
- 700 = bold
- 800 = heavy
- 900 = black
Du hittar de numeriska värdena för alla teckensnitt i ditt projekt på webbprojektsidan.
Använd t.ex. denna CSS-kod för att tillämpa vikten 700 av ett teckensnitt på h1-elementet:
h1 {
font-weight: 700;
}
Använda variationsspecifika namn i Internet Explorer 8
Internet Explorer 8 läses maximalt in fyra vikter per familj, och att använda två närbesläktade vikter (t.ex. 600 och 700) kan leda till att endast en vikt läses in korrekt. Adobe Fonts tillhandahåller variantspecifika teckensnittsfamiljenamn för dessa versioner av webbläsaren för att hantera bägge dessa fel.
Det variationsspecifika namnet ska läggas till i början av font-family-stacken vid behov, före huvudsläktnamnet:
#post-title {
font-family: "brandon-grotesque-n7","brandon-grotesque", sans-serif;
font-style: normal;
font-weight: 700;
}
Namnen består av det vanliga font-family-namnet följt av ett bindestreck, följt av en beskrivning av teckensnittsvariationen (FVD med en engelsk förkortning). Det variationsspecifika namnet för brandon-grotesque som innehåller teckensnittet med vikten 700 är t.ex. brandon-grotesque-n7.
Det variationsspecifika namnet är odefinierat i webbläsare som inte har dessa problem, så de kommer att använda hela familjenamnet, som är på andra plats i stacken.
De flesta behöver inte använda dessa ytterligare font-family-namn. Du behöver bara lägga till dem om du har problem med att teckensnitt visas felaktigt i just Internet Explorer 8.
