url dosyalrını kopyalım kendine uydurman gerkecen birde js dosyalarnı upload etmen gerekbşlir kodunu degiştirmezsende rahatlıkla kullanablrisin
CSS
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}
body {
padding:none;
margin:none;
font-family:Arial, Helvetica, sans-serif;
font-size:12px/22px;
background:#fff;
}
a {
text-decoration:none;
}
#haberwrapper {
width:960px;
margin:0px 5px;
}
#headerwrapper{
height:142px;
}
#headerwrapper #headerust{
height:30px;
background:#8b0b08;
font-size:11px;
}
#headerwrapper #headerust #hsoldiv{
height:30px;
line-height:30px;
margin-left:5px;
color:#FFF;
float:left;
width:600px;
}
#headerwrapper #headerust #hsoldiv a {
color:#CCC;
font-weight:bold;
letter-spacing:1px;
text-decoration:underline;
}
#headerwrapper #headerust #hsoldiv a:hover {
color:#FFFF66;
text-decoration:none;
}
#headerwrapper #headerust #hsagdiv{
height:30px;
line-height:30px;
margin-right:5px;
color:#FFF;
float:right;
width:330px;
text-align:right;
}
#headerwrapper #headerust #hsagdiv a {
color:#F90;
font-weight:bold;
}
#headerwrapper #headerust #hsagdiv a:hover{
color:#fefefe;
font-weight:bold;
}
#headerwrapper #headerlogo {
position:absolute;
width:300px;
top:35px;
margin-left:5px;
height:65px;
}
#headerwrapper #headerreklam {
position:absolute;
width:460px;
top:35px;
margin-left:492px;
height:60px;
}
#headerwrapper #headermenu {
position:absolute;
margin-top:70px;
background:url(http://www.arizali.net/demo/haber/images/menubg.png) repeat-x top left;
height:41px;
width:960px;
}
#headermenu ul{
display:block;
list-style:none;
}
#headermenu ul li{
display:block;
margin:0px;
padding:0px;
}
#headermenu ul li.kategoriler{
display:block;
float:left;
}
#headermenu ul li.kategoriler a{
display:block;
float:left;
background:url(http://www.arizali.net/demo/haber/images/menuli.png) no-repeat top right;
height:39px;
line-height:39px;
font-size:14px;
letter-spacing:-10;
color:#900;
padding:0px 12px 0px 10px;
}
#headermenu ul li.kategoriler a:hover, #headermenu ul li.kategoriler a.aktif {
display:block;
float:left;
background:url(http://www.arizali.net/demo/haber/images/menulih.png) no-repeat top right;
height:39px;
line-height:39px;
font-size:14px;
letter-spacing:-10;
color:#333;
padding:0px 12px 0px 10px;
}
#headermenu ul li.diger{
display:block;
float:right;
}
#headermenu ul li.diger a{
display:block;
float:right;
height:32px;
line-height:32px;
font-size:13px;
color:#900;
padding:4px 5px 3px 5px;
}
#soltaraf {
float:left;
width:652px;
}
#sagtaraf {
float:right;
width:300px;
}
#haberfooter {
background:url(http://www.arizali.net/demo/haber/images/footer.png) no-repeat top left;
margin-top:5px;
}
#haberfooter .ftic{
padding:10px;
font-size:12px;
}
#haberfooter .ftic .acopy{
color:#900;
font-weight:bold;
letter-spacing:1px;
}
#haberfooter .ftic .fcopy{
color:#030;
}
.ayrac {
background:url(http://www.arizali.net/demo/haber/images/ayrac.png) no-repeat top center;
height:3px;
margin:2px 0px;
}
.hkleft { width:324px;
float:left; border-right:1px dashed #dedede;
} .hkright { width:325px;
margin-left:2px; float:right;}
/*.haberkatbox{
background:url(http://www.arizali.net/demo/haber/images/haberb/h.png) no-repeat top left;
width:325px;
float:left;
}
.haberkatbox .h2{
position:relative;
line-height:40px;
height:40px;
padding-left:5px;
font-size:15px;
font-weight:bold;
letter-spacing:1px;
color:#FC6;
text-shadow:1px 1px #000;
}
.haberkatbox .katboxic{
background:url(http://www.arizali.net/demo/haber/images/haberb/bg.png) repeat-y top left;
padding:5px;
}
.haberkatbox .katboxf{
background:url(http://www.arizali.net/demo/haber/images/haberb/f.png) no-repeat top left;
height:10px;
}
*/
.haberkatbox{
float:left;
}
.haberkatbox .h2{
position:relative;
line-height:40px;
height:40px;
padding-left:5px;
font-size:15px;
font-weight:bold;
letter-spacing:1px;
color:#333;
text-shadow:1px 1px #fff;
background-color:#dedede;
}
.haberkatbox .katboxic{
padding:5px;
}
.haberkatbox .katboxf{
height:10px;
}
.haberkatbox .h2 a.tumugoster{
position:absolute;
display:block;
line-height:40px;
height:40px;
right:5px;
top:0px;
font-size:12px;
letter-spacing:1px;
color:#066;
width:40px;
text-align:center;
text-shadow:none;
}
.haberbox {
text-align:justify;
}
.haberkatbox .katboxic .haberbox .rhaber {
width:100px;
height:60px;
float:left;
margin-right:5px;
}
.haberkatbox .katboxic .haberbox .bhaber a {
display:block;
line-height:13px;
font-size:12px;
font-weight:bold;
color:#900;
margin-bottom:3px;
}
.haberkatbox .katboxic .haberbox .ihaber{
line-height:12px;
font-size:11px;
color:#333;
}
.clboth {
clear:both;
}
.katcont {
padding-bottom:10px;
background:url(http://www.arizali.net/demo/haber/images/kate/f.png) no-repeat bottom left;
}
.katcont .khe {
display:block;
background:url(http://www.arizali.net/demo/haber/images/kate/b.png) no-repeat top left;
position:relative;
height:45px;
line-height:40px;
font-size:17px;
font-family:impact;
color:#fefefe;
letter-spacing:1px;
font-weight:normal;
padding:0px 5px;
text-shadow:1px 1px 1px #000;
}
.tumunugos {
position:absolute;
right:40px;
width:100px;
font-size:11px;
color:#F90;
top:0px;
height:40px;
line-height:40px;
font-family:Arial, Helvetica, sans-serif;
}
.hrss {
position:absolute;
right:5px;
width:32px;
font-size:11px;
color:#F90;
top:10px;
height:19px;
font-family:Arial, Helvetica, sans-serif;
}
.katcont .kbc {
background:url(http://www.arizali.net/demo/haber/images/kate/m.png) repeat-y top left;
padding:10px 10px 0px 10px;
min-height:100px;
}
.katcont .kbc .hkl {
float:left;
width:452px;
}
.katcont .kbc .hkr {
float:right;
width:168px;
}
.haberkutu {
margin-bottom:5px;
}
.haberkutu .hkresim{
width:150px;
height:90px;
float:left;
margin-right:5px;
}
.haberkutu .hkbaslik{
display:block;
font-size:14px;
color:#900;
line-height:16px;
}
.haberkutu .hkicerik{
display:block;
font-size:11px;
color:#666;
line-height:13px;
letter-spacing:1px;
}
.katcont .kbc .hkr ul {
list-style:none;
}
.katcont .kbc .hkr ul li{
display:block;
margin-bottom:4px;
padding:3px;
}
.katcont .kbc .hkr ul li a{
display:block;
background:url(http://www.arizali.net/demo/haber/images/kate/tag.png) no-repeat center left;
padding-left:20px;
line-height:16px;
font-size:12px;
color:#666;
}
.katcont .kbc .hkr ul li a:hover{
display:block;
background:url(http://www.arizali.net/demo/haber/images/kate/tag.png) no-repeat center left;
padding-left:20px;
line-height:16px;
font-size:12px;
color:#333;
}
/*Köşe*/
.koseyazibaslik {
font-size:17px;
font-weight:lighter;
font-family:impact;
color:#066;
text-shadow:1px 1px 1px #ddd;
margin:5px 0px;
height:25px;
line-height:25px;
}
.koseyazibox {
background:#ddd url(http://www.arizali.net/demo/haber/images/kose.png) no-repeat bottom left;
min-height:60px;
padding:5px;
margin-bottom:2px;
}
.koseyazibox .resim{
width:60px;
height:60px;
float:left;
margin-right:5px;
}
.koseyazibox .kyb{
display:block;
line-height:20px;
height:20px;
color:#333;
font-size:15px;
letter-spacing:1px;
font-family:impact;
}
.koseyazibox .kybb{
display:block;
line-height:16px;
font-size:14px;
color:#036;
font-weight:bold;
}
.seccont {
padding-bottom:10px;
background:url(http://www.arizali.net/demo/haber/images/kate/ek/f.png) no-repeat bottom left;
}
.seccont .khe {
margin:0px;
display:block;
background:url(http://www.arizali.net/demo/haber/images/kate/ek/b.png) no-repeat top left;
height:45px;
line-height:40px;
font-size:14px;
color:#fefefe;
letter-spacing:1px;
font-weight:normal;
padding:0px 5px;
}
.seccont .khe ul { list-style:none;}
.seccont .khe ul li{ display:block; float:left; }
.seccont .khe ul li a{ display:block; float:left; height:30px; line-height:30px; padding:0px 15px; margin:5px 1px; color:#333; background-color:#dedede; }
.seccont .khe ul li a:hover{ display:block; float:left; height:30px; line-height:30px; padding:0px 15px; margin:5px 1px; color:#dedede; background-color:#333; }
.seccont .khe ul li a.aktif{ display:block; float:left; height:30px; line-height:30px; padding:0px 15px; margin:5px 1px; color:#fefefe; background-color:#4a4a4a; }
.seccont .kbc {
margin:0px;
background:url(http://www.arizali.net/demo/haber/images/kate/ek/m.png) repeat-y top left;
padding:10px 10px 1px 10px;
}
.seccont .kbc .hkl {
margin:0px;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
#jFlowSlide{ background:#DBF3FD; font-family: Georgia; }
#myController { font-family: Georgia; padding:2px 0; width:300px; background:#3AB7FF; }
#myController span.jFlowSelected { background:#43A0D5;margin-right:0px; }
.slide-wrapper { padding: 5px; }
.slide-thumbnail { width:290px;
height:150px;}
.slide-thumbnail img {width:290px; height:150px;}
.slide-details { width:290px; float:right; margin-left:10px;}
.slide-details h2 { font-size:1.5em; font-style: italic; font-weight:normal; line-height: 1; margin:0; }
.slide-details .description { margin-top:10px; }
.jFlowControl, .jFlowPrev, .jFlowNext { color:#FFF; cursor:pointer; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px; }
.jFlowControl:hover, .jFlowPrev:hover, .jFlowNext:hover { background: #43A0D5; }
#sliderwrapper {
width:652px;
height:250px;
position:relative;
overflow:hidden;
}
#sliderwrapper #sicerik{
float:left;
width:415px;
height:250px;
padding-right:2px;
background:#505050;
}
#sliderwrapper #sicerik .sbox{
width:415px;
height:250px;
position:relative;
overflow:hidden;
}
#sliderwrapper #sicerik .sbox img.m{
width:415px;
height:250px;
position:absolute;
margin:0px;
z-index:1;
}
#sliderwrapper #sicerik .sbox .bilgiler{
width:405px;
height:60px;
padding:5px;
position:absolute;
margin-top:170px;
z-index:1000;
filter:alpha(opacity=80);
opacity:0.8;
background:#333;
color:#FFF;
overflow:hidden;
font-size:11px;
}
#sliderwrapper #sicerik .sbox .bilgiler a {
color:#ffff66;
font-size:13px;
font-weight:bold;
display:block;
line-height:14px;
}
#sliderwrapper #snaviga{
float:right;
width:235px;
}
#sliderwrapper #snaviga .sla{
display:block;
filter:alpha(opacity=60);
opacity:0.6;
height:50px;
background:url(http://www.arizali.net/demo/haber/slider/sliderli.png) no-repeat top left;
color:#000;
}
#sliderwrapper #snaviga .sla:hover{
filter:alpha(opacity=100);
opacity:1;
display:block;
height:50px;
background:url(http://www.arizali.net/demo/haber/slider/sliderli.png) no-repeat top left;
}
#sliderwrapper #snaviga .slaaktif, #sliderwrapper #snaviga .slaaktif:hover{
filter:alpha(opacity=100);
opacity:1;
display:block;
height:50px;
background:#505050;
color:#efefef;
}
.mslimage {
display:block;
float:left;
width:40px;
margin:5px;
}
.slaaktif .mslspant {
width:180px;
display:block;
float:right;
height:40px;
margin:5px 5px 5px 0px;
overflow:hidden;
}
.slaaktif .mslspant strong.s1{
font-weight:bold;
line-height:20px;
display:block;
font-size:13px;
}
.slaaktif .mslspant strong.s2{
color:#FFF;
font-weight:normal;
line-height:11px;
display:block;
font-size:11px;
}
.sla .mslspant {
width:180px;
display:block;
float:right;
height:40px;
margin:5px 5px 5px 0px;
overflow:hidden;
}
.sla .mslspant strong.s1{
font-weight:bold;
line-height:20px;
display:block;
font-size:13px;
}
TASARIM ALTI
<div id="haberfooter">
<div class="ftic">Her hakkı saklıdır © 2011 <strong><a class="acopy" href="#">Samsun Manşet</a></strong><br /><br />
<span style="font-size:11px; letter-spacing:1px; line-height:13px;">Sitede bulunan tüm haberler, güncel ve yerel olaylardan derlenerek oluşturulmuştur. Hukuk ihlalinin bulunduğunu düşündüğünüz sayfaları iletişim alanından bizlere ileterek, sorunların çözülmesinde bizlere yardımcı olabilirsiniz... Bu sitenin yerel bir gazete olan Samsun Manşet Gazetesi ile organik/inorganik bir bağı bulunmamakla birlikte, sadece internet üzerinden yayın yapan bir internet gazetesidir...</span>
<br /><br />
<span style="font-size:9px; letter-spacing:1px; line-height:13px;"><a class="fcopy" href="#">Samsun Manşet</a> | <a class="fcopy" href="#">Samsun Haber</a> | <a class="fcopy" href="#">Samsun Yerel Haberleri</a> | <a class="fcopy" href="#">Samsun Seçim 2011</a> </span>
</div>
</div>
</div>
TASARIM ÜSTÜ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Haber Tasarım</title>
<link rel="stylesheet" type="text/css" href="http://www.arizali.net/demo/haber/reset.css" />
<link rel="stylesheet" type="text/css" href="http://www.arizali.net/demo/haber/tasarim.css" />
<link rel="stylesheet" type="text/css" href="http://www.arizali.net/demo/haber/slider.css" />
<link rel="stylesheet" type="text/css" href="http://www.arizali.net/demo/haber/liste.css" />
<script type="text/javascript" src="http://www.arizali.net/demo/haber/jq.js"></script>
<script language="javascript" type="text/javascript" src="http://www.arizali.net/demo/haber/jquery.flow.1.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#snaviga a').hover(function(){
$('#snaviga a').removeClass("slaaktif");
$('#snaviga a').addClass("sla");
$(this).addClass("slaaktif");
});
$("#myController").jFlow({
slides: "#slides",
controller: ".jFlowControl", // must be class, use . sign
slideWrapper : "#jFlowSlide", // must be id, use # sign
selectedWrapper: "jFlowSelected", // just pure text, no sign
auto: true, //auto change slide, default true
width: "300px",
height: "160px",
duration: 400,
prev: ".jFlowPrev", // must be class, use . sign
next: ".jFlowNext" // must be class, use . sign
});
});
function Manset(id) {
$("#sicerik .sbox").hide();
$("#sicerik #sliderb" + id).show();
}
</script>
</head>
<body>
<div id="haberwrapper">
<div id="headerwrapper">
<div id="headerust">
<div id="hsoldiv">Hoşgeldin <strong>Ziyaretçi</strong>, <a href="#">kayıt</a> olabilir veya sisteme <a href="#">giriş</a> yapabilirsiniz.</div>
<div id="hsagdiv">
<a href="#">Anasayfa</a> ::
<a href="#">Künye</a> ::
<a href="#">Gizlilik Politikası</a> ::
<a href="#">İletişim</a> ::
<a href="#">Sitemap</a></div>
<div class="clboth"></div>
</div>
<div id="headerlogo"><img src="http://www.arizali.net/demo/haber/images/logo.png" /></div>
<div id="headerreklam"><img src="http://www.arizali.net/demo/haber/images/reklam/banner_img.jpg" width="468" height="60" /></div>
<div id="headermenu">
<ul>
<li class="kategoriler"><a href="#">Yerel Haberler</a></li>
<li class="kategoriler"><a href="#">Spor Haberleri</a></li>
<li class="kategoriler"><a href="#">Sağlık & Teknoloji</a></li>
<li class="kategoriler"><a href="#">Üniversite & Eğitim</a></li>
<li class="kategoriler"><a href="#">Köşe Yazıları</a></li>
<li class="kategoriler"><a href="#">Video Galeri</a></li>
<li class="kategoriler"><a href="#">Foto Galeri</a></li>
<li class="diger"><a href="#"><img src="http://www.arizali.net/demo/haber/images/ikon/rss.png" /></a></li>
<li class="diger"><a href="#"><img src="http://www.arizali.net/demo/haber/images/ikon/twitter.png" /></a></li>
<li class="diger"><a href="#"><img src="http://www.arizali.net/demo/haber/images/ikon/facebook.png" /></a></li>
</ul>
<div class="clboth"></div>
</div>
</div>
<div id="icerikwr">
<div id="soltaraf">
<!--Slide-->
<div id="sliderwrapper">
<div id="sicerik">
<div class="sbox" id="sliderb1">
<div class="bilgiler"><a href="#"><strong>Deneme haber başlığı</strong></a>Cras volutpat ante elit, at malesuada velit. Phasellus malesuada tincidunt dictum. Nunc mi metus, interdum eu facilisis vehicula, feugiat a lorem. Etiam vel elit vitae sem congue viverra facilisis sit amet urna! </div>
<img src="http://www.arizali.net/demo/haber/manset/manset1.png" class="m"/></div>
<div class="sbox" id="sliderb2" style="display:none;">
<div class="bilgiler"><a href="#"><strong>Buda bir diğer başlık olacak</strong></a>Cras volutpat ante elit, at malesuada velit. Phasellus malesuada tincidunt dictum. Nunc</div>
<img src="http://www.arizali.net/demo/haber/manset/manset2.png" class="m"/></div>
<div class="sbox" id="sliderb3" style="display:none;">
<div class="bilgiler"><a href="#"><strong>Deneme haber başlığı</strong></a>Cras volutpat ante elit, at malesuada velit. Phasellus malesuada tincidunt dictum. Nunc mi metus, interdum eu facilisis vehicula, feugiat a lorem. Etiam vel elit vitae sem congue viverra facilisis sit amet urna! </div>
<img src="http://www.arizali.net/demo/haber/manset/manset3.png" class="m"/></div>
<div class="sbox" id="sliderb4" style="display:none;">
<div class="bilgiler"><a href="#"><strong>Buda bir diğer başlık olacak</strong></a>Cras volutpat ante elit, at malesuada velit. Phasellus malesuada tincidunt dictum. Nunc</div>
<img src="http://www.arizali.net/demo/haber/manset/manset4.png" class="m"/></div>
<div class="sbox" id="sliderb5" style="display:none;">
<div class="bilgiler"><a href="#"><strong>Deneme haber başlığı</strong></a>Cras volutpat ante elit, at malesuada velit. Phasellus malesuada tincidunt dictum. Nunc mi metus, interdum eu facilisis vehicula, feugiat a lorem. Etiam vel elit vitae sem congue viverra facilisis sit amet urna! </div>
<img src="http://www.arizali.net/demo/haber/manset/manset5.png" class="m"/></div>
</div>
<div id="snaviga">
<a id="slider1" href="#" onmouseover="Manset(1);" class="slaaktif">
<img class="mslimage" src="http://www.arizali.net/demo/haber/manset/manset1u.png"/>
<span class="mslspant"><strong class="s1">Deneme haber başlığı buraya gelecek</strong></span>
<span style="display:block; clear:both"></span>
</a>
<a id="slider2" href="#" onmouseover="Manset(2);" class="sla">
<img class="mslimage" src="http://www.arizali.net/demo/haber/manset/manset2u.png"/>
<span class="mslspant"><strong class="s1">Amasya da neler oldu?? şok şok şok flaş flaş flaşş</strong></span>
<span style="display:block; clear:both"></span>
</a>
<a id="slider3" href="#" onmouseover="Manset(3);" class="sla">
<img class="mslimage" src="http://www.arizali.net/demo/haber/manset/manset3u.png"/>
<span class="mslspant"><strong class="s1">Bu saat kulesi kaç metre?</strong></span>
<span style="display:block; clear:both"></span>
</a>
<a id="slider4" href="#" onmouseover="Manset(4);" class="sla">
<img class="mslimage" src="http://www.arizali.net/demo/haber/manset/manset4u.png"/>
<span class="mslspant"><strong class="s1">[Video] Gözlerinize inanamayacaksınız...</strong></span>
<span style="display:block; clear:both"></span>
</a>
<a id="slider5" href="#" onmouseover="Manset(5);" class="sla">
<img class="mslimage" src="http://www.arizali.net/demo/haber/manset/manset5u.png"/>
<span class="mslspant"><strong class="s1">[Fotoğraf] Yok artık daha neler??!!</strong></span>
<span style="display:block; clear:both"></span>
</a>
</div>
<div class="clboth"></div>
</div>
<!--Slide-->
<div style="height:10px;"></div>
<div class="seccont">
<div class="khe"><ul><li><a href="#" class="aktif">En çok okunan</a></li><li><a href="#">En çok yorumlanan</a></li></ul><div style="clear:left"></div></div>
<div class="kbc">
<div class="haberkutu">
<a class="hkbaslik" href="#">Haber Başlığı Buraya</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
</div>
<div class="haberkutu">
<a class="hkbaslik" href="#">Bu da başka bir deneme haber başlığı</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
</div>
<div class="haberkutu">
<a class="hkbaslik" href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
</div>
<div class="haberkutu">
<a class="hkbaslik" href="#">Haber Başlığı Buraya</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
</div>
<div class="haberkutu">
<a class="hkbaslik" href="#">Bu da başka bir deneme haber başlığı</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
</div>
<div class="haberkutu">
<a class="hkbaslik" href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
</div>
</div>
</div>
<div style="height:10px;"></div>
<div class="katcont">
<h2 class="khe">Yerel Haberler<a class="tumunugos" href="#">Tümünü Göster</a><a class="hrss" href="#"><img src="http://www.arizali.net/demo/haber/images/kate/rss-32.png" alt="rss" /></a></h2>
<div class="kbc">
<div class="hkl">
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset1.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Haber Başlığı Buraya</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset2.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Bu da başka bir deneme haber başlığı</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset3.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
</div>
<div class="hkr">
<ul>
<li><a href="#">Deneme haber başlığı buraya gelecek</a></li>
<li><a href="#">Bu da başka bir deneme haber başlığı</a></li>
<li><a href="#">Samsunda neler oluyor deneme haber</a></li>
<li><a href="#">Yok artık lebron james</a></li>
<li><a href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a></li>
<li><a href="#">Son dakika haberler burada... Şok şok şok</a></li>
</ul>
</div>
<div class="clboth"></div>
</div>
</div>
<div style="height:10px;"></div>
<div class="katcont">
<h2 class="khe">Spor Haberleri<a class="tumunugos" href="#">Tümünü Göster</a><a class="hrss" href="#"><img src="http://www.arizali.net/demo/haber/images/kate/rss-32.png" alt="rss" /></a></h2>
<div class="kbc">
<div class="hkl">
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset1.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Haber Başlığı Buraya</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset2.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Bu da başka bir deneme haber başlığı</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset3.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
</div>
<div class="hkr">
<ul>
<li><a href="#">Deneme haber başlığı buraya gelecek</a></li>
<li><a href="#">Bu da başka bir deneme haber başlığı</a></li>
<li><a href="#">Samsunda neler oluyor deneme haber</a></li>
<li><a href="#">Yok artık lebron james</a></li>
<li><a href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a></li>
<li><a href="#">Son dakika haberler burada... Şok şok şok</a></li>
</ul>
</div>
<div class="clboth"></div>
</div>
</div>
<div style="height:10px;"></div>
<div class="katcont">
<h2 class="khe">Sağlık & Teknoloji<a class="tumunugos" href="#">Tümünü Göster</a><a class="hrss" href="#"><img src="http://www.arizali.net/demo/haber/images/kate/rss-32.png" alt="rss" /></a></h2>
<div class="kbc">
<div class="hkl">
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset1.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Haber Başlığı Buraya</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset2.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Bu da başka bir deneme haber başlığı</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset3.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
</div>
<div class="hkr">
<ul>
<li><a href="#">Deneme haber başlığı buraya gelecek</a></li>
<li><a href="#">Bu da başka bir deneme haber başlığı</a></li>
<li><a href="#">Samsunda neler oluyor deneme haber</a></li>
<li><a href="#">Yok artık lebron james</a></li>
<li><a href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a></li>
<li><a href="#">Son dakika haberler burada... Şok şok şok</a></li>
</ul>
</div>
<div class="clboth"></div>
</div>
</div>
<div style="height:10px;"></div>
<div class="katcont">
<h2 class="khe">Üniversite & Eğitim<a class="tumunugos" href="#">Tümünü Göster</a><a class="hrss" href="#"><img src="http://www.arizali.net/demo/haber/images/kate/rss-32.png" alt="rss" /></a></h2>
<div class="kbc">
<div class="hkl">
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset1.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Haber Başlığı Buraya</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset2.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Bu da başka bir deneme haber başlığı</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
<div class="haberkutu">
<a href="#"><img src="http://www.arizali.net/demo/haber/manset/manset3.png" class="hkresim" /></a>
<a class="hkbaslik" href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a>
<span class="hkicerik">Nunc porta massa ut urna semper tempus. Donec sed tortor a risus pellentesque imperdiet. Nam luctus metus id diam hendrerit consequat. Etiam id leo commodo purus suscipit cursus!</span>
<div style="clear:left;"></div>
</div>
</div>
<div class="hkr">
<ul>
<li><a href="#">Deneme haber başlığı buraya gelecek</a></li>
<li><a href="#">Bu da başka bir deneme haber başlığı</a></li>
<li><a href="#">Samsunda neler oluyor deneme haber</a></li>
<li><a href="#">Yok artık lebron james</a></li>
<li><a href="#">Kimvurduya gittim geleceğim gelmeyebilirimde merak etmeyin</a></li>
<li><a href="#">Son dakika haberler burada... Şok şok şok</a></li>
</ul>
</div>
<div class="clboth"></div>
</div>
</div>
</div>
<!--Sol Taraf-->
<div id="sagtaraf">
<div id="reklam1"><img src="http://www.arizali.net/demo/haber/images/reklam/300x250_img.jpg" /></div>
<div style="height:10px;"></div>
<div class="jflow-content-slider">
<div id="slides">
<div class="slide-wrapper">
<div class="slide-thumbnail">
<img src="http://www.arizali.net/demo/haber/images/imprezz.jpg" alt="photo"/>
</div>
</div>
<div class="slide-wrapper">
<div class="slide-thumbnail">
<img src="http://www.arizali.net/demo/haber/images/gallery.jpg" alt="photo"/>
</div>
</div>
<div class="slide-wrapper">
<div class="slide-thumbnail">
<img src="http://www.arizali.net/demo/haber/images/magazeen.jpg" alt="photo"/>
</div>
</div>
<div class="slide-wrapper">
<div class="slide-thumbnail">
<img src="http://www.arizali.net/demo/haber/images/vintage.jpg" alt="photo"/>
</div>
</div>
<div class="slide-wrapper">
<div class="slide-thumbnail">
<img src="http://www.arizali.net/demo/haber/images/blues.jpg" alt="photo"/>
</div>
</div>
</div>
<div id="myController">
<span class="jFlowPrev">Geri</span>
<span class="jFlowControl">1</span>
<span class="jFlowControl">2</span>
<span class="jFlowControl">3</span>
<span class="jFlowControl">4</span>
<span class="jFlowControl">5</span>
<span class="jFlowNext">İleri</span>
</div>
<div class="clear"></div>
</div>
<div style="height:10px;"></div>
<h2 class="koseyazibaslik">Köşe Yazıları</h2>
<div class="koseyazibox">
<img src="http://www.arizali.net/demo/haber/manset/manset5u.png" class="resim"/>
<span class="kyb">Alper ER</span>
<a class="kybb" href="#">Neden aşık olamıyoruz?</a>
<div style="clear:left"></div>
</div>
<div class="koseyazibox">
<img src="http://www.arizali.net/demo/haber/manset/manset1u.png" class="resim"/>
<span class="kyb">Mahmut TUNCER</span>
<a class="kybb" href="#">Samsunda seçim son durum ne?</a>
<div style="clear:left"></div>
</div>
<div class="koseyazibox">
<img src="http://www.arizali.net/demo/haber/manset/manset2u.png" class="resim"/>
<span class="kyb">Selami ŞAHİN</span>
<a class="kybb" href="#">Hayatımıza anlam katanlar!</a>
<div style="clear:left"></div>
</div>
<div class="koseyazibox">
<img src="http://www.arizali.net/demo/haber/manset/manset3u.png" class="resim"/>
<span class="kyb">Kutatgu BİLİG</span>
<a class="kybb" href="#">Madem uzakta kaldı tüm sevişler... Sende git...</a>
<div style="clear:left"></div>
</div>
</div>
<!--Sag Taraf-->
<div class="clboth"></div>
</div>
<!--İçerik Wr-->
</body>
[/code]
