{"id":82,"date":"2021-06-03T21:36:58","date_gmt":"2021-06-03T20:36:58","guid":{"rendered":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/?page_id=82"},"modified":"2021-06-09T21:13:40","modified_gmt":"2021-06-09T20:13:40","slug":"text-font","status":"publish","type":"page","link":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/css\/css-properties\/text-font\/","title":{"rendered":"font-family"},"content":{"rendered":"<h1><a href=\"https:\/\/www.w3schools.com\/css\/css_font.asp\" target=\"_blank\" rel=\"noopener noreferrer\"><img decoding=\"async\" class=\"image-59 alignright\" src=\"https:\/\/glow-prod-sh.s3.eu-west-1.amazonaws.com\/sh\/public\/ahscomputinghtml\/uploads\/sites\/3275\/2021\/06\/03210120\/w3schools-150x150.png?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&#038;X-Amz-Security-Token=IQoJb3JpZ2luX2VjEJf%2F%2F%2F%2F%2F%2F%2F%2F%2F%2FwEaCWV1LXdlc3QtMSJHMEUCIQDLd%2BPremfoxTLerD5XtV5%2FLIgi4UDi3u4tDWdtT%2BAZqQIgDOd38DG8LuEkDMiJt1EMwGobt%2F7uYWFTr1S7NBe%2BMEAquQUIXxAFGgwyNzM1NzAxOTU0MzMiDBxEmdkmQhVGfP3O3yqWBQVfstvMyTX6dsX1ns25gKyPytmxq0J9WhohpjCK%2BN5b2rdrgN8AgpnnqxCZ1UWfyGsrj6yTMB%2F7eqVda8Zj2HnuGH8N9f2Efjwc5gv81xxckfQXGKkoaxHBVcyB077WQA9DI8uYl9%2BuHDxgPFom3IOyS0LcBLnidjwDoetAd61hM8sZPPxomLjhgYTVVQHWkowu9Lzs0oMTwtkzZeiKmAm2JSVAnPrCQZKD%2B%2B3wcHkv61IzAXtzaFk29tehX7TbhargYqC9ZKFwK7P%2FYABJPBJ4DYmYuIHQ0PaQVkG9A3pYWh943IyqCpuCP1z5vQlH4o4Gwh6CfyczwtgDyMdzp%2BSKVgEz%2BYug7Z0SkatSFmdxj71wBnOwbSu2FI17hUKW%2BLwmtdLaawAIWNXF25ufTGSZ9fVNiJIYBllW2zH2L9eLk%2B7H7WByt9HWY9yFSXKMC8GwwEFCeu1B8gwsL6MZq7mqBCytvcGwrS2d1vtDSLY4jRzCXc2%2F%2BEc3s2yQQ27fIB799IWXdSRIpDCs7%2FtzZhZpNj%2FsqZKiexT%2FoYL%2BpyKkvVJrk8gYzOKtkclfI6Ew963Hqdx6hJzUUPnb5B9fvJgaoEbFFdnM1lRT554P7aX2Ow0Uw9xWaJwuKzcRTYlKLAkBYF87r%2FKEFkjznEU6vRzve1Nk5agP5Lt5KxjW7OfMmbQsSGQxe29vm9MoE7QKwJlkfLuvyKFNWTHPQXfuQBe5TOPq%2Bhk%2BhR4UNTYFDxGsjfGh96WQPoXed2ZOpC4ln0ugWyWbRoFVqrqSwNCoqDlJujnw7skpzjGtHbkXjZKj5FpYUKpOS94yx7Cx02KvKO6bZkE5R6rxeX2wxSW4czyvy3RWegvtBNQJnu0FkPoK0%2BAA1ZgCMIWR49YGOrEBVewDzZvnVq47C4J6l%2FkYe0eeUfhyyboHzPu4O6SwfZZhN1tZNKaZM7DN7MSBlO%2BvbGE5yDApJ%2FYhZy%2FxsQBU0F09ZzBaEVQkDeGsfo0tN8F5bf1OjOhJjK7fKlKAmF96ldtiQlwM%2FvNPcaneazSdn17J%2B5UiiL3Txak8SqV8LHJ49GXaXTWm6gH%2B4S1Vsqs9V18rDXNOW2S9eifSIJstqStWJTkKjMUX1WqlDybVEB1g&#038;X-Amz-Algorithm=AWS4-HMAC-SHA256&#038;X-Amz-Credential=ASIAT7MQN47UTW5R7AKX%2F20261021%2Feu-west-1%2Fs3%2Faws4_request&#038;X-Amz-Date=20261021T145708Z&#038;X-Amz-SignedHeaders=host&#038;X-Amz-Expires=900&#038;X-Amz-Signature=03b22e18fddbc4fe2f9a1b91c18e7a44222cc12e8f2adc3a05828e475bc6c82d\" alt=\"\" width=\"50\" height=\"47\" \/><\/a><\/h1>\n<p>Font rules can be given to text objects or their containers.<\/p>\n<p>Fonts are often given a list, so that if a font is not available then another can be used.<\/p>\n<p>If a font name has a space, then it must be enclosed in either quotation marks or apostrophes.<\/p>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">\r\np {\r\n\u00a0\u00a0font-family: &quot;Times New Roman&quot;, Times, serif;\r\n}\r\n<\/pre>\n<h1>Google Fonts<\/h1>\n<p>There are 10 <a href=\"https:\/\/www.w3schools.com\/cssref\/css_websafe_fonts.asp\">web safe fonts<\/a>.<\/p>\n<p><a href=\"https:\/\/fonts.google.com\/\">Google Fonts<\/a> has over 1000 fonts that are free to use. However, before you can use a Google font it has to be loaded in either an external or internal style sheet.<\/p>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">@import url('https:\/\/fonts.googleapis.com\/css2?family=Roboto&amp;display=swap');\r\n\r\np {\r\n    font-family: 'Roboto', sans-serif;\r\n}\r\n<\/pre>\n<p>Spaces inside a font name needs to be replaced with a &#8216;+&#8217; sign when it is loaded, but surrounded by quotation marks or apostrophes when it is used:<\/p>\n<pre class=\"brush: css; title: ; notranslate\" title=\"\">@import url('https:\/\/fonts.googleapis.com\/css2?family=Sigmar+One&amp;display=swap');\r\n\r\nh1 {\r\n    font-family: 'Sigmar One', cursive;\r\n}\r\n<\/pre>\n<p>The Google Fonts page will give you necessary code to copy and paste &#8211; click on the <strong>@import<\/strong> option<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Font rules can be given to text objects or their containers. Fonts are often given a list, so that if a font is not available then another can be used. If a font name has a space, then it must be enclosed in either quotation marks or apostrophes. p { \u00a0\u00a0font-family: &quot;Times New Roman&quot;, Times, serif; } Google Fonts There are 10 web safe fonts. Google Fonts has over 1000<\/p>\n<p><a class=\"more-link\" href=\"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/css\/css-properties\/text-font\/\">Read More<\/a><\/p>\n","protected":false},"author":7,"featured_media":0,"parent":366,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-82","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/82","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/comments?post=82"}],"version-history":[{"count":8,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/82\/revisions"}],"predecessor-version":[{"id":234,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/82\/revisions\/234"}],"up":[{"embeddable":true,"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/pages\/366"}],"wp:attachment":[{"href":"https:\/\/blogs.glowscotland.org.uk\/sh\/ahscomputinghtml\/wp-json\/wp\/v2\/media?parent=82"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}