Senin, 31 Mei 2004

How to Create a Basic Form

Insert the following code:<FORM action="mailto:nilsmolina@comcast.net" method="post" enctype="text/plain"><TABLE BORDER="0" CELLSPACING="0" CELLPADDING="4" WIDTH="90%"><TR><TD width="30%"><DIV align="right"><B>Name:</B></DIV></TD><TD width="70%"><INPUT type="text" name="name" size="20"></TD></TR><TR><TD><DIV align="right"><B>Email:</B></DIV></TD><TD><INPUT type="text" name="email" size="20"></TD></TR><TR><TD><DIV align="right"><B>Comment:</B></DIV></TD><TD><TEXTAREA name="comment" cols="30" wrap="virtual"rows="4"></TEXTAREA></TD></TR><TR><TD>&nbsp;</TD><TD><INPUT...


Protection from Spam Robots

Do you want to post your email adress on your web site, only to realize that doing so will probably bring you spam? Here is a way to avoid getting your email adress taken by spam robots that search HTML code. In your HTML code, display your email adress as:you&#64;random.com This displays as:you@random.comThe same thing goes for a link. Writing<a href="mailto:you&#64;random.com">Email me!</a>in the code gives you:Email me!Let people contact you and keep yourself protected from spam easily using this tip. Remember, &#64; = @....


Minggu, 30 Mei 2004

Making An Image a Link

This code will create the google logo which will link to the html tips homepage:<a href="http://www.google.com"Title="Link to Google"><imgsrc="http://www.google.com/images/logo.gif"alt="Link to Google"></a>Insert the code above onto one line and you will get this:After you have inserted the code, change the title, the url, the image source, and the alternate text (alt), and you will be done.Make many links in one image in these html tips and tric...


Jumat, 28 Mei 2004

Tips for Formatting Text

Plain old text needs a few html tips.That is why I will show some html which will improve plain old text.Html Tip 1: To insert plain old text simply insert any text between the <body> and </body> tags.Example:This is html textCode:This is html textHtml Tip 2: To make text bold, underlined, or be in italics, add the corresponding tag on the sides of the text.To make text bold, insert the <b> and </b> tags on the sides of the text.To make text in italics, insert the <i> and </i> tags on the sides of the text.To make underlined, insert the <u> and </u> tags on the sides of text.And, finally, here is a bonus tip:You can put a line through text by placing the and tags on the sides of the text.Example:This is html text in italics.Code:<i>This...


Kamis, 27 Mei 2004

Having Columns Like in a Newspaper

This is column 1 and this is column 1 and this is still column 1This is column 2 and this is column 2 and this is still column 2This is column 3 and this is column 3 and this is still column 3The source code for the colums was this:<TABLE BORDER="0"> <TR> <TD WIDTH="30%" VALIGN="TOP">  This is column 1 and this is column 1 and this is still column 1<BR> </TD> <TD WIDTH="5%"></TD> <TD WIDTH="30%" VALIGN="TOP">  This is column 2 and this is column 2 and this is still column 2<BR> </TD> <TD WIDTH="5%"></TD> <TD WIDTH="30%" VALIGN="TOP">  This is column 3 and this is column 3 and this is still column 3<BR> </TD> </TR></TABLE> When...


Selasa, 25 Mei 2004

How To Show HTML To People

Have you ever tried to show HTML code to people, only to have it really operate?For example, you type in <b>bold</b> and you just get this:boldThis is how people (including us) display HTML tags:In the previous example, we used <b>bold</b> as the displayed code. This is how I wrote that:&lt;b&gt;bold&lt;/b&gt;Look complicated? It's not. Let's break it down. The first part is <b>This is written as &lt;b&gt;Ever noticed how the things around the tags are greater and less than signs (<,>)? Well, that is used here. & l t ; is used for less than and & g t ; is used for greater than. That's essentially all you need to know!&lt; = <&gt; = >Now you can show people HTML on your website!NOTE FROM NILS:...


