Online Training for Asp.net MVC Web Designing Development, MS SQL, Digital Marketing

Font CSS Style, CSS Tutorial


Font is one of key element in webpage designing, page appearance completely depend on that
Font has following properties
Font Properties
font-size increase or decrease the size of a font
font-family set the type of font (unknown as font family)
color can set font color using Hex Code/ name / or RGB)
font-style make a font italic or oblique

Font CSS Style Example

Though you can set font property while writing content using in-line CSS, but that would increase your code size unnecessarily and will be difficult to maintain consistency throughout the website

For Example we can write like this
We are learning Font CSS, so experimenting different ways to write font on web page, just to see how it appear on browser , but we are passionate about learning the best practice and will follow the same.
Here is the code (dirty ways of writing css)
We are <span style="font-size:18px;"> learning Font CSS</span>, so experimenting <span style="font-family:'Arial Rounded MT';">different ways to write font </span> on web page, just to see how it <span style="color:#f00;"> appear on browser </span>, but we are passionate about learning the best practice and will follow the same.

Instead of doing above we could have created a css-class with all font details and use that class wherever we need, that would keep the code clean and maintainable
Here is how you can do that
<style>
div
{
font-size: 20px;
font-family: Verdana;
color: red;
font-stretch:expanded;
}
</style>

Now all Font inside div will have same look and feel across the website
Here are few useful CSS properties you must know
<style>
line-height:24px;
</style>

Comment
Name Email Website
Subscribe
 
Font CSS Style, CSS Tutorial

Group Training