css ul li

здравейте

не знам как точно да го нарека, тъй като ми кипи главата, но ако някой се сеща за пример с който само с CSS да се постигне, че всеки 1,3,5,7,... елемент от листа да има различен стил. нещо като: nth-of-type(n)... някакъв тип selector като a[class='име на класа']

благодарности

П.П.
точно това, но не бачка тъй катo е css3. нещо за 2 за да може да го подкарат машините?
[линк]

нещо такова става ли

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<style type="text/css">
.x0{
background : #F0F0F0;
color : #F09030;
}
.x1{
background : #E0E0E0;
color : Navy;
}
</style>
<script language="JavaScript" type="text/javascript">
var n =0;
</script>
<title>Experiment</title>
</head>

<body>
<ul>

<script>
// document.write('<li type="disc" class="x' + n + '">'); n = (++n % 2);alert(n);
document.write('<li type="disc" class="x' + n + '">'); n = (++n % 2);
</script>111111111111111111111111</li>
<script>
document.write('<li type="disc" class="x' + n + '">'); n = (++n % 2);
</script>111111111111111111111111</li>
<script>
document.write('<li type="disc" class="x' + n + '">'); n = (++n % 2);
</script> 222222222222222222222222</li>
<script>
document.write('<li type="disc" class="x' + n + '">'); n = (++n % 2);
</script> 333333333333333333333333</li>
<script>
document.write('<li type="disc" class="x' + n + '">'); n = (++n % 2);
</script>4444444444444444444444444</li>
</ul>

</body>
</html>

Ако списъкът ти е сравнително къс и ако това долу работеше под IE6... ;))))

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"

"[линк]">

<html xml:lang="bg" xmlns="[линк]">

<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<meta http-equiv="content-language" content="bg" />

<title>1 3 5 7</title>

<style type="text/css" media="screen">

li,li+li+li,li+li+li+li+li,li+li+li+li+li+li+li{color:#00f}

li+li,li+li+li+li,li+li+li+li+li+li{color:#f00}

</style>

</head>

<body>

<ul>

<li>Едно</li>

<li>Две</li>

<li>Три</li>

<li>Четири</li>

<li>Пет</li>

<li>Шест</li>

<li>Седем</li>

</ul>

</body>

</html>

Иначе защо не пробваш с Javascript, или в конкретната ситуация и той е забранен?

[линк]
[линк]

[линк] - блог, уеб дизайн, лекции, интернет сигурност

при крайна ситуация ще се ползват скриптове. а скписъкът или ще е с 3 или с безброй, но това не го знам.

за момента има 2 неща аз който остава да се ползва javascript, тъй като без него е нелечимо. едното е това а другото е да се направи така, че при ИЕ 6 max-width да проработи. при вторият случай пробвах с expressions в css-то ма не стана или аз обърках нещо.

само че се поддържа само от ФФ2 и може би Опера 8-9 (мързи ме да проверявам, щото така или инак не ти върши работа :Р :)

Edit Ediiiiit :)
Ако ползваш IE7 на Дийн Едуардс, той поддържа nth-child... За справка:

[линк]

There are three determined states the cat could be in: Alive, Dead, and Bloody Furious.

nth-child не работи под ФФ2, опера също а за ИЕ7 не ми остана време да пробвам. утре сутрин ще проверя още примери който открих из мрежата и ще пиша. ако някой открие нещо, да остявя тука

и при ИЕ7 е същото

за момента ще го оставя със style в самият код и после вече ще го пусна през javascript

Има решение - behaviour за IE и moz-binding за FF. Ако искаш още подробности, кажи.

трябва ми да работи от ФФ1 до случайно 3, ИЕ5 до 8??:), опера 8+++++, сафари и кonqueror.

поради данните които има по страницатаи по това как е направена не мога да ползвам хбл и моз-бин...отпада.

относно поведенията. дай някой код който не ползва js

Май най-лесно е да се направи страницата с PHP (с масиви, цикли и променливи) и с HTML тагове и CSS, поддържани от нужните браузъри. После upload-вам, отварям с IE, save as Web page, HTML only и получавам нужната ми HTML страница.

какво можеш да ползваш? Освен CSS?

There are three determined states the cat could be in: Alive, Dead, and Bloody Furious.

нищо. това е проблема.

правя прототип на една страница и се макетира само. от пнг и висио файлове прахвърлям на хтмл и ксс. за начало js е забранено, но после може и да влезне в употреба.

за програмните езици не мога и да мисля, нито да казвам на тези които ще правят останалата част какво да правят ако е 3 елемент от лист или 2 ред от таблица.

както казах, оставил съм тез 2 неща за накрая ако не се намери възможност с ксс да се направи, то да стане с js.

благодарности

чудеса за нищо :)

Най-ефективния метод ко не ползваш джс е през пхп да извъртиш един цикъл и секи ен-ти ред да му дадеш клас

There are three determined states the cat could be in: Alive, Dead, and Bloody Furious.

единственото нещо което зависи от мен е хтмл и ксс. нито пхп, нито джс, нито нищо. добре, джаваскрипта за момента няма да го има, но после ако не се намери нещо... ще трябва да се позлва

ако ти трябва единствено за да промениш цвета на реда т.е. да се редуват примерно бяло сиво както в примера [линк] може да сложиш един

ul{background:url(zebra.jpg) 0 0 repeat;}

background-a да има един ред сиво и един ред бяло и така. Тва разбира се ако всеки елемент ти е на един ред, иначе може да стане акано

'In this life we cannot do great things. We can only do small things with great love'

ко натисна Ctrl-+, кво ше стане?

There are three determined states the cat could be in: Alive, Dead, and Bloody Furious.

ами не е най-добрата идея ама примерно задава line-height в пиксели и фонт-а в ем или %. line-height достатъчно голям че да не се счупва при "largest" на ИЕ6<
за другите браузари дето имат зум няма да е проблем, а за firefox... еми всичко рано или късно се счупва във firefox при достатъчно дълго задържане на Ctrl и скролване :-) , а също така може за firefox и останалите да ползва n-th child като сложи фон на ли-тата които пак ще скриват фон-а на ул-то

не че е най-добрата идея просто не знам конкретната ситуация...

'In this life we cannot do great things. We can only do small things with great love'