Marquees: Scrolling Banners

Have you ever wanted to have a scrolling banner (marquee) that goes across your web page and attracts people's attention?Use this simple code:<marquee bgcolor=pickacolor>THIS IS IN MY MARQUEE</marquee>If I type yellow in the bgcolor place that gives you:THIS IS IN MY MARQUEEYou can also just have <marquee>THIS IS IN MY MARQUEE</marquee>with no bgcolor value which gives you:THIS IS IN MY MARQUEESo use this code to attract attention and to keep your viewers on your site!Note from Geoffrey:The background color only works for Internet Explorer.Note from Nils:Now click here to get more advanc...


Senin, 24 Mei 2004

Javascript: Dialog Boxes

Here is a normal button that does nothing:This code made the button:<form method="POST"><input type=reset value="Button"></form>If you want the button to show a dialog box after being clicked, edit the code to this:<form method="POST"><input type=reset value="Alert" OnClick="alert( This is an alert! )"></form>That results ...


Minggu, 23 Mei 2004

Javascript: Back and Forward Links on Your Site

In this html tip, you can have little buttons or links which copy the functions of your browsers back and forward buttons.Let's show you how to make buttons:<FORM METHOD="post"><INPUT TYPE="button" VALUE="BACK" OnClick="history.go( -1 );return true;"><INPUT TYPE="button" VALUE="FORWARD" OnClick="history.go( 1 );return true;"></FORM>If you insert this code onto one line, you get this:You can delete the forward button section and you only get a back button.This is the code for only a back button: (remember to put it on ONE line)<FORM METHOD="post"><INPUT TYPE="button" VALUE="BACK" OnClick="history.go( -1 );return true;"></FORM>If you change the VALUE="BACK" to something else, too, you can get something like this:Nice, eh?Hyperlinks...


Kamis, 20 Mei 2004

Have a Title

Look at the top, top, top of your browser window.It should say something like: Html Tips and TricksAlso look elsewhere on the monitor, and the name may show up somewhere else, too. It might show up at the bottom, bottom, bottom depending on the OS you are using.Let's say that on your website, the top of the browser window says: New Page 1.That's BOR-ING, isn't it?To change it, simply insert the below html code:<title>Htmltips.blogspot.com Rocks!</title>Okay, fine, if you want you can change the text a bit.But, yes, how about you have a tit...


Making Bullets

Making a bullet is as easy as making a link!This is what you do for this html tip:Look at this bullet:This is next to a bulletIt was made with this simple code:<li>This is next to a bullet</li>Insert the above code to your web page,and then change the message to suit you nee...


Describe Your Links Another Way

Move your mouse over to this link,and keep it still for a few seconds:GoogleWouldn't your links look great with those little things?Here is how to have them on your website.Look at the code making a normal link:<a href="http://www.google.com">Google</A>Here is the normal link:GoogleAnd look at the code making the link we looked at first:<a href="http://www.google.com"TITLE="Click here to go to google">Google</A>So just insert the above code onto one line, edit it a bit, and you get a really nice link!This html tip will add some salt and pepp...


Rabu, 19 Mei 2004

Describe Your Links

This tip will only work with java enabled browsers...To add a little spice to your links, look at this:Look at a normal link: (click on it)googleThe link was made with this code:<a href="http://www.google.com">google</a>Let's add this after the url:OnMouseOver = "window.status='click here to go to google'; return true;"And the code becomes this:<a href="http://www.google.com" OnMouseOver = "window.status='click here to go to google'; return true;">google</a>And the link becomes this:googleMove your mouse to the link and look at the bottom of your web browser.Wow. It says "click here to go to google" * What a nice html tip!Modify the html code to your needs and you'll get a nice spiced up web page!* Note from Geoffrey: If you don't have a bar at the bottom of your screen...


Having a Button On Your Site

Doesn't that button look charming?Try clicking on it.If you want a button like that on your site,insert the code below:<form action="http://www.google.com" method="GET"><input type="submit" name="anything" value="Google">Simply change what I have in italics, and you are on your way to have a button on your si...


