...

View Full Version : Css & HTML Start Up



pantherkitten9
02-12-2005, 06:04 AM
OK, here is question one:
do i need a style.css sheet for each html page i have if each one is different? like for the columns i know i was told the style.css sheet needed to be in the same directory as the column.html file.


second question:
can i use frames with CSS? and how do i create the code for it?? or is there a cheat sheet for it? i know the normal html frames page, and how to target where i want the link to open, but CSS is the class i missed in college. :confused:

i can write normal html leasily. but after a few years of not being in school, i have read all across the net to use CSS. so i am taking a crash course from websites on CSS.

sorry, if my questions seem slightly stupid... but i have looked for help on sites that have tutorials and they have yet to answer my questions.

:thumbsup: i appreciate any help i can get. i have to do the site on a free site right now until i can get it up to where my soon to be :( father-in-law can approve of it. he wants to pay for the hosting. so i need some help from those with more knowledge than me. please help.


thanks for any replies i get.

_Aerospace_Eng_
02-12-2005, 06:12 AM
okay applying css to a frameset wont do u any good because its the pages contained within the frameset that need to be styled, you can use the same style sheet across all of your pages, giving different references to different parts of the page, for a start on css you may want to check out this site http://www.w3schools.com/css/default.asp and a style sheet can be in any directory you want it to as long as you give the correct directory when trying to link to an external style sheet

hemebond
02-12-2005, 06:17 AM
This is a good place to start (http://www.htmldog.com/guides/htmlbeginner/). Just bear in mind, when he says HTML, he actually means XHTML. Other than that, it's a very good tutorial.

rmedek
02-12-2005, 06:20 AM
Hi,

Well, there are a few answers to your questions but I'll go through some of the easier/more common ones.

First of all, try these great tutorials on the mystery of CSS: http://www.htmldog.com and http://www.w3schools.com. There are others, but those two are my favorites.

CSS can be put in every document, or in every tag, even, but the best way to think of it is as a global file that applies style to your structure. So, yes, you can use it on frames, lists, paragraphs, iframes. Here's how you do it.

1. After you learn how ;), create your stylesheet. Name it whatever.css. I like style.css.

2. Call it up in the document you want it to apply to. Say you want index.html to use the styles provided in style.css. You put this in between your <head> tags in index.html:


<head>
...
<style type="text/css" media="screen">
@import url(style.css);
</style>
...
</head>

There are different ways to call it up, but this is my favorite method right now. It imports a stylesheet from style.css (if the file was in "/css/style.css" you would type "url(/css/style.css)", see?). This method makes sure that browsers that would trip up on a stylesheet don't see it.

About frames or iframes, you would just have to make sure that it looked in the right place for a stylesheet. Once you get a handle on the CSS, though, you will probably not be too excited to use frames again.

That's about it, hopefully more people will chime in on the stuff I forgot; just make sure to visit those links and you'll be fine.

jeez I'm slow. Do what they said :)

hemebond
02-12-2005, 06:43 AM
<head>
...
<style type="text/css" media="screen">
@import url(style.css);
</style>
...
</head>

There are different ways to call it up, but this is my favorite method right now. It imports a stylesheet from style.css (if the file was in "/css/style.css" you would type "url(/css/style.css)", see?).I personally wouldn't recommend this method. It can cause problems, especially when it comes to advanced CSS techniques.

rmedek
02-12-2005, 06:51 AM
I personally wouldn't recommend this method. It can cause problems, especially when it comes to advanced CSS techniques.

I'm not familiar with any problems (except for the legacy browser bit)... can you elaborate?

pantherkitten9
02-12-2005, 06:59 AM
Is there a way to make a fixed menu on the left side of the page, and have it target the right column? (i called it the right column cuz i wasnt sure how to explain it.)

i have the pic in my as what i want to do. its important to me to get it right, since it is a multi-use website for mine and my fiance's business'.

i would also like the right column tohave a fixed background and have the text hover (? dont know if i got the term right).

http://pantherkitten9.tripod.com/ <-- this is my cheesy site. i call it cheesy cuz its not even the slightest bit in any way close to being done. :(
and it has to be almost done to get his father to pay for the hosting...

i have been designing my own graphics for the site, but havent figured out how to incorporate them into the css yet. i will though. very determined and tired.

and thank you for your replies. :thumbsup:

rmedek
02-12-2005, 07:07 AM
http://htmldog.com
http://www.w3schools.com

One thing at a time. You're going to need to know the basics before you target the left and right anything. Patience is a virtue, they say. Well, somebody said it. I don't know who. :)

pantherkitten9
02-12-2005, 07:56 AM
OK, according to http://www.htmldog.com/ ... I only need the style.css if i want to change multiple pages with ease.. but yet i can do stand alone pages too instead. is that right?

