Fun with HTML (tutoral)

Louie · #1 09-11-1999, 08:03 PM

I apologize in advance if some of this stuff doesn't work.
I did this only in Notepad.

Here's a reference to do all the neat things you can do with HTML.
Just copy how the code is done and that's all.

Part I - The Basics

Bolding:

words in bold

words in bold

Italics:

words in italics

words in italics

Underline:

words underlined

words underlined

Strikeout:

<strike>words crossed off</strike>

<strike>words crossed off</strike>

Centering text:

centered text

centered text

Marquee (only works in Internet Explorer):

<marquee>scrolling words</marquee>

<marquee>scrolling words</marquee>

Bouncing Marquee (only works in Internet Explorer):

<marquee behavior="alternate">bouncing words</marquee>

<marquee behavior="alternate">bouncing words</marquee>

Part II - Images and Hyperlinks

To display an image:

<img src="web address of image goes here" alt="alt tag goes here">

So to display my "thumbs up" picture with the tag "cool", I would type down-

<img src="http://members.aol.com/lou826/thumb.gif" alt="cool">

<img src="http:/members.aol.com/lou826/thumb.gif" alt="cool">

To make a hyperlink:

<a href="web address goes here">words to click on</a>

So if you wanted to link to The Onion, you would type down-

<a href="http://www.theonion.com">click here to read The Onion</a>

<a href="http://www.theonion.com">click here to read The Onion</a>

Part III - Fun with Fonts

To change font type:

a bunch of words

Replace © with the name of the font you want to use.
So if you wanted to change the font to a typewriter style (Courier New),
you would type down-

a bunch of words

a bunch of words

To change font size:

words to make bigger or smaller

Replace © with size numbers 1 2 3 4 5 6 or 7.

size 1
size 2
size 3
size 4
size 5
size 6
size 7

To change font color:

words in color

Replace © with Red, Orange, Yellow, Green, Blue, or Purple

Red
Orange
Yellow
Green
Blue
Purple

Part IV - Symbols!

These symbols can be found under the font names "Wingdings" and "Webdings".
To use them, use the "To change font type" trick shown above.

Key:
`1234567890-=
~!@#$%^&*()_+
ABCDEFGHIJKLM
NOPQRSTUVWXYZ
[];',./\
{}:"<>?|

Wingdings Symbols:

`1234567890-=
~!@#$%^&*()_+
ABCDEFGHIJKLM
NOPQRSTUVWXYZ
[];',./\
{}:"<>?|

Webdings Symbols:

