Here are some examples of how you can style your webpage. To view the code for this page just right click and select view source. You can use this file as a resource to build your own styled page!
Stlying your webpage is a great way to make your page stand out and really look professional. Remember, presentation is everything!
Note:If you are using one of the free Content Management Systems (Wordpress or Joomla) that I recommend in the Getting Started Guide your website already uses is using a stylesheet. This tutorial is geared for those wanting to apply styles to their stand alone webpages (those not built with a CMS). For example, I used the styles you see on this page to make my eBay About Me page & eBay Classified Ad look like my main LCOnline1.com site.
Now on to the examples of how you can style your webpage!
BACKGROUND COLORS
This webpage is setup to have a solid background color with the main content contained in a table with a white background in the center of the screen. Colors on a webpage are defined using something called a Hex Color Code where each color is defined by a 6 digit letter & number combination. The background color for this page is #8db6b6 and the background for the table is #ffffff. You can see these digits in the source code of this webpage and change them to fit your needs. You can find the code for the color you want on the Hex Color Code Website Resource.LINK DECORATIONS
Links with this style will display in light blue like this www.lconline1.com. When you hold your mouse over the link, it will change to red and become underlined. You can change this by changing the code for the a, a visited and a:hover coding.THE H3 TAG
The H3 Tag - Used to display large text, styled in a nice bolded Georgia font!
DROP CAPS
Drop Caps - Makes the start a paragraph look neat!THE NOTE CLASS
The note class - Draws a nice box around the text. Use it to make important text selections really stand out!
THE ALERT CLASS
The alert class - Same as the note class but with a different background color!
Give It a Try
Try playing around with the code and see what you can do or feel free to use it as is. Just right click and select view source to see the code for this page. It should open in a text editor where you can save it to your computer with the extension .html to make it a webpage. If you have any questions or need help, feel free to ask a question in the support forums.Get Updates
Sign up for my free newsletter and get email updates and you'll also always have the most up to date information on what's going on in the world of internet marketing and what I'm doing to maximize my online earnings. Whenever I write a new tutorial that I distribute for free on my website, you'll know about it! Just fill in your name and email address. You'll email will never be shared with a third party and you can unsubscribe anytime.|
Subscribe to my free Newsletter |