All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

How To Change Font Style In HTML

Last Updated : Mar 11, 2024

How To Change Font Style In HTML

In this tutorial we will show you how to change font style in HTML, HTML font style is generally used to change the value of color, font, size, margin, background color and etc.

It can be possible by using style attribute to elements. In style attribute, we can give the name like color, font-size and etc. which we want to change with its values.

Step By Step Guide On How To Change Font Style In HTML :-

By Using Style Attribute

As we know now, in HTML we have to use style attributes in elements so, that we can change its appearance. Generally, there are many style attributes properties which helps user to make an effective webpage, but for now knowledge we use some genuine tags only.

Further, we also come in touch with other properties of style attributes, also. Now, let us we write a code for understanding of style attribute and to see how it works.

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document<title>
        </head>
          <body>
		<p>
	     		 it is a simple paragraph tag  
	      </p>
    <p style=" color: rgb(33, 21, 207); font-family: Arial, Helvetica, sans-serif; text-align: center; font-size: 13px; text-decoration: underline yellow;">
	        it is paragraph tag with some properties of style attribute written above.
    	</p>
          </body>
      </html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here. Here, first we use a simple paragraph tag and writes text in this tag, and its result is that it come as simple as genuinely it is.
  5. But in second paragraph tag, where we use style tag it’s properly different from previous. It’s because only the use of style attribute, in which we use Color, font-family, align, font-size and also text-decoration and we also have to give values to these properties like we write blue after color, center after align and underline yellow after text-decoration, etc.
  6. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

In conclusion, we can say that style attribute is used to change everything of text except it’s content, that’s we write inside paragraph tag to show on browser.

The style tag comes with many properties and we are able to use these all in one style attribute by putting a semi-colon (;) after each property. I hope this tutorial on how to change font style in HTML helps you.

Author Image About Pragati

Experienced coding content writer who enjoys breaking down complex concepts in programming languages like Java, Python, C, and C++. Over three years of experience producing interesting and relevant content for a variety of entities. Committed to providing concise and easy-to-understand articles that assist readers in easily understanding technology and industry trends in the world of coding and software development.

Follow Pragati On Linkedin 🡪