- ARCHIVES
- » I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
- marfillaster
- » FTalkAddict
300
0
1969-12-31
I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
I'll make this tutorial strait.
this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you.
First of all download FIREFOX here 
http://www.mozilla.com/en-US/firefox/all.html
yes it is a requirement for this tutorial.
In this tutorial we will use DOM inspector addon extensively, only firefox has this addon hence the requirement.
Dom inspector can be launch by clicking Tools>Dom Inspector, or CTRL+SHIFT+I
So what is dom inspector for?
Dom inspector(DI) is an addon for firefox. see more addons https://addons.mozilla.org/en-US/firefox/
It's main use is to display the structure of a webpage.
A webpage is actually structured when you inspect it using DI, just like the structure of windows explorer.
What are the information displayed in DI?
Basically, it shows everything a webpage has, tags, attributes, id, classes, scripts, so on and so forth.
Why do we need this for CSS?
For us to easily find the class or classname of an element which is the backbone of CSS.
Lets use DI to find a classname or id
[img]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/1.png[/img]
You need to click the encircled part. That is the inspect button(IB), you will now be able to select any part of your profile.
[img]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/2.png[/img]
Example we want to get the id of control panel. In the right frame of DI, all attributes of the selected element will be listed including id and class if specified in html.
[img]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/3.png[/img]
Now that you have the id of control panel. you can now add a rule in your external css.
Say you want to make a bordered control panel
#controlpanel_1_1 {
border: 1px solid #FFFFFF
}
For more css check here http://w3schools.com/css/css_reference.asp
That's it for now, i'll update this topic according to your inquiries and feedbacks.
http://www.mozilla.com/en-US/firefox/all.html
yes it is a requirement for this tutorial.
In this tutorial we will use DOM inspector addon extensively, only firefox has this addon hence the requirement.
Dom inspector can be launch by clicking Tools>Dom Inspector, or CTRL+SHIFT+I
So what is dom inspector for?
Dom inspector(DI) is an addon for firefox. see more addons https://addons.mozilla.org/en-US/firefox/
It's main use is to display the structure of a webpage.
A webpage is actually structured when you inspect it using DI, just like the structure of windows explorer.
What are the information displayed in DI?
Basically, it shows everything a webpage has, tags, attributes, id, classes, scripts, so on and so forth.
Why do we need this for CSS?
For us to easily find the class or classname of an element which is the backbone of CSS.
Lets use DI to find a classname or id
[img]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/1.png[/img]
You need to click the encircled part. That is the inspect button(IB), you will now be able to select any part of your profile.
[img]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/2.png[/img]
Example we want to get the id of control panel. In the right frame of DI, all attributes of the selected element will be listed including id and class if specified in html.
[img]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/3.png[/img]
Now that you have the id of control panel. you can now add a rule in your external css.
Say you want to make a bordered control panel
#controlpanel_1_1 {
border: 1px solid #FFFFFF
}
For more css check here http://w3schools.com/css/css_reference.asp
That's it for now, i'll update this topic according to your inquiries and feedbacks.
Last edited by xavierkym (2007-10-30 15:03:29)
 |