i'm going through each step on that site, already did the "html" part.. now am working through the css part. still very confused looking at the css code :confused: ... i think i can get it if i dont try to use the style.css sheet to update multiple pages. do i need it to start out?

_Aerospace_Eng_
02-12-2005, 08:02 AM
well you dont really need css but its easier to position an style multiple items that you may have across the pages, you can have a different style sheet for each page if you want thats up to you, i personally use one style sheet throughout the whole site, and just use different classes and ids for different elements

pantherkitten9
02-12-2005, 08:22 AM
but i am stuck on the Selectors, Properties and Values section... this is the page i am reading:
http://www.htmldog.com/guides/cssbeginner/selectors/

where exactly do i put the body selector? :
body { font-size: 0.8em; color: navy; }

and the font selector? :
(such as font-size: 12pt)

could someone give me an example of each? the next section is on colours... so it only gives so much info. and the example is just not coming out for me.
thanks again!

rmedek
02-12-2005, 08:42 AM
Essentially the "selector" is the tag in the HTML that's affected, and the "properties" are what you are telling it to do:


selector { properties }

For example, in your HTML you might have this:


<h1>My Website</h1>
<p>This is a paragraph in my website.</p>

Now let's say you want to make the header (h1) a font... Verdana, for example, at 14px, and you want the paragraph to be verdana also, at 11px. These selectors and properties are all placed in a text file (much like you do with HTML) and labeled "whatever.css". Here's the CSS for this example:


h1 {
font-family: verdana, sans-serif;
font-size: 14px;
}

p {
font-family: verdana, sans-serif;
font-size: 11px;
}

Now, since the HTML you have is all enclosed in the <body> element, we could just make all the text in the body Verdana, right?


body {
font-family: verdana, sans-serif;
}

h1 {
font-size: 14px;
}

p {
font-size: 11px;
}

Hopefully now you can start to see how this works. After you learn a few shortcuts your CSS will start looking like this:


body {
font: 11px verdana, sans-serif;
}

h1 {
font-size: 14px;
}


To get an idea how this all looks when it's put together, check out a very simple site I did:

http://lostbarrioartists.com
and its CSS file:
http://lostbarrioartists.com/css/style.css

Hope this helps,

pantherkitten9
02-12-2005, 08:56 AM
ok, i was not understanding what they were saying. but now it makes since. i was trying to put that code in the html file instead of the css file.
i really appreciate the help and i am sorry for asking so many questions.

i shouldnt have missed that class when i was going to school. i am so regretting it now.

well, i will give it another try with the info you have provided. thank you very much. :cool:

pantherkitten9
02-12-2005, 06:13 PM
ok, i am starting to get the hang of it very slowly. normally i am a fast learner but this is confusing.

i figured out how to center my text, but what about images?
how do you center an image in a no column page?
or do i have to use columns?

please help me out again. my image shows but its not centered.

thanks for the replies.

rmedek
02-12-2005, 06:18 PM
:)

One thing at a time. I have a feeling this thread can stretch for the next, say, five years. Just kidding around.

Your question is answered in the HTML/CSS FAQs (http://codingforums.com/showthread.php?t=35014), the easy answer is to apply "margin: 0 auto" to it.

Lots of little problems are going to come up, and considering you read the tutorial yesterday you are not going to be able to do everything you want until you practice a bit and take it step by step. Instead of building the massive, dream site you want now, start slow and build a nice, tiny little site until you get the hang of things.

A great resource, by the way, is Google (http://google.com). You'd be surprised how easy it is to find the answers to these questions without having us walk you through it.

Good luck!

pantherkitten9
02-13-2005, 02:15 AM
i gave those links a try. and i couldnt figure out how to place them in the css or the html file. the problem with the tutorials is that they arent detailed enough. and sometimes they dont have the answer you need.

but i will keep looking across the net to find the answers i need. thank you for your help.

:thumbsup:

rmedek
02-13-2005, 07:24 PM
True, tutorials don't have all the answers... I guess I'm just in that whole "give a man a fish/teach a man to fish" mindset lately :D

If you can't figure out your other problems, as you need help it's okay to start another thread... it'll help out the forum searches for people who have the same issue you do (i.e., problem centering an image).

Jalenack
02-13-2005, 07:34 PM
about centering images :)

rmedek, i don't think margin: 0 auto will work here. Images are inline elements, meaning (in layman speak) they will not create a new line when they are finished. Using margin: 0 auto only works on block-level elements. If you wanted to center an image..as well as put it on its own line:

.centerimg {
display: block;
margin: 0 auto;
}

Other methods involve floating, which is a bit complicated for beginners...try that one

rmedek
02-16-2005, 06:07 AM
D'oh! You're right, I forgot about image being inline. That's the right fix, though.

So... is there any way to have an image float without it being on it's own line, without resorting to this (http://alistapart.com/articles/crosscolumn/)?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum