bscsskodlari - SS Tema v1 ( YENİ )

SS Tema v1 ( YENİ )

TEMANIN GÖRÜNTÜSÜNÜ GÖRMEK İSTİYORSANIZ TIKLAYINIZ > DEMO GÖRÜNTÜSÜ

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" xml:lang="en"> <head> <FCK:meta http-equiv="Content-Type" content="text/html;charset=UTF-8"  />  <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Spectral+SC" rel="stylesheet"> <link rel="stylesheet" href="style.css" /> <title>Dentasarım</title> </head> <body> <div id="logo"><img src="https://img.webme.com/pic/d/dentasarim/2017logobeyaz.png" _fcksavedurl="https://img.webme.com/pic/d/dentasarim/2017logobeyaz.png"></div> <div id="menubir"> <ul> <li><a href="#" _fcksavedurl="#">ANASAYFA</a></li> <li><a href="#" _fcksavedurl="#">HAKKIMIZDA</a></li> <li><a href="#" _fcksavedurl="#">ZİYARETÇİ DEFTERİ</a></li> <li><a href="#" _fcksavedurl="#">İLETİŞİM</a></li> </ul> </div> <div id="clear"></div> <div id="menuiki"> <ul> <li><a href="#" _fcksavedurl="#">Reklamlar</a></li> <li><a href="#" _fcksavedurl="#">Referanslar</a></li> <li><a href="#" _fcksavedurl="#">Sponsorlar</a></li> </ul> </div> <div id="slider"> <div id="slideryazi"> Yenilenen arayüz ile birlikte gelen tasarımları inceleyin! <a href="#" _fcksavedurl="#">Gözat</a> </div> </div> <div id="duyuru"> <a href="#" _fcksavedurl="#">#Etiket adı</a> <a href="#" _fcksavedurl="#">#Etiket adı</a> <a href="#" _fcksavedurl="#">#Etiket adı</a> <a href="#" _fcksavedurl="#">#Etiket adı</a> </div> <div id="icerik"> <div id="content">

TASARIM ALTI :

CSS KODU :

iframe{border:solid 3px #f36c4f;} table {margin-left: auto;margin-right: auto;} body { margin: 0px; padding: 0px; background-image: url(http://thepatternlibrary.com/img/b.jpg); font-family: 'Roboto', sans-serif; } #logo { font-size: 35px; color: white; width: 900px; height: 100px; line-height: 100px; margin: auto; font-weight: bold; display: block; } #logo i { font-size: 15px; font-weight: normal; } #logo img {height: 80px;margin: 10px;} #menubir { width: 900px; height: 50px; border-radius: 0px 20px 0 0; margin: auto; background-color: yellow; } #menuiki { width: 900px; height: 50px; margin: auto; background: #111; border-bottom: 2px solid #111; } #menubir ul { list-style: none; margin: 0px; padding: 0px; } #menuiki ul { list-style: none; margin: 0px; padding: 0px; } #menubir ul li a { display: block; color: black; text-decoration: none; float: left; padding-left: 15px; padding-right: 15px; margin-left: 5px; line-height: 50px; font-size: 12px; transition: 0.3s; } #menuiki ul li a { display: block; float: left; line-height: 50px; color: #fff; text-decoration: none; font-size: 11px; padding-left: 15px; padding-right: 15px; transition: 0.1s; } #menubir ul li a:hover { background: #ebee02; height: 40px; line-height: 40px; margin-top: 5px; color: #333; } #menuiki ul li a:hover { border-bottom: 2px solid yellow; } #clear { clear: left; } #slider { width: 900px; height: 400px; margin: auto; display: block; background: url(https://bedressed.files.wordpress.com/2015/09/8d142a41driving-rain-wingmirror.jpg); background-size: cover; background-position: center; background-attachment: fixed; } #slideryazi { padding-top: 140px; padding-left: 25px; font-size: 35px; font-weight: bold; color: #fff; width: 400px; text-shadow: 0 1px 3px #333; } #slideryazi a { display: block; font-weight: normal; width: 100px; text-align: center; margin-top: 15px; line-height: 30px; text-decoration: none; background: yellow; padding: 10px; color: #111; text-transform: uppercase; transition: all.3s; text-shadow: none; font-size: 15px; } #slideryazi a:hover { background: black; color: yellow; } #icerik { width: 870px; height: auto; display: block; margin: auto; background: #fff; line-height: 20px; font-size: 13px; padding: 15px; } baslik { height: 30px; line-height: 30px; display: block; border-left: 2px solid black; font-weight: bold; transition: all.3s; padding-left: 15px; margin-bottom: 15px; } baslik:hover { border-left: 2px solid yellow; color: black; } #icerik img { max-width: 870px; } #footer { width: 880px; height: 30px; line-height: 30px; color: #fff; background: #111; margin: auto; padding: 10px; font-size: 12px; } #footer a { color: black;; background: yellow; text-decoration: none; padding: 5px; font-size: 11px; } #duyuru { width: 885px; height: 50px; padding-left: 15px; line-height: 50px; background: yellow; font-size: 14px; margin: auto; } #duyuru a { color: black; text-decoration: none; padding-right: 15px;transition: all.1s; text-align: center; display: block; float: left; } #duyuru a:hover { font-weight: bold; }

KAYNAK : Den Tasarım

Toplam 6228 ziyaretçi kişi burdaydı!