TheBestTutorials.css Fonts
Easy to Read
TheBestTutorials.css pages are easy to read, even for people with slight reading disabilities.
- All fonts used are easy readable 15px sans-serif fonts
- The standard font (Verdana) has a very good letter spacing
- The standard line-spacing (1.5) is also very good
HTML Headings <h1> - <h6>
By default TheBestTutorials.css styles HTML headings this way:
Example
<h1>Heading 1 (36px)</h1>
<h2>Heading 2 (30px)</h2>
<h3>Heading 3 (24px)</h3>
<h4>Heading 4 (20px)</h4>
<h5>Heading 5 (18px)</h5>
<h6>Heading 6 (16px)</h6>
Font-Size Classes
Headings should be used for what they are: Headings.
With TheBestTutorials.css, font sizes can be set by classes:
Example
Overriding the Standards
Overriding the TheBestTutorials.css standards is very easy.
You got at least three simple options:
- Override the standard in the <head> section of your page
- Add your own CSS file after subhodaya.css
- Download and change the content of the TheBestTutorials.css file
Override in<head>
h2{font-size:48px;}
h3{font-size:36px;}
h4{font-size:24px;}
h5{font-size:20px;}
h6{font-size:18px;}
Add your own CSS
<link rel="stylesheet" href="myStyle.css">
Change TheBestTutorials.css
TheBestTutorials.css External Fonts
With TheBestTutorials.css it is extremely easy to add new fonts to a web page.
- Very easy to use (only CSS and HTML)
- Unlimited use of external font libraries (Like Google Fonts)
- Works in all modern browsers
Using a Font Class
In the head of your web page (or in your style sheet), create a font class:
Example
font-family: "Comic Sans MS", cursive, sans-serif;
}
In the body of your web page, use the class name:
Using External Fonts
In the head of your web page, include an external font, and give the font a class:
Example
<style>
.TheBestTutorials-tangerine {
font-family: 'Tangerine', serif;
}
</style>
In the body of your web page, use the class name:
More Examples
Example
href="https://fonts.googleapis.com/css?family=Lobster">
Example
href="https://fonts.googleapis.com/css?family=Lobster&effect=brick-sign">
Example
href="https://fonts.googleapis.com/css?family=Allerta+Stencil">
Font effects does not work in Internet Explorer 9 and earlier.
Changing the Page Font
In the head of your web page (or in your style sheet), after you have loaded subhodaya.css, change the style of html and body:
Example
<style>
html , body {
font-family: "Comic Sans MS", cursive, sans-serif;
}
</style>
