how to Learn HTML & CSS tutorial | web designing course

how to Learn HTML & CSS tutorial | web designing course

Web pages can be created and modified by using professional HTML editors like notepade++, sublime text.

However, for learning HTML we recommend a simple text editor like Notepad (PC) or TextEdit (Mac).

We believe in that using a simple text editor is a good way to learn HTML.

Follow the steps below to create your first web page with Notepad or TextEdit.

HTML (HyperText Markup Language) is the most basic building block of the Web. It defines the meaning and structure of web content. Other technologies besides HTML are generally used to describe a web page’s appearance/presentation (CSS) or functionality/behaviour (JavaScript).

You may like Learn HTML & CSS tutorial

“Hypertext” refers to links that connect web pages to one another, either within a single website or between websites. Links are a fundamental aspect of the Web. By uploading content to the Internet and linking it to pages created by other people, you become an active participant in the World Wide Web.

HTML uses “markup” to annotate text, images, and other content for display in a Web browser. HTML markup includes special “elements” such as

 <head>, <title>, <body>, <header>, <footer>, <article>, <section>, <p>, <div>, <span>, <img>, <aside>, <audio>, <canvas>, <datalist>, <details>, <embed>, <nav>, <output>, <progress>, <video>, <ul>, <ol>, <li>

 

Step 1: Open Notepad (PC / laptop)

Open the Start Screen (the window symbol at the bottom left on your screen). Type Notepad.

 

Step 2: Write Some HTML

Write or copy the following HTML code into Notepad:

<!DOCTYPE html>

<html>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>

Example

<!DOCTYPE html>

<html>

<head>

<title>Page Title</title>

</head>

<body>

<h1>This is a Heading</h1>

<p>This is a paragraph.</p>

</body>

</html>

 

Step 3: Save the HTML Page

Save the file on your computer. Select File > Save as in the Notepad menu.

Name the file “index.html”

 

Step 4: View the HTML Page in Your Browser

Open the saved HTML file in your favourite browser (double click on the file, or right-click – and choose “Open with”).

The result will look much like this: / output

With our free online editor, you can edit the HTML code and view the result in your browser.

It is the perfect tool when you want to test code fast. It also has colour coding and the ability to save and share code with others:

You may like Learn HTML & CSS tutorial

Scroll to Top