Selasa, 28 Desember 2004

HTML Requests

20.47 Unknown

Long time no post! This is a post where you guys can request a snippet of HTML code to do a certain thing, sort of like question and answer. All you have to do is leave a comment, and we'll get back to you in a comment as soon as possible.Also, to remind you, the HTML newsletter is still active. Not many people are signing up. Remember, you can get a free Gmail account if you sign up! First 5 people get Gmail accounts, and out of the next 5 people, 1 gets a Gmail account. (At least.)So, let the requests beg...


Jumat, 16 Juli 2004

Problems with Tips and Tricks

08.11 Unknown

Sometimes, our html tricks do not show up the way you want it to. Before you break your computer, look at these tips and see if you can find your html problem: Make sure you have completely read the html trick. Make sure you have written the code on one line. Make sure you put your quotes in the right places. Double-check your < and >s. Make sure that the code is put in the correct place of the document. You also have to start a page like this. If nothing worked, please go to the code help forum, and tell us your problem....


Kamis, 01 Juli 2004

Introduction to Stylesheets

05.46 Unknown

Note: Please learn other html before you advance to stylesheets.What are stylesheets???They are a sheet of code right below your <head> which change the the rest of the page, making it more stylish. It can change how bullets, paragraphs, images, etc. all look.Writing stylesheetsThe basic way you write a stylesheet is...<style type="text/css">TYPE OF HTML TAG{property: value; secondproperty, value}</style>So, let's say you wanted to change how paragraphs look. (paragraphs are made with <p> and </p>This is how you do it, if you wanted to change the color of paragraphs:<style type="text/css">P{color: "green"}</style>Observe that since we wanted to change only one property of paragraphs, we simply left out the second property.....hmmm....If that stylesheet...


Minggu, 20 Juni 2004

Create More Advanced Forms

15.23 Unknown

Here is how to create a basic form.Maybe you want to create a better form, so here are some more advanced html tips.Before I start, please make sure that you change the e-mail adress in the form code.Also, if your form does not work, try cramming the form code into one line.Okay, so here was the code for the "basic form"<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"...


Sabtu, 19 Juni 2004

Page Fading: Internet Explorer

10.10 Unknown

Did this page fade when you came into it? If it didn't you are probably using a browser other than Internet Explorer (or HTML Tips is your home page, which is highly unlikely). That fade was accomplished using this command in the head of the HTML code (crammed onto 1 line):<meta http-equiv="Page-Enter" content="blendTrans(Duration=2.0)">This "blends" the page in for 2.0 seconds when it is entered. You can change the Page-Enter to Page-Exit, Site-Enter, or Site-Exit. Also, you can change the "blendTrans(Duration=2.0)" to:"revealTrans(Duration=2.0,Transition=2)" for Circle In"revealTrans(Duration=2.0,Transition=5)" for Wipe Downor"revealTrans(Duration=2.0,Transition=10)" for Checkerboard Across. Change the Duration=2.0 to a different number for a longer or shorter transition (in seconds)....


Kamis, 17 Juni 2004

Background Color

11.03 Unknown

Replace the <body> tag with this:<body bgcolor="#00FFFF">It will make your web page have a light blue background color.Change the #00FFFF to one of these to have a different background color:#FFFF00=Yellow#FF66FF=Purple#FF6699=Pink#FF6600=Orange#FF0000=Red#CCFF99=Green#CC6600=Brown#99CCFF=Blue#6600FF=Dark Blue#000000=Black#FFFFFF=WhiteHere is an example of a web page using this html t...


Internet Explorer: Background Sound

10.57 Unknown

If you have internet explorer, then you can use this tip.This tip should be used right after the <head>:Insert this code onto ONE line:<bgsound src="http://home.comcast.net/~nilsmolina/Hecho.wav" loop="-1">And you will get background sound like this.Change the url for a different sound location.Change the loop number if you would like to specify the amount of loops the sound should play.That is how to add background sou...


Prevent Browsers from Caching

07.11 Unknown

Many browsers know that people don't always have 3 megabit connections to the internet (why are you staring at me), so they save websites onto their viewer's computer. Then, when the viewer visits the website again, the browser puts the outdated version of the web page it has saved in front of the viewer. This process is called caching. If your page is constantly updated, it is usually a bad idea to have browsers cache your website. Therefore you will need this html tip:Put this code right after the <head>:<META HTTP-EQUIV="Expires" CONTENT="Tue, 01 Jan 1980 1:00:00 GMT"><META HTTP-EQUIV="Pragma" CONTENT="no-cache">Do not worry about the queer date, but worry about putting the code onto the least lines as possible. Your page will now probably never be cached again!This web...


Rabu, 16 Juni 2004

Put in a Tiled Background

13.54 Unknown

