Menu
I trying to use local font to apply styles in html, below is the code.Font is not getting applied for harlow class used element
<!DOCTYPE html> <html> <head> <style> @font-face { font-family: myFirstFont; src:local("C:\Users\Website\fonts\Harlow_Solid_Italic.ttf"); } .harlow{ font-family: myFirstFont; } </style> </head> <body> <div>With CSS3, websites can finally use fonts other than the pre selected "web-safe" fonts.</div> <p><b class="harlow">Note:</b> Internet Explorer 8 and earlier, do not support the @font-face rule with the WOFF format (only support for EOT format).</p> </body> </html> 
477
You can use a <basefont> tag to set all of your text to the same size, face, and color. The font tag is having three attributes called size, color, and face to customize your fonts. To change any of the font attributes at any time within your webpage, simply use the <font> tag.
The @font-face CSS at-rule specifies a custom font with which to display text; the font can be loaded from either a remote server or a locally-installed font on the user's own computer.
I made the following changes and I got the result
Note: Use of the local css function throws an error in the developer console saying resource is not loaded. See the modified code below.
<!DOCTYPE html> <html> <head> <style> @font-face { font-family: "myFirstFont"; src: url("C:/Users/Desktop/Website/fonts/Harlow_Solid_Italic.ttf"); } .harlow { font-family: "myFirstFont"; } </style> </head> <body> <div>With CSS3, websites can finally use fonts other than the pre selected "web-safe" fonts.</div> <p><b class="harlow">Note:</b> Internet Explorer 8 and earlier, do not support the @font-face rule with the WOFF format (only support for EOT format).</p> </body> </html>Use the correct path for file. your path does not work on the host. because your host has no drive 'c:/...' or anythings like this. so you can use
<!DOCTYPE html> <html> <head> <style> @font-face { font-family: myFirstFont; src:url("/fonts/Harlow_Solid_Italic.ttf"); } .harlow{ font-family: myFirstFont; } </style> </head> <body> <div>With CSS3, websites can finally use fonts other than the pre selected "web-safe" fonts.</div> <p><b class="harlow">Note:</b> Internet Explorer 8 and earlier, do not support the @font-face rule with the WOFF format (only support for EOT format).</p> </body> </html> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
