Dentasarım
Popüler tasarımlar

DENTASARIM | Tasarımın bizden!

SD tema v1
CSS KODU:

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; } #ad-a87f,#ad-c81e,#ad-a87f,#ad-cfcd,#ad-c9f0,#ad-c4ca,#ad-8f14,#ad-e4da,#ad-d3d9,#ad-1679,#ad-45c4,#ad-eccb { margin:auto; } #webme_footer_textlink_dont_hide { margin-left: 350px; }

 

body{
background-image: url(https://img.webme.com/pic/d/dentasarim/aw-background.png);

}

#ust {
margin: auto;
height: 30px;
width: 900px;
background-color: #1B1B1B;
}
#duyuru {
width: 500px;
color: #CCC;
float: left;
height: 30px;
padding-left: 5px;
font-size: 11px;
font-family: Arial, Calibri, "Microsoft YaHei";
font-weight: bold;
line-height: 30px;
}
#sosyalag {
float: right;
width: 130px;
height: 30px;
line-height: 30px;
}
#sosyalag a {
display: block;
float: left;
margin-left: 5px;
margin-top: 0px;
height: 25px;
padding-top: 5px;
text-align: center;
}
#sosyalag a img {filter: grayscale(1);
-webkit-filter: grayscale(1);
-moz-filter: grayscale(1);
-o-filter: grayscale(1);
-ms-filter: grayscale(1);
transition: 0.5s;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
}
#sosyalag a img:hover {
filter: grayscale(0);
-webkit-filter: grayscale(0);
-moz-filter: grayscale(0);
-o-filter: grayscale(0);
-ms-filter: grayscale(0);
}
#enust {
height: auto;
width: 900px;
margin: auto;
background-color: #333;
}

#slider-wrapper{
width: 900px;
height: 200px;
position: relative;
margin-bottom: 0px;
background: rgba(0,0,0,0.5);
overflow: hidden;
}

#s1{
padding: 6px;
background: #FFFFFF;
position: absolute;
left: 50%;
bottom: 25px;
margin-left: -36px;
border-radius: 20px;
opacity: 0.3;
cursor: pointer;
z-index: 999;
}

#s2{
padding: 6px;
background: #FFFFFF;
position: absolute;
left: 50%;
bottom: 25px;
margin-left: -12px;
border-radius: 20px;
opacity: 0.3;
cursor: pointer;
z-index: 999;
}

#s3{
padding: 6px;
background: #FFFFFF;
position: absolute;
left: 50%;
bottom: 25px;
margin-left: 12px;
border-radius: 20px;
opacity: 0.3;
cursor: pointer;
z-index: 999;
}
#logo {
width: 270px;
height: 50px;
background-image: url(https://img.webme.com/pic/d/dentasarim/denyenilogov1.png);
float: left;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 1s;
background-repeat: no-repeat;
}
#logogenel {
margin: auto;
width: 900px;
height: 55px;
}
#logo:hover {
left: 10px;
}

#s4{
padding: 6px;
background: #FFFFFF;
position: absolute;
left: 50%;
bottom: 25px;
margin-left: 36px;
border-radius: 20px;
opacity: 0.3;
cursor: pointer;
z-index: 999;
}

#s1:hover, #s2:hover, #s3:hover, #s4:hover{ opacity: 1;}

.inner-wrapper{
width: 900px;
height: 220px;
position: absolute;
top: 0;
left: 0;
margin-bottom: 0px;
overflow: hidden;
}
.control{ display: none;}

#Slide1:checked ~ .overflow-wrapper{ margin-left: 0%; }
#Slide2:checked ~ .overflow-wrapper{ margin-left: -100%; }
#Slide3:checked ~ .overflow-wrapper{ margin-left: -200%; }
#Slide4:checked ~ .overflow-wrapper{ margin-left: -300%; }

#Slide1:checked + #s1 { opacity: 1; }
#Slide2:checked + #s2 { opacity: 1; }
#Slide3:checked + #s3 { opacity: 1; }
#Slide4:checked + #s4 { opacity: 1; }

