Her Satırda Farklı Renk Kullanmak (Sahibinden.com gibi)

18-07-2014, 09:07:03

Merhaba;

Sahibinden.com'daki gibi her satırın farklı renk almasını (bir gri bir beyaz) nasıl sağlayabiliriz?

http://www.sahibinden.com/satilik-isyeri

Örnek:

http://i61.tinypic.com/jrd2qg.png

Teşekkürler

18-07-2014, 09:34:10

#2

teknolyo

http://jsbin.com/cijay/1/

Buradan yola çıkabilirsin.

19-07-2014, 09:34:04

#3

Islenska

arkadaşın verdiği örneği düşük css bilgimden dolayı yapamadım. 5 tl karşılığı yardımcı olacak arkadaşlar PM atarsa sevinirim.

19-07-2014, 11:32:48

#4

EmpaX

Islenska adlı üyeden alıntı: mesajı görüntüle

arkadaşın verdiği örneği düşük css bilgimden dolayı yapamadım. 5 tl karşılığı yardımcı olacak arkadaşlar PM atarsa sevinirim.

PM attım konu ile alakalı.

19-07-2014, 11:43:01

#5

Show

Kimlik doğrulama veya yönetimden onay bekliyor.

Tek yapmanız gereken aşağıdaki html kodlarını yapıştırmanız ve içeriğini istediğiniz şekilde değiştirmek olacaktır.

odd tek numaralı, even ise çift numaralı liste nesnesi içindir. Bu şekilde istediğiniz özellikleri uygulayabilirsiniz.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title></title>
	<style>
    	ul {
    		list-style: none;
    		border: 1px solid black;
    		padding: 0px;
    		margin: 0px;
    	}
    	li {
    		padding: 10px;
    	}
		li:nth-child(odd) {
		    background-color: white;
		}
		li:nth-child(even) {
		     background-color: gray;
		}
    </style>
</head>
<body>
	<ul>
        <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent scelerisque lectus vitae dui sollicitudin commodo.</li>
        <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent scelerisque lectus vitae dui sollicitudin commodo.</li>
        <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent scelerisque lectus vitae dui sollicitudin commodo.</li>
        <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent scelerisque lectus vitae dui sollicitudin commodo.</li>
        <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent scelerisque lectus vitae dui sollicitudin commodo.</li>
    </ul>
</body>
</html>

19-07-2014, 15:43:32

#6

husee3

Bakk hocam o her satırda farklı değil bildiğim kadarıyla bulunduğun yerin GSM sayesinde konum belirleme olayı var ya senin bulunduğun il içerisinde bir yerde bir kişinin oraya koyduğu malı arkaplanını yeşil yapıyo

19-07-2014, 15:48:06

#7

CodeS

bunu yapmanın tek yolu css nth-child kullanmaktır yada farklı yollarda üretilebilir fakat çok saçma olur css ile yapılabilir

19-07-2014, 17:06:56

#8

serdarhan

Mesajım bulunsun her daim lazım olacak bir konu

20-07-2014, 04:05:58

#9

lovemove

ÖRNEK HTML KOD:

<ul>
<li>içerik1</li>
<li>içerik2</li>
<li>içerik3</li>
<li>içerik4</li>
<li>içerik5</li>
</ul>

CSS:

<style>
ul li.nth-child(2n) { background: #fff; }
ul li.nth-child(2n-1) { background: #ccc; }
</style>