Css Fonts- Tutorialpath

CSS FONTS

Welcome to all our readers on our website at www.tutorialpath.com. As you all know that here on our website we will provide you lots of information related to the latest and newly introduced technology which help you to get updated with the latest tech. Here you will get all the useful information which is required in this tech world. As you know technology is one of the trending part in this world. So, here again we came up with a latest and new tech information which is related to the process of creating CSS Font. With the help of this article you will get to know the complete process of how to create CSS Font in a step by step manner. So, simply have a look to this article and grab all the useful information which is going to be very helpful for you.

 

This chapter teaches you how to set fonts of a content, available in an HTML element. You can set following font properties of an element −

  • The font-family property is used to change the face of a font.
  • The font-style property is used to make a font italic or oblique.
  • The font-variant property is used to create a small-caps effect.
  • The font-weight property is used to increase or decrease how bold or light a font appears.
  • The font-size property is used to increase or decrease the size of a font.
  • The font property is used as shorthand to specify a number of other font properties.

Set the Font Family

Following is the example, which demonstrates how to set the font family of an element. Possible value could be any font family name.

It will produce the following result −

Set the Font Variant

The following example demonstrates how to set the font variant of an element. Possible values are normal and small-caps.

It will produce the following result −

Set the Font Weight

The following example demonstrates how to set the font weight of an element. The font-weight property provides the functionality to specify how bold a font is. Possible values could be normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900.

Set the Font Size

The following example demonstrates how to set the font size of an element. The font-size property is used to control the size of fonts. Possible values could be xx-small, x-small, small, medium, large, x-large, xx-large, smaller, larger, size in pixels or in %.

Set the Font Size Adjust

The following example demonstrates how to set the font size adjust of an element. This property enables you to adjust the x-height to make fonts more legible. Possible value could be any number.

Set the Font Stretch

The following example demonstrates how to set the font stretch of an element. This property relies on the user’s computer to have an expanded or condensed version of the font being used.

Possible values could be normal, wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded.

Shorthand Property

You can use the font property to set all the font properties at once. For example −

So, as of now we had shared all the useful information related to CSS Font which will going to very helpful for you. This article will help you to understand all the details and steps in a proper manner. Also, if you like this article then simply share this article with others as well so that they also understand all the details and information easily. On the other side, if you find any error in this article or if you have any query related to this article then simply drop a comment in the comment section below so that we will get to know that what issue you are facing and also we can reply to your query instantly.

Leave a Reply

Your email address will not be published. Required fields are marked *