{"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=IQoJb3JpZ2luX2VjELX%2F%2F%2F%2F%2F%2F%2F%2F%2F%2FwEaCWV1LXdlc3QtMSJHMEUCIHxbsdBxiafvBu2ZYwr8Jltcr3APo%2BAAPC%2FaqBGzLuAkAiEAzbVgutUg2STRK55YmeUe7fW0VufnkXvs4%2B%2FOM48UAP4quQUIfRAFGgwyNzM1NzAxOTU0MzMiDDF4CiHxbUrbMs1pciqWBYvsLM6%2FmXwrtcub2j6lIxbutvvuPVWBIpoZONHvDWq4LjxjE1We0hi4bKm3yLe83rnVarvJi3aCfkkrRcoC4sL4Mm8tsxOcXtwNa1VXbZKBhHaAWmWARnu2QoaNu62A%2B%2FLMPiLn3iQDKtznfztSQRK0lkM8PEY9Nptws1Txn27dd1kV5esmWGsRcIq6I%2BGM2uvmzgdHgz29qic4GQz6ZZ5XEdIjkXOnUWA%2BWiLu2wbjXu066XPmvgW1Z%2Bicic6bo0ie7OYGg1G9BH%2F3HnVmm5JVDIx0gJ%2Bupg0PbMLI%2BPG9Bq0S97pfj7eNWaU2ODaIgGpZlYtsWyjSosTiqUCPDFdyO7ZiAH2WOGc7efgpag2u0hGbkcXsK8blqkuYxlebUwnpags1e2Fh%2FnlLsbHqin4ToQkqGgp25KkEh7%2FraNnRRuQawJkDw4IA3scCjsgZJFCn8yKZlut1MpkzHwDLZnmR6yTRPrJWjHnrEipH1LRFMITDiYhkQuGBUEYVXbUlo%2BULwP1oJdWIPMdPAwerXuzZOvQ74TG4lCyTtkCjB0S7qLrMY7iC1IzvLtpkltj0LsRPIHUJnGKx70Yse7IDokIxTv45V0mz1jZJSCBgEUd8B%2Fg2QNKSn5rCBxAlHNTR1%2BE2iCEH%2Bp8zSa2r4kG5CiyoFlU%2BqKDexBJ6TNB2So52N3R3tOYMR%2B9qB2FS3iWek5oujIdSBx6yZhQx69Khv7c%2Bgffa9A3Go%2FOwRCT6AD4SvB9MCCnVuh004bl7nAHdIvuzIDM%2BiW1EDMLYrBJYIeVLIuSmyjyfTTu%2Fpn0Sgu5DDvDipQ7sZTBtXB3hiephki0eG78W7UiNe0BZRqmw%2F2FEvNU1Nj46ysK5gKVdziUjDXSDqFaCMNWr%2BdUGOrEBCCZe5rqz1jvDjawKF3LfVIXkQoSMbm1uIBb%2FyPIhJye30hwAM7TkUT0YefqlexmwLefyDStOHPYAnoYOE3EJ3BPuTBSJeDmtXGJWM1VTPHVug4qd5PF3thqwdmwyP92ylb1AhXUOS9t37b7Pic%2BzTRBz1ENqcKePiQcX0MK93vs47Igh7ksIESMpA2JSJDGkJcq9wChcICN3M6BOXmVM2ab1MOvfXANS1woZWdmx2kL2&#038;X-Amz-Algorithm=AWS4-HMAC-SHA256&#038;X-Amz-Credential=ASIAT7MQN47URLKEGPZA%2F20261001%2Feu-west-1%2Fs3%2Faws4_request&#038;X-Amz-Date=20261001T134257Z&#038;X-Amz-SignedHeaders=host&#038;X-Amz-Expires=900&#038;X-Amz-Signature=cf4afad000427227aed8d796041e05aaa1453669ffeb80616cc66881a83c4e66\" 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}]}}