|
|||||||
| Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read |
| Our Main Sponsor - FreelancerStore.com | |
|
|
 |
|
|
LinkBack | Thread Tools | Display Modes |
|
|||||||
| Register | FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read |
| Our Main Sponsor - FreelancerStore.com | |
|
|
|
|
|
LinkBack | Thread Tools | Display Modes |
04-06-2007, 10:44 AM
|
||||
|
||||
Efficient CSS!
I have a task on my hands, and that is to help everyone try and learn efficient CSS and XHTML for their websites, I am going to show you how to create a perfect navigation:
HTML Code:
<ul> <li><a href="#"><img src="images/image.png" alt="Link" /></a></li> <li><a href="#"><img src="images/image.png" alt="Link" /></a></li> <li><a href="#"><img src="images/image.png" alt="Link" /></a></li> <li><a href="#"><img src="images/image.png" alt="Link" /></a></li> <li><a href="#"><img src="images/image.png" alt="Link" /></a></li> </ul> Code:
li {
list-style: none;
list-style-position:inside;
display: inline;
}
HTML Code:
<ul> <a href="#"><li id="nav1"></li></a> </ul> Code:
li.nav1{
background: url(image/norm.png) no-repeat;
}
li.nav1 a:hover{
background: url(image/roll.png) no-repeat;
}
maybe someone learnt something I dont know.. Alex 
|
| Sponsored Links |
|
04-07-2007, 12:21 AM
|
|||
|
|||
|
One thing i saw in your code , you are using .png image files , My dear friend - many browsers today still cannot render png files , so for effieient css use jpg files.
|
|
04-07-2007, 11:43 PM
|
|||
|
|||
|
still IE cannot render png , maybe the newer one can but still the older version which is used by many people is not able to render png
|
|
04-08-2007, 07:48 PM
|
|||
|
|||
|
Quote:
yeah, just a qualification of that. IE 7 renders png's but still experiences a problem every once in a while. The thing about png in ie 6 is it will render any pixels that are not completely opaque as transparent. So, if you have any kind of transparency in your image your pretty much screwed. I never knew that until i just checked it out here : PNG: Current Status kinda interesting.
__________________
====================== Tyler James Lee aim : tyler james lee email : tyler@tylerjameslee.com site : tylerjameslee.com ======================
|
|
04-09-2007, 12:04 AM
|
|||
|
|||
|
thats right , png is supposed to be coming later in years , but still the latest browsers have not accepted its use
|
|
05-05-2007, 03:27 PM
|
|||
|
|||
|
Thanks for the tips im looking to try and learn CSS as i want to try and build a site using it. At the moment i only know html so CSS will be a stretch but i will look more at what you have wrote and see if i can develop a understanding of some kind :).
|
|
05-29-2007, 01:05 PM
|
|||
|
|||
|
Listen to the wise mtajim! Efficient CSS requires browser support. You can put in code that will work in new browsers, but DO NOT forget older browsers.
Kiaesi, once you learn CSS you will wonder how you lived without it. Please don't do what I did when I was trying to learn though. I over complicated it and really it's not that hard, pretty easy actually. Good luck to you.
|
|
08-01-2007, 12:36 PM
|
|||
|
|||
|
PNGs DO work in IE, but transparency is screwed in earlier versions.
|
|
| Thread Tools | |
| Display Modes | |
|
|
Linear Mode
