dirt lover Posted November 17, 2006 Share Posted November 17, 2006 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html style="direction: ltr;" lang="en"><head><meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type"><title>Index<< PB Media</title><meta name="author" content="Patrick Branch"><meta name="name" content="PB Media (Patrick Branch Media)"><meta name="keywords" content="Photography and Graphic Design in California. Mountain Biking, Downhill, Motocross, Sailing, Landscapes, Seascapes"><link rel="stylesheet" type="text/css" href="pbm-styles.css"></head><body style="color: rgb(0, 0, 0); background-color: rgb(255, 196, 109);" alink="#000099" link="#000099" vlink="#990099"><div style="text-align: center;"><table style="width: 900px; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="0" cellspacing="2"><tbody><tr><th style="vertical-align: top;"><a><img src="i-filmheader.gif" alt="i-filmheader.gif" style="border: 0px solid; width: 900px; height: 139px;"></a></th></tr></tbody></table></div><table style="width: 900px; height: 40px; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="1" cellspacing="1"><tbody><tr><td style="vertical-align: top; text-align: center;"><a =""><img src="button-3.gif" alt="button-3.gif" border="0"></a></td><td style="vertical-align: top; text-align: center;"><a =""><img src="button-3.gif" alt="button-3.gif" border="0"></a></td><td style="vertical-align: top; text-align: center;"><a =""><img src="button-3.gif" alt="button-3.gif" border="0"></a></td><td style="vertical-align: top; text-align: center;"><a =""><img src="button-3.gif" alt="button-3.gif" border="0"></a></td><td style="vertical-align: top; text-align: center;"><a =""><img src="button-3.gif" alt="button-3.gif" border="0"></a></td></tr><tr></tr></tbody></table><div style="text-align: center;"><br><table style="width: 900px; height: 20px; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="width: 175px; text-align: center;" tyle="vertical-align: bottom; text-align: center;"><span style="color: rgb(255, 255, 255); font-weight: bold; font-family: Arial;"><a style="font-family: Arial; color: rgb(255, 255, 255);" href="index.html">Index</a><br></span></td><td style="vertical-align: bottom; text-align: center; width: 175px;"><span style="color: rgb(255, 255, 255); font-weight: bold; font-family: Arial;"><a href="p.html">Photography</a><br></span></td><td style="vertical-align: bottom; text-align: center; width: 175px;"><span style="color: rgb(255, 255, 255); font-weight: bold; font-family: Arial;"><a href="gd.html">Graphic Design</a><br></span></td><td style="text-align: center;" valign="bottom"><small><span style="vertical-align: bottom; text-align: center; width: 175px;"><big><span style="color: rgb(255, 255, 255); font-weight: bold; font-family: Arial;"><a href="pb.html">Patrick Branch</a><br></span></big></span></small></td><td style="vertical-align: bottom; text-align: center; width: 175px;"><span style="color: rgb(255, 255, 255); font-weight: bold; font-family: Arial;"><a href="ci.html">Contact Info</a><br></span></td></tr></tbody></table><br><img alt="i-painting2.jpg" src="i-painting2.jpg"><br><br><table style="background-color: rgb(153, 51, 0); width: 900px; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2"><tbody><tr><td style="vertical-align: bottom; width: 450px; text-align: left;"><big><font style="font-weight: bold; color: rgb(255, 255, 255);" size="-1"><big><span style="font-family: Verdana;">222</span></big></font></big></td><td style="width: 450px; text-align: right;"><big><font style="font-weight: bold; color: rgb(255, 255, 255);" size="-1"><big><span style="font-family: Verdana;">Links</span></big></font></big></td></tr></tbody></table></div></body></html> The external stylesheet (pbm-styles.css): <style type="text/css">body {background-image: url('bkgrd3.gif')background-color: #FFCC99}</style> Did I insert it right?Thanks in advance for any help. Link to comment Share on other sites More sharing options...
aspnetguy Posted November 17, 2006 Share Posted November 17, 2006 providing it is called pbm-styles.css and is in the same folder as the html document, then yes.You really need to start making your code more readable! Link to comment Share on other sites More sharing options...
dirt lover Posted November 17, 2006 Author Share Posted November 17, 2006 providing it is called pbm-styles.css and is in the same folder as the html document, then yes.You really need to start making your code more readable!Okay, thanks. The background (from the stylesheet) isn't working for some reason then.I agree... I'm using Komposer (an updated version of Nvu). It did that... Is there anyway I can use this and keep it how I want it? Link to comment Share on other sites More sharing options...
aspnetguy Posted November 17, 2006 Share Posted November 17, 2006 bkgrd3.gif is in the same folder as the stylesheet and html file? Link to comment Share on other sites More sharing options...
dirt lover Posted November 17, 2006 Author Share Posted November 17, 2006 bkgrd3.gif is in the same folder as the stylesheet and html file?Yes. The background worked when it was on the page with html, but I replaced it with css and it doesn't work. Link to comment Share on other sites More sharing options...
smiles Posted November 18, 2006 Share Posted November 18, 2006 The external stylesheet:<style type="text/css">body {background-image: url('bkgrd3.gif')background-color: #FFCC99}</style> Did I insert it right?you dont need red code ??? Link to comment Share on other sites More sharing options...
dirt lover Posted November 18, 2006 Author Share Posted November 18, 2006 Oh, okay... Link to comment Share on other sites More sharing options...
dirt lover Posted November 18, 2006 Author Share Posted November 18, 2006 I have another question. I'm am confused about <h1> / <h2> stuff. Are those used to specify parts of the body that could be specified for css?In other words, to seperate body elements so that you can define certain areas that at external stylesheet would affect?So, could I put <h1> around the header graphic, then <h2> around the main image in the body, then <h3> around the bottom bar, so that the external stylsheet could do different things for each?Also, with the paragraph tag <p>, how could I seperate different areas of text , so that an external sheet could affect different areas of text differently?<p1>, <p2> ??If you could help me with this pile of questions, I would really appreciate it. Thanks-Pat. Link to comment Share on other sites More sharing options...
jlhaslip Posted November 19, 2006 Share Posted November 19, 2006 NO, the <h1>, <h2>, etc tags are for defining levels within the "content" of the document. A document generally only has a single h1 tag set, followed by an h2, h3's etc according to the Author's wishes for the layout of the "content". If you have a math text called Algebra:101, that might be the h1 for the index page. A Review section might be the h2 tag followed by a series of h3's for the seperate chapters within the Review section. The next major section would be an h2 followed by more h3's , and on and on.The h# tags have attributes like size, font, font-weight, and these can be defined in the css file for each seperate tag.Selecting elements for styling is usually done by specifying the styles according to :1) the generic tag (ie: <p>), or 2) by specifying an "id'd" tag set, like <p id="this_one">. Id's allowed only once per page, or 3) for tags which may appear more than once on each page, classes. <p class="i_got_some_class_here">In the CSS file, examples for the <p>tag selection follow:p { attribute:value;}#this_one p { attribute:value;}.i_got_some_class_here p { attribute:value;}This is a somewhat simplified example of selectors, but you should know the difference between tag selectors, id-selectors and class selectors. To answer your concerns about how to seperate different areas of text, this is usually done by placing them inside "containers", like <div> tags. The div may,or may not, be id'd or classed.Here is a sample of a CSS file which uses all three selector types: #footer { margin-left:auto; margin-right:auto; text-align:center; clear:both; border: 1px dotted #999;}h1 { font-size: 2em;}.content_main { margin: 1em; border: 1px dotted red;}.image { margin: 0; padding: 1em; float:left;} The footer is selected by id, the content_main and image are classes, and the h1 is a generic heading tag.Hope this helps. Of course, you might also want to check out the w3schools tutorial on all this stuff. Link to comment Share on other sites More sharing options...
dirt lover Posted November 20, 2006 Author Share Posted November 20, 2006 I have been reading the tutorials, but I am confused on some things. What you wrote helped.For some reason, my stylesheet is still not working... I cannot figure out why. Same folder, inserted right... :)This is what the pages are going to look like (but with that table of white text over the buttons with css):1. title image2. table of links layered over table of buttons3. content image (with text over it on some pages)4. bottom bar/table with links.__________________I can change the color, font, and size of the links, but I cannot remove the underlines. What should I do for the links (the ones on the page above, are only text to show what it should look like)? Link to comment Share on other sites More sharing options...
jlhaslip Posted November 20, 2006 Share Posted November 20, 2006 a:link {text-decoration:none } Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now