Many people want backgrounds.So here is an html tip for it.Change your body tag (<body>) to...<body background="https://home.comcast.net/~nilsmolina/0rrgobve%5B1%5D.jpg">(make sure the above code is on one line once inserted)Your website will look something like thisTo change the little background image, change the url (http://...).That is how to put in a tiled backgrou...


Selasa, 15 Juni 2004

Justify Text

16.13 Unknown

Look at the code for justifying text:<p align="justify">bla bla bla bla blablabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>It creates this justified text:bla bla bla bla bla bla blablabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla(Unjustified text:bla bla bla bla bla bla bla bla bla bla bla blablabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla...


Align Text/Images

15.42 Unknown

To align text to the right insert this code:<p align=right>aligning text with this tip</p>It will create this:aligning text with this tipIf you would like to align the text to the left or center instead, change the right to left or center.More tips for formatting textLearn how to justify text here...to align images use the following html tip:Here is a normal image:html code=<img src=http://www.google.com/images/logo.gif>output=Here is an image aligned to the right:html code=<img src=http://www.google.com/images/logo.gif align=right>output=To make an image centered, change the right to center.You can also change the right...


Senin, 14 Juni 2004

Javascript: Print This Page

16.38 Unknown

This html tip will put the page on paper.The code for a print this page link is:<a href="#" onkeypress="javascript:if (window.print !=null)window.print();return false" onclick="javascript:if (window.print !=null)window.print();return false" title="Print this Page - or select File and Then Print from yourbrowsers menu">PrintThis Page</a>If that code is copied and pasted onto one line, it will create a link like this:Print This PageNow you can have viewers print your pag...


Minggu, 13 Juni 2004

Building a Web Page From Scratch

11.26 Unknown

Delete all the html code you have for your web page if you want to start your page from scratch! To start a web page from scratch with html insert this code: <html> <head> </head> <body> </body> </html> After you have done this, you can look at the html tips provided at this web page and use them between the <body> and </body> tags. I suggest looking at this tip first. Remember that to make a link, you use this code: <a href="http://htmltips.blogspot.com">Link</a> The link will look like this: Link Also, you may want to look at the tips about images on this site. Also, to make new lines, look at this tip.NOTE: Some tips may need to go between the <head>  and </head> . For example, all tips which use meta go in...


Hit Counter

11.20 Unknown

If you would like a hit counter on your web page like the one at the bottom of this website, then you will have to e-mail me becuase of technical difficulties... When I respond to the e-mail, I will simply give you html code which you can cut and paste into your site. Also, I will give you instructions on how to optionally edit the code to make the counter look different. If you don't like the counter, you can remove it from your site at any time. If you e-mail me, you will get a valuable html t...


Have Text Highlighted

10.38 Unknown

This is the code for normal text:HTML TEXTIt will create this:HTML TEXTTo have HTML highlighted, change the code to this:<span style="background-color: #FFFF00">HTML</span> TEXTIt will create this:HTML TEXT This html tip will make your page even fancier.Read more about text formatting h...


Senin, 07 Juni 2004

Make Advanced Tables

14.50 Unknown

Here is how to create a basic table, so you will understand the following info.Now that you've learned that, wouldn't it be nice to have a few handy table html tips?Here they are:First, we should already know that <table style="text-align: left; width: 100%;" border="3"cellpadding="2"><tbody><tr =""><td style="vertical-align: top;">Html Table1<br></td><td style="vertical-align: top;">Html Table2<br></td></tr><tr><td style="vertical-align: top;">Html Table3<br></td><td style="vertical-align: top;">Html Table4<br></td></tr></tbody></table><br>is the code for a table.And the table will look like this:Html Table1Html Table2Html Table3Html Table4I shall also stress that...


Kamis, 03 Juni 2004

Weird Tips for Scrolling Banners (Marquees)

17.01 Unknown

Before reading, click here to see how to create a basic marquee.Now, after you've read that, you are probably dying to get some tricks implanted into these marquees.See this code? It puts an image resized to a height of 33, a width of 82, and the alternative text: "google picture in a marquee for this html tip so whatever". <MARQUEE>Hi There! <IMG SRC="http://www.google.com/images/logo.gif" HEIGHT=33 WIDTH=82ALT="google picture in a marquee for this html tip so whatever"></MARQUEE>If crammed into ONE line, the code creates this:Hi There! You can also use all types of interesting html inside the <marquee> tags.So, now...


Selasa, 01 Juni 2004

Creating Numbered Lists

16.25 Unknown

Here is some basic code for this html tip.<ol><li>Item Number 1<li>Item Number 2</ol>It will create a numbered list like this one:Item Number 1Item Number 2Also, you can change the code to this:<ol type=I><li>Item Number 1<li>Item Number 2</ol>And you get the numbers in Roman numerals:Item Number 1Item Number 2You can also change the tip like this:<ol type=A><li>Item Number 1<li>Item Number 2</ol>Which creates letters instead of numbers:Item Number 1Item Number 2Finally, you can change the A or I after the type= and you will get some lowercase roman numerals or letters, instead.This tip will get the information organized in neat ways.Also, see this tip on how to make normal bulle...


Create a Little Table

12.15 Unknown

This html tip will allow you to create tables like this one:Html Table1Html Table2Html Table3Html Table4The code for that table was:<table style="text-align: left; width: 100%;" border="3"cellpadding="2"><tbody><tr =""><td style="vertical-align: top;">Html Table1<br></td><td style="vertical-align: top;">Html Table2<br></td></tr><tr><td style="vertical-align: top;">Html Table3<br></td><td style="vertical-align: top;">Html Table4<br></td></tr></tbody></table><br>When inserting the above code, make sure you put the top two lines onto ONE line.If you would like to add another cell in an existing row, simply put in another<td style="vertical-align: top;">Html Table2<br></td>in...


Senin, 31 Mei 2004

How to Create a Basic Form

14.39 Unknown

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

07.05 Unknown

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

07.00 Unknown

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

18.02 Unknown

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

15.19 Unknown

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

16.38 Unknown

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

16.18 Unknown

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

15.21 Unknown

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

13.13 Unknown

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

16.05 Unknown

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

15.52 Unknown

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

15.27 Unknown

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

17.04 Unknown

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

13.18 Unknown

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)

13.05 Unknown

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

16.14 Unknown

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

15.51 Unknown

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

15.53 Unknown

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

15.47 Unknown

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

15.32 Unknown

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

15.15 Unknown

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

14.52 Unknown

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
RSS FeedSubscribe to our RSS feed!
Follow me on Twitter!Follow me on Twitter!