- jagcopra
- » FTalker
- 175
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
Sir ken, where can we download the dom inspector you're saying uhm.. already answered >> try searching on add-ons section.. 
|
- marfillaster
- » FTalkAddict
- 300
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
i suggest if you have already firefox installed but there's no DI bundled with it, unistall it, and download newer firefox, it has DI bundled with it..
DI is not distributed as a solo addon, it is bundled in FF version 2.x.x.x
|
- eykalsyamim
- » FTalkManiac
- 842
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
yeah..great tutorials..i'm a newbie..
marfi..i want more..hehe
Last edited by eykalsyamim (2007-06-11 04:41:51)
|
- feruzz
- » Banned
- 1557
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
I also use [b]web developer[/b] in Firefox...also useful...hehe 
btw nice tutorial sir Ken 
btw nice tutorial sir Ken
|
- marfillaster
- » FTalkAddict
- 300
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
both are useful but FF is better in all aspect except image loading where IE is good at.
|
- jagcopra
- » FTalker
- 175
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
ooohhh.. i see now.. there are sites that only firefox can open..
there are sites that only firefox can open..
Last edited by jagcopra (2007-06-11 12:24:49)
|
- marfillaster
- » FTalkAddict
- 300
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
it depends on the site what they prefer, but i think its better if your page is compatible in both browser.
|
- marfillaster
- » FTalkAddict
- 300
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
microsoft.com(you cant download unless you use IE, they use active x),some profiles in friendster requires you to use IE, hehe, which is a not so good practice,
|
- jagcopra
- » FTalker
- 175
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
yup.. i dun want those who redirect their page when a firefox user views their profile.. urgh.. duh.. i suggest that they better let firefox user view their page and put a sign "Best viewed in IE".. its better that redirection..
|
- heartcore
- » FTalker
- 112
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
now i know why you love firefox so much! hehe... thanks for this sir marfillaster!
|
- frolickfriendster
- » FTalkAddict
- 310
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
[quote=marfillaster]I'll make this tutorial strait.
this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you.
First of all download FIREFOX here http://www.mozilla.com/en-US/firefox/all.html
yes it is a requirement for this tutorial.
In this tutorial we will use DOM inspector addon extensively, only firefox has this addon hence the requirement.
Dom inspector can be launch by clicking Tools>Dom Inspector, or CTRL+SHIFT+I
So what is dom inspector for?
Dom inspector(DI) is an addon for firefox. see more addons https://addons.mozilla.org/en-US/firefox/
It's main use is to display the structure of a webpage.
A webpage is actually structured when you inspect it using DI, just like the structure of windows explorer.
What are the information displayed in DI?
Basically, it shows everything a webpage has, tags, attributes, id, classes, scripts, so on and so forth.
Why do we need this for CSS?
For us to easily find the class or classname of an element which is the backbone of CSS.
Lets use DI to find a classname or id
[url]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/1.png[/url]
You need to click the encircled part. That is the inspect button(IB), you will now be able to select any part of your profile.
[url]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/2.png[/url]
Example we want to get the id of control panel. In the right frame of DI, all attributes of the selected element will be listed including id and class if specified in html.
[url]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/3.png[/url]
Now that you have the id of control panel. you can now add a rule in your external css.
Say you want to make a bordered control panel
#controlpanel_1_1 {
border: 1px solid #FFFFFF
}
For more css check here http://w3schools.com/css/css_reference.asp
That's it for now, i'll update this topic according to your inquiries and feedbacks.[/quote]
Ok Ken. what about finding errors in our html/css/js documents? How do we do that we firefox?
http://www.mozilla.com/en-US/firefox/all.html
yes it is a requirement for this tutorial.
In this tutorial we will use DOM inspector addon extensively, only firefox has this addon hence the requirement.
Dom inspector can be launch by clicking Tools>Dom Inspector, or CTRL+SHIFT+I
So what is dom inspector for?
Dom inspector(DI) is an addon for firefox. see more addons https://addons.mozilla.org/en-US/firefox/
It's main use is to display the structure of a webpage.
A webpage is actually structured when you inspect it using DI, just like the structure of windows explorer.
What are the information displayed in DI?
Basically, it shows everything a webpage has, tags, attributes, id, classes, scripts, so on and so forth.
Why do we need this for CSS?
For us to easily find the class or classname of an element which is the backbone of CSS.
Lets use DI to find a classname or id
[url]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/1.png[/url]
You need to click the encircled part. That is the inspect button(IB), you will now be able to select any part of your profile.
[url]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/2.png[/url]
Example we want to get the id of control panel. In the right frame of DI, all attributes of the selected element will be listed including id and class if specified in html.
[url]http://h1.ripway.com/mumbhaki/Tracker%20Tutorial%20%20by/3.png[/url]
Now that you have the id of control panel. you can now add a rule in your external css.
Say you want to make a bordered control panel
#controlpanel_1_1 {
border: 1px solid #FFFFFF
}
For more css check here http://w3schools.com/css/css_reference.asp
That's it for now, i'll update this topic according to your inquiries and feedbacks.[/quote]
Ok Ken. what about finding errors in our html/css/js documents? How do we do that we firefox?
|
- marfillaster
- » FTalkAddict
- 300
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
ill make a topic for that tomorrow, i feel so bad now..
|
- famous02
- » n00b
- 89
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
[quote=marfillaster]ill make a topic for that tomorrow, i feel so bad now..[/quote]
get well soon marfi
|
- frolickfriendster
- » FTalkAddict
- 310
- 0
- 1969-12-31
Re: I'll make this tutorial strait. this tutorial is primarily made for newbies who don't know anything, if you already know css, this will be enlightening for you. First of all download FIREFOX here :
can any mod delete one of the double posts? i didnt know why it happened.
|