1. Home
  2. Computing & Technology
  3. Personal Web Pages

Typing Over Graphics Code
Edit This Code

By Linda Roeder, About.com

Top Row:

<DIV STYLE="position:absolute; top:100; left:25; width:173; height:88;">

* Change top:100; to top:200; and your graphic moves down the page. Change the word top to bottom and the graphic can be moved to the bottom of the page instead of the top.

* Change left:25; to left:50; and your graphic moves further to the right. Change the word left to right and your graphic moves to the other side of the page.

Second Row:

<P STYLE="color:red; position:absolute; bottom:25; left:20">

* Change color:red; to color:blue; and the text color changes.

* Change bottom:25; to bottom:50; and the text inside the graphic moves up. Try changing the word bottom to top to position it from the top instead of the bottom.

* Change left:20 to left:50 and the text inside the graphic moves to the right. Try changing the word left to right to position it from the right instead of the left.

This is the Text:

<a href="http://personalweb.about.com"><B>Personal Web Pages</B></a>
<br>This Is My Site<br><a href="http://webdesign.about.com"><B>Web Site Design</B></a></P>

* You can change the text to anything you want. You don't have to have links if you don't want to.

Graphic:

IMG SRC="/library/graphics/blank_pic.gif" WIDTH="173" HEIGHT="88"

* Change this link to the link and size of your own graphic.

Last Row:

STYLE="position:absolute; top:0; left:9; z-index:-1"> </DIV>

* Change top:0; to top:50; to move the graphic down but not the text. Change the word top to bottom to move everything to the bottom of the page.

* Change left:9; to left:20; to move the graphic to the right but not the text. Change the word left to right to move everything to the right side of the page.

That should give you plenty to do with your new code. Enjoy!

Explore Personal Web Pages
About.com Special Features

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

Easy ways to connect two computers for networking purposes. More >

  1. Home
  2. Computing & Technology
  3. Personal Web Pages
  4. Templates, Scripts, Hacks
  5. Scripts: Free Copy & Paste
  6. Write Over Graphic Code>

©2009 About.com, a part of The New York Times Company.

All rights reserved.