We'll go at your pace,
Volunteering to help
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
http://www.tbaygeek.ca
My HTML play area
http://www.tbaygeek.ca/test/
david wilson
Ambassador
1,707 posts
JoDee, the first few steps will be steep, but soon the syntax and options will become clearer, we are here to help, we all have had to go through what you are facing, so follow the white rabbit into the HTML world.
We'll go at your pace,
We'll go at your pace,
Kim
Ambassador
2,649 posts
Hi JoDee,
Sorry for the confusion on the instructions via the VSD instead of the Editor. I been doing VSD all morning.
I hope this is helpful and not confusing. I am going to assume that you are using the code tab in your editor and not the visual.
I looked at your source you had on your test page. I modified it to below with comments to see if there is anything that might be helpful for you. Comments tags start with <!-- and they end with -->
<style type="text/css"> is the starting tag for where you put your css code. The css code is basically parameters as to how you want something displayed. It gives you one place to change many values through out your page.
For me I like to do the following in css.
1. Put the family font and font size I wanted for my page in general in the body { }. That way the page will always use this, unless I give code to change it.
2. I define separate css code for my menu items. Most of the time you will want it to be different then the rest of the page. You will notice I created a css code called menulink. This is for the menu items. Once I have that figured out, then I call out the code value by using class="menulink" in my link tag (starts with <A ).
I have more comments in the code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<meta content="text/html; charset=unicode" http-equiv="Content-Type"/>
<meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)"/>
<meta name="created" content="Mon, 26 Jul 2010 21:23:41 GMT"/>
<meta name="description"/>
<meta name="keywords"/>
<style type="text/css">
<!--
/* These are for the body of your website
I usually include my font family and font size here also*/
body {
color:#000000;
background-color:#CCFFFF;
font-family: Verdana, Helvetica, Arial;
font-size: 12px;
}
/* These are for your general links*/
a {color:#0000FF;}
a:visited {color:#800080;}
a:hover {color:#008000;}
a:active {color:#FF0000;}
/* These are for the menu links I created*/
a.menulink {
color:#0000FF;
font-size: 19px;
font-weight: bold;
}
.menulink:visited{color:#800080;}
.menulink:hover{color:#008000;}
.menulink:active{color:#FF0000;}
-->
</style>
</head>
<body>
<p align="center">
<a href="index.html"><!--I usually call my home page index.html-->
<img title="Stony Creek General Store" border="0" alt="Stony Creek" src="images/creekpic.jpg" width="800" height="249"/>
</a>
<br /><br /> <!--creates two empty lines below image-->
<!-- This is your menu -->
<a href="index.html" class="menulink" alt="Welcome to Stony Creek">Home</a>
| <!-- This creates spaces and bar between menu items, is for 1 space -->
<a href="about.html" class="menulink" alt="About Stony Creek General Store">About Us</a>
|
<a href="contact.html" class="menulink" alt="Contact Stony Creek General Store">Contact Us</a>
<br /></p>
<!-- main body of page, after menu -->
</body>
</html>
I hope this helps you. It is good that you are going to dig in and learn. Don't be afraid to use simple code too. For example, you wanted to center your image.
Here is the simplest code that would work:
<center><img title="Stony Creek General Store" border="0" alt="Stony Creek" src="images/creekpic.jpg" width="800" /></center>
Now you don't often see the <center> tag, it is REALLY old school. But what I like about it is, that it does not include any paragraph type spacing. It is direct and to the point. I don't aways want a <div or <p tag. The nice clean tag will probably eventually go away. Because everything is being standardized. But I am holding out until it does... haaa haaa
Have a great day,
Kim
Sorry for the confusion on the instructions via the VSD instead of the Editor. I been doing VSD all morning.
I hope this is helpful and not confusing. I am going to assume that you are using the code tab in your editor and not the visual.
I looked at your source you had on your test page. I modified it to below with comments to see if there is anything that might be helpful for you. Comments tags start with <!-- and they end with -->
<style type="text/css"> is the starting tag for where you put your css code. The css code is basically parameters as to how you want something displayed. It gives you one place to change many values through out your page.
For me I like to do the following in css.
1. Put the family font and font size I wanted for my page in general in the body { }. That way the page will always use this, unless I give code to change it.
2. I define separate css code for my menu items. Most of the time you will want it to be different then the rest of the page. You will notice I created a css code called menulink. This is for the menu items. Once I have that figured out, then I call out the code value by using class="menulink" in my link tag (starts with <A ).
I have more comments in the code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<meta content="text/html; charset=unicode" http-equiv="Content-Type"/>
<meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)"/>
<meta name="created" content="Mon, 26 Jul 2010 21:23:41 GMT"/>
<meta name="description"/>
<meta name="keywords"/>
<style type="text/css">
<!--
/* These are for the body of your website
I usually include my font family and font size here also*/
body {
color:#000000;
background-color:#CCFFFF;
font-family: Verdana, Helvetica, Arial;
font-size: 12px;
}
/* These are for your general links*/
a {color:#0000FF;}
a:visited {color:#800080;}
a:hover {color:#008000;}
a:active {color:#FF0000;}
/* These are for the menu links I created*/
a.menulink {
color:#0000FF;
font-size: 19px;
font-weight: bold;
}
.menulink:visited{color:#800080;}
.menulink:hover{color:#008000;}
.menulink:active{color:#FF0000;}
-->
</style>
</head>
<body>
<p align="center">
<a href="index.html"><!--I usually call my home page index.html-->
<img title="Stony Creek General Store" border="0" alt="Stony Creek" src="images/creekpic.jpg" width="800" height="249"/>
</a>
<br /><br /> <!--creates two empty lines below image-->
<!-- This is your menu -->
<a href="index.html" class="menulink" alt="Welcome to Stony Creek">Home</a>
| <!-- This creates spaces and bar between menu items, is for 1 space -->
<a href="about.html" class="menulink" alt="About Stony Creek General Store">About Us</a>
|
<a href="contact.html" class="menulink" alt="Contact Stony Creek General Store">Contact Us</a>
<br /></p>
<!-- main body of page, after menu -->
</body>
</html>
I hope this helps you. It is good that you are going to dig in and learn. Don't be afraid to use simple code too. For example, you wanted to center your image.
Here is the simplest code that would work:
<center><img title="Stony Creek General Store" border="0" alt="Stony Creek" src="images/creekpic.jpg" width="800" /></center>
Now you don't often see the <center> tag, it is REALLY old school. But what I like about it is, that it does not include any paragraph type spacing. It is direct and to the point. I don't aways want a <div or <p tag. The nice clean tag will probably eventually go away. Because everything is being standardized. But I am holding out until it does... haaa haaa
Have a great day,
Kim
The Philosopher
Registered User
2,038 posts
For more precise locating you can use the css code: background-position: 0 0; Where the two values (0,0) are (x,y).
In otherwords, the first value moves left to right and the second up and down.
In otherwords, the first value moves left to right and the second up and down.
The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.
My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).
My Personal Website: http://www.EricSEnglish.com
My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).
My Personal Website: http://www.EricSEnglish.com
Kim
Ambassador
2,649 posts
The Philosopher wrote:
For more precise locating you can use the css code: background-position: 0 0; Where the two values (0,0) are (x,y).
In otherwords, the first value moves left to right and the second up and down.
For more precise locating you can use the css code: background-position: 0 0; Where the two values (0,0) are (x,y).
In otherwords, the first value moves left to right and the second up and down.
I sure wish they just create <left><right><center><here> <there><anywhere on the page><you know where> tags
haa haa haa life be so much easier.
The Philosopher
Registered User
2,038 posts
Kim wrote:
I sure wish they just create <left><right><center><here> <there><anywhere on the page><you know where> tags
haa haa haa life be so much easier.
The Philosopher wrote:
For more precise locating you can use the css code: background-position: 0 0; Where the two values (0,0) are (x,y).
In otherwords, the first value moves left to right and the second up and down.
For more precise locating you can use the css code: background-position: 0 0; Where the two values (0,0) are (x,y).
In otherwords, the first value moves left to right and the second up and down.
I sure wish they just create <left><right><center><here> <there><anywhere on the page><you know where> tags
haa haa haa life be so much easier.
Right! That's what standards are for, but until IE gets on board and stops doing their own thing, there will always be hacks and a thousand different ways to do one tiny little thing.
The philosopher has not done philosophy until he has acted upon the mere conviction of his idea; for proof of the theory is in the act, not the idea.
My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).
My Personal Website: http://www.EricSEnglish.com
My Web Development Company: http://www.innovatewebdevelopment.com (Created with Coffee Cup Software).
My Personal Website: http://www.EricSEnglish.com
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.