`1234567890-=
~!@#$%^&*()_+
ABCDEFGHIJKLM
NOPQRSTUVWXYZ
[];',./\
{}:"<>?|

Hope this helps out.

Louie · #2 09-11-1999, 08:07 PM

Yes! It all worked, except for the http://members.aol.com/lou826/thumb.gif picture. Oh well. Hope I helped you all.

Louie

Ringo · #3 09-11-1999, 08:44 PM

Ringo · #4 09-11-1999, 08:47 PM

Hey Louie! Thanks!

Kamino Neko · #5 09-11-1999, 08:54 PM

<marquee behavior="alternate">This could be fun!</marquee>

------------------
'They couldn't hit an Elephant from this dist...!'

Last words of General John Sedgwick

rowrrbazzle · #6 09-12-1999, 08:17 PM

<marquee behavior="alternate">I hate ping-pong!

</marquee>

Sassy · #7 09-13-1999, 04:41 PM

I have to try this

Strainger · #8 09-13-1999, 05:33 PM

underline?

Strainger · #9 09-13-1999, 05:35 PM

Greek Symbols?

abgdezhq

Strainger · #10 09-13-1999, 05:37 PM

manhattan · #11 09-13-1999, 05:40 PM

<marquee behavior="alternate"> Louie Rocks!
</marquee>

------------------
Livin' on Tums, Vitamin E and Rogaine

manhattan · #12 09-13-1999, 05:42 PM

Does it work in a sig?

------------------
<marquee behavior="alternate"> J E T S JetsJetsJets!
</marquee>

manhattan · #13 09-13-1999, 05:44 PM

What about just the color?

------------------
J E T S JetsJetsJets!

Strainger · #14 09-13-1999, 06:09 PM

Manhattan, try removing the spaces between codes. Also remember to put "quotes" around the name of your font color.

manhattan · #15 09-13-1999, 06:12 PM

Like this?

<marquee behavior="alternate">J E T S JetsJetsJets!</marquee>

------------------
Livin' on Tums, Vitamin E and Rogaine

manhattan · #16 09-13-1999, 06:13 PM

And now lets try the sig.

------------------
<marquee behavior="alternate">J E T S JetsJetsJets!</marquee>

manhattan · #17 09-13-1999, 06:16 PM

OK, no scrolling for me. How 'bout the color?

BTW, TubaDiva: Louie created a remarkable tutorial here. Can it be moved to the FAQ. In the alternative, can you delete all the "I'm gonna try this" posts (including mine)?

------------------
J E T S JetsJetsJets!

moriah · #18 09-13-1999, 08:41 PM

I think the create-your-sig-screen specifically states that html and images are turned off for sigs.

Peace.

Strainger · #19 09-13-1999, 11:52 PM

What I'm wondering is why UBB created its own code for bold and italics when it's not a whole lot different from the HTML code. To relieve us from having to use the shift key so much, maybe?

I'm also wondering how Louie was able to list the syntax for the HTML commands without the code being executed. Additional HTML code?

BTW, thanks very much for the tutorial, Louie!!

TubaDiva · #20 09-14-1999, 12:45 AM

Quote:

BTW, TubaDiva: Louie created a remarkable tutorial here. Can it be moved to the FAQ. In the alternative, can you delete all the "I'm gonna try this" posts (including mine)?

I think this is a keeper.

Thank you very much, Louie.

Quote:

What I'm wondering is why UBB created its own code for bold and italics when it's not a whole lot different from the HTML code. To relieve us from having to use the shift key so much, maybe?

Some boards have html coding turned off; we allow both html and UBB.

your humble TubaDiva/SDStaffDiv
for the Straight Dope

#21 09-14-1999, 06:16 AM

This should be bolded red

<strike>These words should be in strike-out.</strike>

Lessee if this works, now.

BunnyGirl · #22 09-14-1999, 03:09 PM

Louie, you are a prince among men! Thanks for the tutorial!!!

3 cheers for Louie!

manhattan · #23 09-14-1999, 03:19 PM

moriah sez:

Quote:

I think the create-your-sig-screen specifically states that html and images are turned off for sigs.

Oh, sure, if you’re one of those people who read that kind of stuff.

(manhattan skulks away, embarassed……)

------------------
Livin' on Tums, Vitamin E and Rogaine

moriah · #24 09-15-1999, 12:50 AM

<body>
Strainger posted:
<dl>
<dl><tt>What I'm wondering is why UBB created its own code for bold and
italics when it's not a whole lot different from the HTML code. To relieve
us from having to use the shift key so much, maybe?</tt></dl>
</dl>
As mentioned, it's possible for the admins to turn off html and make us
use just ubb coding.  So, ubb coding had to be different than html.
<blockquote> 

<tt>I'm also wondering how Louie was able to list the syntax for the
HTML commands without the code being executed. Additional HTML code?</tt></blockquote>
Basically, yes.  There is a html code for the open angle bracket that
begins with an ampersand ( &lt; = <
) for when you want brackets to show instead of having them be interpreted
as code.

It is easier, though, to type and format in a WYSIWYG
editor (such as Netscape's Composer
®) that will export what you type as html code. 
Then you just cut and past the code into the reply box on the board.

Also, if you want to see the coding that Louie did, use your browser's
view
code command.  In Netscape ®
it is View / Page Source.

-moriah
</body>

moriah · #25 09-15-1999, 12:52 AM

Of course, it helps to remember to check the page breaks. **sigh**

Louie · #26 09-15-1999, 12:56 AM

Anytime, TubaDiva. Finally, I do something good on this board.

Strainger:

Yes, I used additional HTML codes for < and >. To make a <, you type in (without the *'s):

&*l*t*;

And to make a >, you type (without the *'s):

&*g*t*;

Straight Dope: now in COLOR

E1skeptic · #27 09-15-1999, 01:05 AM

So, I can post using the NS composer?

WOW!

moriah · #28 09-15-1999, 08:09 PM

<body>
Using NS Composer is a bit tricky because you need to cut and paste the code into the ubb, and for some strange reason, NS won't let you copy the code when you pull it up in the code views.

So, what do you do?  After using the spelling checker, save your highly formatted Composer page (I usually save it to a dummy file, <tt>foo.htm</tt> that I keep reusing).  Then  use Edit / HTML Source
to see the html-coded page in a word processor (use <tt>notepad.exe</tt>
found in your <tt>Windows</tt> directory).  Then you can highlight
and copy and paste the text into the ubb (CTRL-C /
ALT-TAB / ALT-TABE / CTRL-V).

PEACE
</body>

moriah · #29 09-15-1999, 08:13 PM

<body>
Using NS Composer is a bit tricky because you need to cut and
paste the code into the ubb, and for some strange reason, NS
won't let you copy the code when you pull it up in the code views.

So, what do you do?  After using the spelling checker, save your
highly formatted Composer page (I usually save it to a dummy file,
<tt>foo.htm</tt>
that I keep reusing).  Then  use Edit / HTML Source
to see the html-coded page in a word processor (use
<tt>notepad.exe</tt>
found in your <tt>Windows</tt> directory).  Then you can highlight
and copy and paste the text into the ubb (CTRL-C /
ALT-TAB / CTRL-V).

PEACE
</body>

moriah · #30 09-15-1999, 08:16 PM

Yeah, I know I posted that twice. Was trying to find a way to get rid of those damned invisible carriage returns in the UBB.

Peace.

Jewel · #31 09-16-1999, 12:28 AM

Thanks for the info, Louie!

E1skeptic · #32 09-16-1999, 02:52 AM

</head>
<body>
Let's see if
this works
</body>
</html>

E1skeptic · #33 09-16-1999, 02:54 AM

Thanks, Moriah!

Strainger · #34 09-16-1999, 02:24 PM

Does this throw you off?

GregAtlanta · #35 09-17-1999, 12:27 AM

Just trying some stuff.

<marquee>This oughta be moving.</marquee>

Louie · #36 09-17-1999, 12:58 AM

Don't mind me, just keeping this tutoral afloat.

<marquee behavior="slide">

</marquee>

------------------
"The more beautiful the rose, the more thorns it hides underneath." - Louie

moriah · #37 09-17-1999, 03:42 AM

Strainger,

You are cruel.  But I've seen that one before as well as other practical html jokes at WebJokers.com.

Peace.

Louie · #38 09-18-1999, 01:19 AM

I'm still receiving compliments for the tutoral.

Thanks everyone.

Still trying to keep this afloat.

Kamino Neko · #39 09-18-1999, 01:29 AM

</marquee>

<marquee>Just screwin' around.

</marquee>

Louie · #40 09-18-1999, 01:57 AM

<IMG SRC="http://pluto.beseen.com/hit.counter?account=thebiglou@hotmail.com-&font=RedOnBlack&base=0" BORDER=0>

B

Louie · #41 09-18-1999, 01:58 AM

Uh, I mean...

B

C perfect

Sealemon88 · #42 09-18-1999, 03:32 PM

testing this out

<wanna see if this prints>

Sealemon88 · #43 09-18-1999, 03:34 PM

well, well, well....just found out that placing text in the "<>" symbols doesn't work...It just disapears

#44 09-18-1999, 04:28 PM

let's see--

This is not in bold
This should have italics
But it probably doesn't.
<strike> This is crossed out. </strike>

 Is this centered? 

<marquee> This is not moving. </marquee>

<marquee behavior="alternate"> Or bouncing </marquee>

The best Monty Python site I've ever seen.

 This font is Westminster... You may not have it. 

 BYZANTINE!! 

 That is what I wanted to do in the "Brithael V Byzantine thread. 

<sarc> I am confident in my HTML skills. </sarc>

------------------
"Of course we could make school more challenging Lisa. But then the stupider children would be in here complaining... furrowing their brows in a futile attempt to comprehend the situation."

#45 09-18-1999, 04:36 PM

One error in the whole damn thing and it's the one that makes me look arrogant. I meant:

[sarc] I am confident in my HTML skills. [/sarc]

indicating sarcasm.

PS Did this quote?

Quote:

Thanks for the info, Louie!

Jewel said it, and I share the sentiment.

#46 09-18-1999, 04:42 PM

I keeep posting, but this is fun, and besides, this thread must stay at the top for my fellow clueless newbies.

What does nesting the HTML do?

Italics and bold?

Louie · #47 09-19-1999, 02:11 AM

I'm going to try to make a separate web page with the tutoral on it.

<marquee>Still keeping this afloat, thanks to the BigSmily!<img src="http://www.straightdope.com/ubb/smile.gif" height="200" width="200">

------------------
"The more beautiful the rose, the more thorns it hides underneath." - Louie

Louie · #48 09-19-1999, 02:14 AM

</marquee>

I High five

Louie · #49 09-22-1999, 01:51 AM

<blink>STILL keeping it afloat.</blink>

Cessandra · #50 09-22-1999, 04:08 PM

Thought I'd bring this topic to the top while checking to see if my sig is right.

------------------
I was educated long after the discontinuation of flogging, and I have no problems with spelling or grammar.
This is because I'm not a moron.
-- Stolen from AuraSeer

<a href="http://www.shsu.edu/~stdmed17/Home.html">My Homepage</a>
<a href="http://www.shsu.edu/~stdmed17/RockyHome.html">The Rocky Horror Picture Show: Website for Virgins</a>

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Advertisements