Make This Your Homepage (Internet Explorer)

If you have IE (Internet Explorer), than I have an html tip for your website!Look at the link below, and click on it.Make This Your Homepage Did you see that IE set http://htmltips.blogspot.com as the homepage?Do you want to have a nice link on your website which will do the same?Simply look at the code below:<SPAN STYLE="cursor:hand; color:blue; text-decoration:underline" onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://htmltips.blogspot.com');">Make This Your Homepage</SPAN>You can change the url or the message to suit your needs when you insert the html code.Remember to cram the html code onto ONE line.Note from Geoffrey: To change your home page back to the correct web page from http://htmltips.blogspot.com, in Internet Explorer go to the Tools...


Selasa, 18 Mei 2004

Alternative Text for Images

Another tip for image coding in HTML is alternative text. This text shows up in case the graphic does not show up, and also is displayed when the user holds their mouse over an image. Take the Google logo, for example. If I want to display, "This website rocks!" when you hold your mouse over the image, or if it doesn't load, I will use this code:<IMG SRC="http://www.google.com/images/logo.gif" ALT="This website rocks!">This gives me this result (drag your mouse over it and hold it still for a few seconds):The alternative text will also show up when the graphic isn't coded correctly like this:<IMG SRC="http://www.google.com/images/logoarughaj.gif"...


Aligning Images

This is how to insert an image with html:<img src=http://www.google.com/images/logo.gif>However, if you want to align it left or right, simply change the codelike this:<img align="left" src=http://www.google.com/images/logo.gif>You can also change the left to right.And also remember to change the url to the url of a picture you want.I aligned this google icon to the right si...


Senin, 17 Mei 2004

Open a Page in a New Window

To have a link in which, when a viewer presses it, will open a page in a new window, you need to listen to this:Insert something like this:<A HREF="http://www.google.com/" TARGET="_blank">Open Google in a New Window</a>And look at what happens:Open Google in a New WindowYou s...


Automatically Redirect Visitors

To redirect anyone who visits your site, automatically, you just need to insert html:<meta HTTP-EQUIV="REFRESH" content="0"; url=http://www.google.com">See the content = "0" thing? Change the zero to change the amount of seconds before your viewer will be redirected.I decided not to show an example on this site.NOTE FROM NILS: People with blogs on blogspot may experience problems with the tip abo...


Linking to Other Parts of the Same Webpage

Before you can link to a part of your webpage you need to mark that part of the web page.You do this by inserting this into the webpage:<A NAME="Anyname">Bla, bla, bla</A>This is how it looks to the viewer: Bla, bla, blaThen, you make the link. Here's the code:<A HREF="#Anyname">Go back to bla, bla, bla</A>Here's the output: (See what happens)Go back to bla, bla, blaOooh... Aaah...


Resizing Images

Everybody knows how to put an image in html code:Code:<IMG SRC="http://www.google.com/images/logo.gif">What it looks like to the viewer:To resize your image do something like this to the code:<IMG SRC="http://www.google.com/images/logo.gif" WIDTH="180" HEIGHT="55">And look at the output:Related Tip:Making an Image a L...


The Nice Mailto Trick

If you ever want someone to e-mail you, than mailto is your answer!When you insert this command into your html code, a link will be created.Whoever clicks on this link will have their default mail client pop up!Look at this code: <A HREF="mailto:?">Send me an email</A>This is how it looks to the viewer:Send me an emailWe can also before the question mark, type in the address which the viewer is to send the e-mail to, and look at what happens.<A HREF="mailto:nilsmolina@comcast.net?">Send me an email</A>Send me an e-mailWe can also add something to the subject line, too.Look at what happens. We have added subject=This text is on the subject line&<A HREF="mailto:nilsmolina@comcast.net?subject=This text is on the subject line&">Send me an email</A>Send...


Pages 371234 »
Twitter Delicious Facebook Digg Favorites More