04:47 AM 20/09/2020
LANGUAGES:
- CSS
There are such ways to use fonts, but how do you use fonts for a webpage? Let's start with the documentation.
Lets use a simple example:
Do you notice the font-family? That attribute indicates the certain font for the website.
You can add any fonts! But it will take a while. The code will be something like this.
*Importing a font:
You can also use other sites, but Google Fonts is a popular option.
Using the font you uploaded:
You may have noticed the .ttf file extension, you might wonder, what is it? .ttf, .woff, .eot, .otf, .woff2 indicates the file is a font.
I hope you enjoyed the tutorial!
- CSS
There are such ways to use fonts, but how do you use fonts for a webpage? Let's start with the documentation.
Lets use a simple example:
body {
**font-family**: Helvetica;
}
Do you notice the font-family? That attribute indicates the certain font for the website.
You can add any fonts! But it will take a while. The code will be something like this.
*Importing a font:
@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
You can also use other sites, but Google Fonts is a popular option.
Using the font you uploaded:
@font-face {
font-family: Example Font;
src: url(example-font.ttf);
}
You may have noticed the .ttf file extension, you might wonder, what is it? .ttf, .woff, .eot, .otf, .woff2 indicates the file is a font.
I hope you enjoyed the tutorial!
04:47 AM 20/09/2020
thanks
05:37 AM 20/09/2020
Quote from n4p , 05:30 AM 20/09/2020Accidentally hit enter when I wasn't finished, here's the final product:
<!DOCTYPE html>
<html>
<head>
<title="Font Demonstration"
<!DOCTYPE html>
<html>
<head>
<title>Font Demonstration</title>
<meta charset="utf-8">
</head>
<body>
<h1 style="font-family: Helvetica;">Lorem Ipsum Dolor Sit Amet...</h1>
</body>
</html>
When run this should display "Lorem Ipsum Dolor Sit Amet..." in the top left of the page with the Helvetica font.