HTML Formatting Tutorial for Beginners

Welcome to this tutorial on HTML formatting! In this guide, you will learn how to create a simple HTML file, add formatting to your text, and view the results in your web browser using a web hosting file manager. Let’s get started!

Step 1: Log into Your Web Hosting Control Panel

Open your web browser and go to your web hosting control panel login page (e.g., cPanel, Plesk, etc.).
Enter your username and password to log in.

Step 2: Open the File Manager

Once logged in, look for the File Manager option in your control panel dashboard.
Click on File Manager to open it.

Step 3: Navigate to the Public Directory

In the File Manager, navigate to the public_html directory or the appropriate directory where you want to create your HTML file.
This directory is typically where you place files that you want to be accessible via your web domain.

Step 4: Create a New File

In the public_html directory, click on the + File or New File button.
Name the new file index.html and click Create New File.

Step 5: Edit the HTML File

Locate the index.html file you just created in the file list.
Right-click on index.html and select Edit or use the Edit button/menu option to open the file in the text editor provided by the file manager.

Step 6: Add HTML Formatting Code

Copy and paste the following HTML code into the text editor:

<!DOCTYPE html>
<html>
<head>
    <title>HTML Formatting Tutorial</title>
</head>
<body>

<h1>HTML Formatting Examples</h1>

<p><b>This text is bold.</b></p>
<p><strong>This text is strong.</strong></p>
<p><i>This text is italic.</i></p>
<p><em>This text is emphasized.</em></p>
<p><mark>This text is marked.</mark></p>
<p><small>This text is small.</small></p>
<p><del>This text is deleted.</del></p>
<p><ins>This text is inserted.</ins></p>
<p><sub>This text is subscript.</sub></p>
<p><sup>This text is superscript.</sup></p>

</body>
</html>

This code includes various HTML formatting tags:

 and  for bold text.
 and  for italic text.
 for highlighted text.
 for smaller text.
<del> for deleted text.
<ins> for inserted text.
 for subscript text.
 for superscript text.

Step 7: Save the File

After pasting the code, click Save or use the save option in the text editor.
Close the text editor once the file is saved.

Step 8: View the File in a Web Browser

Open your preferred web browser (e.g., Chrome, Firefox, Edge, Safari).
Type your domain name in the address bar followed by /index.html (e.g., http://yourdomain.com/index.html).
You should now see a webpage displaying the formatted text as specified in your HTML code.

Congratulations! You’ve successfully created an HTML file, added formatting, and viewed it in your web browser using your web hosting file manager. Experiment with the HTML formatting tags to see how they change the appearance of your text. Happy coding!