.overflow-wrapper{
width: 400%;
height: 100%;
position: absolute;
top: 0;
left: 0;
overflow-y: hidden;
z-index: 1;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

.slide img{
width: 25%;
float: left;
}

#sliderekle {
height: auto;
width: 900px;
margin: auto;
background-color: #333;
}
#menuust {
width: 900px;
margin: auto;
height: 40px;
background-color: #1B1B1B;
}
#menuust ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#menuust ul li a {
text-decoration: none;
color: #FFFFFF;
font-family: Arial, Calibri, "Microsoft YaHei";
font-size: 12px;
font-weight: bold;
text-align: center;
display: block;
width: 150px;
float: left;
height: 40px;
line-height: 40px;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 1s;
}
#menuust ul li .active {
background-color: #DD4A38;
color: #FFF;
}
#menuust ul li a:hover {
text-decoration: none;
color: #DD4A38;
font-family: Arial, Calibri, "Microsoft YaHei";
font-size: 12px;
font-weight: bold;
text-align: center;
display: block;
width: 150px;
float: left;
height: 40px;
line-height: 40px;
}
#menuust ul li .active:hover {
background-color: #DD4A38;
color: #FFF;
}
#icerik {
width: 890px;
height: auto;
/* [disabled]border: 1px solid #999; */
color: #999;
font-family: Arial, Calibri, "Microsoft YaHei";
font-size: 12px;
background-image: url(https://img.webme.com/pic/d/dentasarim/beyazsydm.png);
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
padding-top: 7px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
}
#altsonunda a {
color: #FFFFFF;
padding: 5px;
border: 1px solid #222;
background-color: #333333;
text-decoration: none;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
}
#slider {
width: 890px;
height: auto;
margin-top: 5px;
margin-bottom: 5px;
padding: 5px;
}
#yazan a {
text-decoration: none;
color: #4B7183;
}
#altv11 {
width: 890px;
padding: 5px;
height: auto;
background-color: #232323;
margin-right: auto;
margin-left: auto;
}
#blogv1 a {
font-size: 15px;
text-decoration: none;
color: #666;
}
#devamigr a {
text-decoration: none;
color: #F7F7F7;
height: 20px;
width: 98px;
line-height: 20px;
float: right;
padding: 2px;
background-color: #121212;
font-size: 10px;
font-weight: bold;
font-family: Arial, Calibri, "Microsoft YaHei";
text-align: center;
margin-right: 10px;
margin-top: 5px;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 1s;
}
#blog table tr th #blogcizgi {
border-right-style: dotted;
border-left-style: dotted;
border-top-color: #999;
border-right-color: #999;
border-bottom-color: #999;
border-left-color: #999;
border-right-width: 1px;
border-left-width: 1px;
height: 130px;
padding: 5px;
}
#devamigr a:hover {
background-color: #DD4A38;
}
#altsonunda {
width: 890px;
padding: 5px;
background-color: #1B1B1B;
color: #999;
text-decoration: none;
font-size: 12px;
font-weight: bold;
font-family: Arial, Calibri, "Microsoft YaHei";
line-height: 30px;
height: 30px;
margin-right: auto;
margin-left: auto;
margin-bottom: 10px;
}
#altbaslik {
font-size: 14px;
font-weight: bold;
color: #F1F1F1;
font-family: Arial, Calibri, "Microsoft YaHei";
text-align: left;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #666;
padding-bottom: 4px;
}
#altyazi {
font-size: 13px;
font-weight: normal;
color: #999999;
text-align: left;
font-family: Arial, Calibri, "Microsoft YaHei";
padding-top: 2px;
padding-bottom: 2px;
}
#altmenu ul {
list-style-type: none;
margin: 0px;
padding: 0px;
}
#altmenu ul li a {
color: #999;
text-decoration: none;
font-size: 13px;
font-weight: normal;
font-family: Arial, Calibri, "Microsoft YaHei";
text-align: left;
display: block;
line-height: 20px;
height: 20px;
border-bottom-width: 1px;
border-bottom-style: dotted;
border-bottom-color: #666;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 1s;
}
#ssylag1 {
text-align: center;
}
#altsonbas {
float: left;
width: auto;
color: #666;
padding-left: 3px;
font-size: 11px;
font-weight: normal;
}
#altson {
width: 215px;
height: 75px;
}
#altsonbas a {
color: #F7F7F7;
text-decoration: none;
font-size: 12px;
font-weight: bold;
font-family: Arial, Calibri, "Microsoft YaHei";
display: block;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 1s;
}
#altsonresim {
height: 70px;
width: 90px;
border: 1px dotted #666666;
margin-top: 2px;
margin-bottom: 2px;
float: left;
}

