tablo kullanmadan nasil yapabilirim ?

tablo kullanmak istemiyorum divlerle nasil yapabilirim stunlar renkli olacak şekilde :/ wp temada kullanılacak şimdiden teşekkür ederim arkadaşlar

ul ve li leri kullanarak class atayarak yapabilirsin;
<li class="blue">..</li>
<li class="black">..</li> vb şeklinde.

.black {background:black}
.blue {background:blue} dilediğin şekilde devamını düzenleyebilirsin.

jQuery ile de yapılabilir;
HTML yapısı böyle olan bir menünün
<ul>
<li>1.li</li>
<li>2.li</li>
<li>3.li</li>
<li>4.li</li>
</ul>

jQuery bloğu da böyle olmalı;
$('ul li:even').css('background','blue');
$('ul li: odd').css('background','black');
veya
$('ul li: odd').css('background','blue');
$('ul li:even').css('background','black');

even kullandığınızda; 2. ve 4. li'leri yani çift sayılı elemanları etkiler.
odd kullandığınızda; 1. ve 3. li'leri yani tek sayılı elemanları etkiler.

bkz: http://codepen.io/anon/pen/tcejs

Css ile nth-child kullan.

şu şekilde yapmaya çalıştım görüntü olarak oldu fakat wordpress vb sistemlere entegre ederken sorun çıkartır herhalde değil mi ?

Yok hayır düzenlemesini yaparsan sorunsuz ekleyebilirsin

Al kardeşim senin için bi örnek yaptım onun üzerinden gidersin;

.html

<ul id="menu">
		<div class="title">ARABALAR</div>
		<li><a href="#">Anasayfa</a></li>
		<li><a href="#">Hakkımızda</a></li>
		<li><a href="#">Referanslar</a></li>
		<li><a href="#">Misyonumuz</a></li>
		<li><a href="#">Vizyonumuz</a></li>
	</ul>

.css

ul#menu {width:500px;margin:100px auto;}
	.title {padding:10px 20px;background:#0172bd;color:#fff;font:bold 20px arial;}
	ul#menu li a {display:block;font:bold 12px arial;background:#5ba2d1;padding:7px 15px;text-decoration:none;color:#fff;}

.jQuery

$("document").ready(function(){
			$("ul#menu li a:odd").css("background","#035a93");
		});

Şöyle bi görüntü çıkacaktır;