Create an HTML file in NotePad++
You can skip this page if you're already using NotePad++. It's just a short practice to
show you some of the features of the editor.
Open NotePad++ and type the web page listed below into the blank
document that appears.
<html>
<!-- This is my first web page -->
<head>
<title>
My first web page
</title>
</head>
<body>
This text will appear on the page.
</body>
</html>
NotePad++ will colour-code your program as soon as it knows what language you're
writing. Save the file with an html extension and NotePad++ will realise that
you are typing HTML. It will colour-code your text like this:
<html>
<head>
<title>
My first web page
</title>
</head>
<body>
This text will appear on the page.
</body>
</html>
The text to be displayed stays black but the tags become blue and the comments
become green.
Colour-coding may sound a childish feature but it is very useful. If you type a tag
and it stays black then you know you've made a mistake. If you forget to close a
comment then the rest of the page will go green. Try it. You need to know what
NotePad++ will do when you make mistakes later.
Later on you will see that NotePad++ will also colour code JavaScript in a similar
way.
If you experiment with the text in the editor you will find that matching HTML tags
are highlighted automatically. Click on the
<body>
tag and both it and the
</body>
tag will be highlighted in blue. This too is trivial in a simple program but becomes
invaluable when you have dozens of tags nested inside one another.
![[NotePad++ highlights matching tags]](..\media\images\notepadtags.gif "Matching tags in NotePad++")
The lines of HTML in this example have been indented to show how they fit into the
structure of the page. This is not compulsory, just a matter of programming style to
make the page easier to understand. Indents are straightforward in NotePad++, you
write the lines as normal, select all the lines you want to indent then press Tab. Use
Shift+Tab to unindent blocks of lines.
|
