Now, let's see some of these attributes in action. Here's an example web page code to show you how these might fit into your web page's HTML code. In the yellow table below, I've highlighted all the tags and attributes in BOLD print so you can recognize them easily. <html> <head> <title> Web
Page Example Using Attributes
</title> </head> <body
bgcolor="white" text="blue"> <h1> Headline
of your Web Page using the "Heading" Tags
</h1> The examples below
show different HTML tags with attributes
in use. <p
align=left>This paragraph shows how
your text can be aligned at the left side
of your web page using the "align"
attribute. <p
align=right>Or, align your text
on the right side of the page using this
attribute. <br>The "br"
stands for line
break.<br><br> <table border=5
width="65%" align=center> The table
tags can have attributes as well. Notice
the border size of 5 and the "width"
assignment of 65% for this particular
table tag. Then, the table is aligned to
the center of your web
page.</table> </body> </html> HTML Tags for Text Formatting and ColorsJust as HTML tags and attributes help to determine the layout of a web page, they also help to control what your text will look like on a web page. HTML tags define the text size, font, color of the text, and how the text is aligned on the web page. Here are some basic text HTML tags to give you an idea of how it works. *HINT: Stick with Internet-safe colors and fonts when typing text into a web page. Not all fonts and colors are recognized by browsers or certain types of computers on the Web so your web page could look great on your computer or browser, but terrible for your viewers! If you must create a unique font or color, use a graphic image instead and place your unusual font or colored text into the image. For a quick reference guide about HTML colors, go here: http://www.webmastercourse.com/articles/html-color-codes-part1/
HTML Tags for Fonts, Color, and Text SizeThe good news is you can specify the font, color and text size for an entire page or paragraph using this simple tag: <font face="Arial" color="#FF0000" size="+1"> And... here's this tag in action: <p><font
face="Arial" color="#FF0000" size="+1">
Within this HTML tag, the font type is
"Arial" and the color is "red" or
#FF0000. The text size is +1.
You can end a paragraph and start a new
font or text look by ending the paragraph
with the "</font>" ending tag.....
like this.... </font> <p><font
face="Arial" color="#000000" size="+2">
Then, you can create a new paragraph with
different font specifications if you
wish. For example, this paragraph
will have the font type of "Arial" and the
color "black" as well as the size of "+2".
</font> You can even specify a different font color within the same paragraph by surrounding a certain word or phrase with new font tags. Here's the same paragraph as used above, but notice the font tags surrounding the phrase "new paragraph" in the red color to make it stand out on the page. See yellow table below.... <p><font
face="Arial" color="#000000" size="+2">
Then, you can create a <font
face="Arial" color="FF0000" size="+2">
new paragraph </font> with different
font specifications if you wish. For
example, this paragraph will have the font
type of "Arial" and the color "black" as
well as the size of "+2".
</font> Now, take a look at the sample web page I created using the above HTML tags and attributes. I realize the page looks "tacky" but this is for example purposes only to illustrate how the tags work.
If you are getting
excited and feel you are ready to learn
beginner web design from home, the Web
Design Mastery Course is for you!
Webmaster Shelley
Lowery has put together one of the most
comprehensive, easy to understand website
designing packages online today - and you
can get instant access to the course
materials. And, since this is
the official website, you can take
advantage of the incredible guarantee, any
discounts available, and you'll get all
the great free bonuses offered when you
purchase today. Just click on the
link below to see what Web Design Mastery
can do to jump-start your entrance into
beginner web design.
This concludes the HTML Tags Complete Reference Part 3. Next week, we'll take a look at more popular HTML tags and attributes and how they work.
**NOTE: The good news
is you don't have to know everything there is to
know about HTML tags to design
your website.You can
actually get started with your own website by just
knowing the basics! So, relax as you learn and
don't worry about trying to absorb too much at
once.
Small Business Web Design Common HTML Tags What are HTML Tags? HTML Image Code HTML Color Names Learning HTML © Copyright WebMasterCourse.com - All Rights Reserved. - html color codes | HTML Tags Quick Guide |
|