For design, I like to use very large fonts in the headers (about 70 - 85 pixels). To prevent page suppression, I need a really thin font. I found Poiret One on Google fonts and it is classified as a scoring family. This is a very thin, very elegant font, but the default in an italic family seems comical, which is just the opposite - very awkward, bold and unattractive in large headlines. In my css file, I:
h1 { font-family: 'Poiret One', cursive; font-weight: 100; font-size: 85px; color: #99ccff; }
I would like to add courier new as the user's default font, as it is the thinnest of web safe fonts and adds the following attributes to make the character spacing look like Poiret One so that I don't overflow my bootstrap columns:
font-family: "Courier New"; font-style: normal; font-size: 4.8em; font-weight: 400; letter-spacing: -0.125em; line-height: 1.5em;
What is css that I can use to tell the browser if Poiret One cannot be viewed by the user, please use the new courier with font modifications as above?
Waiting for a solution. Thanks!
source share