Build Your Own Website: Font

Showing posts with label Font. Show all posts

Font Tags and Their Attributes

The font tags define to the browser how big, what color and which style the text is. There are the attributes that define the over all text of the entire page. However this section will show you how to define individual areas of text, whether it be the color of a link or making the whole paragraph italic and bold.

The size= attribute simply defines what size the text should be.

The color= attribute of course defines the color of the text. There are two ways to define the text, one is to simply type the color (blue, red, green, etc.). The other way is to use a hexcode color chart to find the # for the exact color you would like to use. The attribute would look like this color="#FFFFFF" The F's in this attribute would make the color white. To see a hexcode color chart, click here.

Example Script:

<html>
<head>
<title>
Your Page Name Here
</title>

</head>
</body bgcolor="white">

 Text made of Orange! 

</body>
</html>

Using Text as a Link

You can make a link that when clicked takes the user to another webpage. Hyperlinking is as easy as adding a tag to define where to direct the user to when they click on a link. A hyperlink tag looks like this:

<a href="http://www.webpagehere.com/"> this would go in front of the text you were making clickable, in the parenthesis is the address of the website you are linking to (Home Page, Facebook, etc.).

</a> follows the text that you are making a link. This defines to the browser how much text to use as the link.

You can use the Tags on the text you are linking, just put the tags inside the to Hyperlink Tags:

Example Script:

<html>
<head>
<title>
Your Page Name Here
</title>

</head>
</body bgcolor="white">

<a href="http://www.address.com/"> View by Clicking NOW! </a>

</body>
</html>

Funny Letters

I get many searches for: 'funky letters for myspace.' Some people have spent countless hours putting these letters together to make pages worth of information written in pure funky lettering. Here's my collection so far, feel free to Copy and Paste them for your Blog, Myspace, Facebook or Website.

▓▓▓▓▓▓▓▓. ⊙⊙ ☠

◄◄ REW ► PLAY ▌▌PAUSE █▌STOP ►► FF

█████ ◄╞,          ş ą ğ ♪

♥♡♥♡ ♥ ☺ ღ ๑ ♠ ۩ ▶Music♩♪♫♬ Volume: ▁ ▂ ▃ ▄ ▅

❒ Yes ❒ No ✔

TO DO: ☑ A bit of tweeting, ☑ Lay around, ☑ Drink beer, ☑ Be Awesome.

There's so many, look.....

€
ƒ
…
†
‡
Œ
•
—
™
š
œ
Ÿ
¡
¢
£
¤
¥
¦
§
¨
©
ª
«
¬
®
¯
°
±
²
³
´
µ
¶
·

¹
º
»
¼
½
¾
¿
À
Á
Â
Ã
Ä
Å
Æ
Ç
È
É
Ê
Ë
Ì
Í
Î
Ï
Ð
Ñ
Ò
Ó
Ô
Õ
Ö
×
Ø
Ù
Ú
Û
Ü
Ý
Þ
ß
à
á
â
ã
ä
å
æ
ç
è
é
ê
ë
ì
í
î
ï
ð
ñ
ò
ó
ô
õ
ö
÷
ø
ù
ú
û
ü
ý
þ

To use any of these letters, simply drag a box over the text, right click and copy the letter. Then go to where you want to use the letter, right click and paste.

Ctrl X

"Cut" remove the selected item but save to clipboard.

Ctrl C

"Copy" the selected area to the clipboard, without removing.

Ctrl V

"Paste" the item you saved to the clipboard to the area you are editing.

Marquee Scrolling Text

Most scrolling text is catchy to the eye, however try not to use too many of these scrollers, they tend to slow the page load time down if used in excess.

Here are the Marquee open and close tags:
<marquee> and </marquee>

This a Marquee with a Background Color, look below for more attributes

So now we've got an idea of what to do to scroll the text, here are some more attributes to change the content of the marquee:

direction="right" Use left, right, up or down to specify which direction to scroll

height="25" Defines the height of the Marquee

width="200" Defines the width to span the Marquee

behavior="alternate" Defines the type of trick the Marquee will use. There is another behavior besides alternate, its "slide" This causes the text to scroll in and stop as if it were sliding. Alternate simply bounces the text back and forth. This attribute is not required to define a direction.

scrolldelay="200" Sets an amount in Micro Seconds to slow the Marquee down.

scrollamount="200" Sets an amount in Micro Seconds to speed the Marquee up.

You can also embed images into a Marquee, simply place the image code between the Marquee tags and specify how you want it to scroll.

Example Script:

<marquee direction ="left" scrolldelay="200"> Text or Images Here </marquee>

</body>
</html>

Bold, Italics, Etc.

Aside from the various attributes found in the FONT Tags, these tags are inserted between those tags but the text still goes between the Bold, Etc Tags. There are also CSS scripts you can use in place of the conventional methods offered in HTML. We will get to those later in this guide. For now, lets look at the various Tags for this Section:

and are the open and close tags to define specified text to be BOLD

and are the open and close tags to define specified text to be Italic

and are the open and close tags to define specified text to be Underlined

<strike> and </strike> are the open and close tags to define specified text to be ~~Strike Out~~

<blink> and </blink> are the open and close tags to define specified text to be Blink (doesn't work with all browsers)

Note that these tags should be placed closest to the text you are trying to alter. Here is an example:

Lists

Here is an example of a list layout:

Store List

Coffee

Milk

Lists are a simple set of tags. One set of tags opens and closes the List area, while the listed items only need a single Tag to drop down to the next item in the list. There are two kinds of Lists; the first is an unordered list and the second is an ordered list. here are the Tags:

Copy and Paste these codes in the BODY area of your Script.

Headings

<h1> and </h1> Tags create a Header. The number controls the size, 1 being the largest and 6 being the smallest.

Example Script:

<html>
<head>
<title>
Your Page Name Here
</title>

</head>
</body bgcolor="white">

<h6>Welcome To My Page.</h6>

</body>
</html>

Text Alignment

You use the align="center" attribute in things like Paragraphs and Headers. Here are some other attributes to define alignment:

align="left"

align="right"

valign="top"

valign="middle"

valign="bottom"

The Top, Middle and Bottom or VALIGN attributes are vertical alignments typically used in Table Tags. Here is an example of ALIGN attributes in a Paragraph Area:

Content Text