#altmenu ul li a:hover {
color: #DD4A38;
}
#altsonunda a:hover {
color: #FFFFFF;
padding: 5px;
border: 1px solid #222;
background-color: #DD4A38;
text-decoration: none;
}

 

 

Tasarım üstü:
<body>
<div id="logogenel">
<div id="logo"></div>
</div>
<div id="menuust">
<ul>
<li><a href="#" class="active">ANASAYFA</a></li>
<li><a href="#">İLETİŞİM</a></li>
<li><a href="#">BİZİ YORUMLA</a></li>
<li><a href="#">PROJELER</a></li>
<li><a href="#">HAKKIMDA</a></li>
<li><a href="#">FORUM</a></li>
</ul>
</div>
<div id="sliderekle">
<div id="enust"><div id="slider-wrapper">
<div class="inner-wrapper">
<input checked type="radio" name="slide" class="control" id="Slide1"/>
<label for="Slide1" id="s1"></label>
<input type="radio" name="slide" class="control" id="Slide2"/>
<label for="Slide2" id="s2"></label>
<input type="radio" name="slide" class="control" id="Slide3"/>
<label for="Slide3" id="s3"></label>
<input type="radio" name="slide" class="control" id="Slide4"/>
<label for="Slide4" id="s4"></label>
<div class="overflow-wrapper">
<a class="slide" href=""><img src="http://benroberts.se/onewebstatic/9b1ed66606-Brooklyn-Bridge-Wallpaper.jpg"/></a>
<a class="slide" href=""><img src="http://www.computerrepairsaz.com/wp-content/uploads/2012/11/ComputerKeyboard2.jpg"/></a>
<a class="slide" href=""><img src="http://www.kotka.fi/instancedata/prime_product_julkaisu/kotka/embeds/kotkawwwstructure/42277bbab3cb18dcef74b8bbe1bab8664f8c7ef3.jpg"/></a>
<a class="slide" href=""><img src="http://www.roofing-services-essex.co.uk/images/main/essex-roofing.jpg"/></a>
</div>
</div></div></div>
<div id="ust">
<div id="duyuru">&#8220; Dentasarım'dan bir yeni tema daha! Alt kısmı değiştirmediğiniz sürece kullanabilirsiniz!&#8221;</div>

<div id="sosyalag"><a href="#"><img src= "https://duayenbilisim.com/wp-content/uploads/2014/09/facebok.png?246444" width="20" height="20" /></a> <a href="#"><img src="http://www.mrqe.com/images/mrqe/twitter_sm.png" width="20" height="20" /></a> <a href="#"><img src="http://www.sirene.com.tr/Photos/youtube.jpg" width="20" height="20" /></a> <a href="#"><img src="http://www.klassenid.com/images/ico_instagram.png" alt="" width="20" height="20" /></a> <a href="#"><img src="http://cdn.information-management.com/media/ui/google-20x20.png" width="20" height="20" /></a></div>
</div>
</div>
<div id="icerik">
<div id="content">

 

Tasarım altı:

</div>
</div>
<div id="altsonunda">TÜM HAKLARI SAKLIDIR! TASARIM VE KODLAMA: <a href="#">DENTASARIM</a>
<div id="ssylag">
<div id="ssylresim"></div>
<div id="ssylresim"></div>
<div id="ssylresim"></div>
<div id="ssylresim"></div>
</div>
</div>

</div>
</div>
</body>
</html>

 

ALT KISMI DEĞİŞTİRMEDİĞİNİZ SÜRECE KULLANABİLİRSİNİZ! AKSİ TAKTİRDE ŞİKAYET EDİLİR!
 
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol