Can I call up parts in HTML from other parts in a single page? Plz read [Archive]

View Full Version : Can I call up parts in HTML from other parts in a single page? Plz read

Anayet

October 23rd, 2001, 09:53

OK, i'm gonna ask a question that might be difficult to understand.

I want to know:

Is it possible to add something to the top of a HTML page such as a html segmant, so that it can be called up in different parts of the page, just by using a ID to refer to the segmant?

i mean for example the following (even though it is completely made up obviously - that is the track i'm trying to follow) ---

<html>
<head>
<id=style01 'style="background-color:black; color:white; border:1px solid white;" '>
</head>

<body>
<td height="15" align="center" width="443"><input type=text size=3 name="qty5" value="1" id=style01;">
</td>

Of course the above is nonsense (i'm no expert) but i would like to know whether something similar to this can be done.

Thanks in advance

meow

October 23rd, 2001, 10:38

I'm not sure what you mean. Are you talking about using the same content several times or the same style (as in you example)?

If it's the style you've got the principle right but the syntax wrong. This is one of the purposes of CSS - to be reusable.

<html>
<head>
<style type="text/css">

</style>
</head>

<body>
<td height="15" align="center" width="443"><input type=text size=3 name="qty5" value="1" class="style01">
</td>

You can use id (denoted with #style01 in the head part instead of .style01) but that would make the rule unique, it could only be used one single time on the page. So I think class serves your purpose better. If this is what you're driving at. ;)

<<EDIT>>
Anayet, there was a semicolon pasted in the above that shouldn't be there (class="style01;") :o

Anayet

October 23rd, 2001, 10:45

Thanks meow, thats brilliant, i'm taking note of this right now:)

Also, Is it also possible to use a similar principal, this time for Content, instead of style?

Thanks:)

meow

October 23rd, 2001, 11:32

Yup, CSS is cool. :)

If you liked that you'll probably like this even better. You can put all your styles in an external .css file and link to it in HEAD like so:
<link rel="StyleSheet" type="text/css" href="somefile.css">
Then you can use the styles for as many pages as you want, even cross server. Note that you don't put the <style> tags in the external CSS, just the rules.

There are more tricks to it but here are some basic things to start with.

p { font-size: .9em }
applies the style to all Ps

h1,h2,h3,h4,p { font-size: .9em }
applies the style to all Ps and all headings 1-4

p.this { font-size: .9em }
applies the style to all Ps with the class "this"

.this { font-size: .9em }
applies the style to any element with the class "this"

Originally posted by Anayet
Also, Is it also possible to use a similar principal, this time for Content, instead of style?
Do you mean static or dynamic content = should the 'bits' be visible all the time or be triggered by some action?
If static you can use for instance SSI includes. It can also be done with PHP. Basically you put a 'snip' of the page, a nav menu or something, in an external file and call it up with a single tag.
http://www.bignosebird.com/ssi.shtml

If you mean something dynamic there would be more extensive scripting involved and that's not my table.

Anayet

October 24th, 2001, 15:52

Thanks m8, i do know of css:) but i only know the VERY basic stuff like colours etc, so that code you gave was VERY useful for me. Made it a lot easier to implement some easy to change colours (took me ages to do without css:D)

Is it possible to use a similar principle or something that will allow me to add codes such as onfocus="this.blur() etc etc?

Thanks again

meow

October 24th, 2001, 16:50

Thanks m8
Sucking up, are we? :D:p If you haven't already found it you may find this site worthwhile http://www.htmlhelp.com/reference/css/ or download in .hlp format http://www.htmlhelp.com/distribution/

Is it possible to use a similar principle or something that will allow me to add codes such as onfocus="this.blur() etc etc?
You mean apply that to all links? I've seen JavaScripts around that do that but I haven't saved them .
I wouldn't use the blur trick though. It's pretty evil since it makes keyboard navigation impossible. If you _have_to_ it's a little better to use onclick instead of onfocus.