Editing HTML
To display text in a Web page, you simply start a new HTML
document (.htm file) or ASP page (.asp file) and enter
text onto the page. If you want to format the text, or add features such
as images or links to your page, you use HTML (Hypertext Markup
Language).
If you aren't an HTML expert, you will probably want be
familiar with how HTML works before getting started. Knowing HTML can
help you get the most out of your Web-based application.
When you are creating HTML text, you most often use Design
view in the editor, which displays text with all the formatting
applied, the way you see documents in a word processor. Design view is
the default editor for .htm files.
For more precise control over your document, you can edit in
Source view, which displays your text and the HTML tags that are
used to format it.
Working with HTML Tags
HTML is built around tags, which are formatting instructions
embedded in the text. Tags are surrounded by angle brackets (< and >) to
distinguish them from the surrounding text. Tags are also typically used
in pairs around the text you want to format — an opening tag, the text,
and a closing tag, which is marked with a slash (/). For example, the
following line shows how you would format some text as bold (<B> tag)
and some as italic (<I> tag):
<B>Welcome</B> to my <I>home page</I>.
When displayed in a browser, this line would look like this:
Welcome to my home page.
HTML includes tags for character formatting and paragraph
formatting (for example, centering a paragraph). Tags are also used to
specify features such as images, links, tables, and forms. The following
table provides a brief outline of commonly-used tags.
|
To insert |
Use |
Example |
|
New
paragraph |
<P> |
<P>This
is a paragraph</P><P>This is a second paragraph</P> |
|
Image |
<IMG>
plus the name of the image file to display |
<IMG SRC="Monalisa.gif"> |
|
Link |
<A> plus
the address of the page to jump to, followed by link text |
<A HREF="home.htm">Go
to Home Page</A> |
|
Table |
<TABLE>
to define the table
<TR> for each row
<TD> for each cell |
<TABLE>
<TR>
<TD>Row 1, Cell 1
</TD>
</TR>
<TR>
<TD>Row 2, Cell 1
</TD>
</TR>
</TABLE> |
|
Form |
<FORM>
to define the form <INPUT> to define controls such as text boxes
and buttons |
<FORM>Name:
<INPUT Type="Text">
<INPUT Type="Submit">
</FORM> |
Note You can easily create HTML
elements in your documents using menu commands and dialog boxes in the
HTML editor.
Creating HTML in the Editor
The Visual InterDev editor allows you create HTML in new
pages or existing ones. When you are editing, you can work with HTML in
different ways:
- In Design view, you can
format text and paragraphs the way you would in a word processor and the
editor will embed the appropriate HTML tags for you.
For example, if you select text
and click the bold button in the toolbar, the editor inserts <B> and
</B> tags around the selected text. For more complex tags, such as an
image or table tag, you can insert an entire element by filling in
choices in a dialog box.
- In Source view, you can
see HTML tags and edit them directly. You can also embed HTML tags using
toolbar buttons or menu commands, as you can in Design view. For
example, you can insert a link by choosing a menu command and specifying
a target page.
The editor colors HTML text in
Source view to help you distinguish the different parts of HTML tags at
a glance. For example, tag names are displayed in one color, tab
attributes such as SIZE= in another, and so on. Unrecognized text is
colored also, which helps you find errors, such as unmatched tag
brackets, quickly.
Tip You
can change the editor font style and colors in the Options window. From
the Tools menu, choose Options, expand the Text Editor node, and choose
Fonts and Colors.
- In Quick view, you can
see what .htm files will look like in Microsoft® Internet
Explorer. (Quick view might not show you an accurate rendering of .asp
files.)
At any point during your editing you can switch between views
to see the effects of edits you are making.
To switch between views
- At the bottom of the editing
window, choose the tab for the view you want.
Note When you switch from Source to
Design view, the editor might adjust white space (for example,
spaces and tabs) and completes any incomplete HTML tags that exist in
the Web page. When you initially create or open a Web page, it is
displayed in either Design or Source view, depending on the default for
the type of Web page you are editing.
To change the default view
1-
From the Tools menu, choose Options.
2-
In the left pane, expand HTML.
3-
n the Initial View area, choose the default view for HTML (.htm
or .html) pages and ASP (.asp) pages.
|