17.04.2017 CSS ile menü yapimi

17.04.2017

css.css dosyasi

@charset "utf-8";
/* CSS Document */

body{
    background-color:red;
}
.ilkresim
{
  width:600px;
  height:400px;
  box-shadow:0px 5px 2px #666;
  border-radius:5px;
  float:left;
    }
    
    .kutu
    {
        width:290px;
        height:400px;
        background-color:rgba(200,10,10,0.2);
        float:right;
        }
    

    
    .linkkutu
    {
width:280px;
height:35px;
background-color:rgba(10,10,10,0.6);
font-size:28px;
line-height:32px;
padding:5px;
border-radius:2px;
color:#ffffff;
        }
        
        .linkkutu:hover
        {
            background-color:rgba(10,10,10,0.8);
            }

 

 

index.html dosyasi ise asagidaki gibidir

 

 

<!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>
<link rel="stylesheet" type="text/css" href="cssstyle/css.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<table width="910" height="700px" bgcolor="#FFFFFF" border="0" align="center" style="margin-top:100px">
  <tr>
    <td valign="top">
    
    <img src="resim/img101.png" class="ilkresim"/>
    <div class="kutu" >
    <div class="linkkutu">
    ANASAYFA
    </div>
    <div class="linkkutu">
    ANASAYFA
    </div>
    <div class="linkkutu">
    ANASAYFA
    </div>
    <div class="linkkutu">
    ANASAYFA
    </div>
    <div class="linkkutu">
    ANASAYFA
    </div>
     <div class="linkkutu">
    ANASAYFA
    </div>
     <div class="linkkutu">
    ANASAYFA
    </div>
     <div class="linkkutu">
    ANASAYFA
    </div>

    </div>

    </td>
  </tr>
</table>
</body>
</html>
 



Adınız Soyadınız
İçerik
Son Eklenenler Konular
  • E-Ticaret çalismasi Satis sitesi
  • 2017-2018 Normal Ögretim Konu Anlatim Listesi
  • Asp Net- Veritabani Olusturma ve GridView Ekleme Kayit
  • Asp Net-Master page ile admin paneli
  • Vize 2 Mesleki Yabanci Dil 1
  • Vize 2 için Ag temelleri
  • Vize2 Internet Programciligi I
  • Vize 2 için ödev listesi- Programlamanin Temelleri
  • Programlamanin Temelleri Akis Diyagramlari Örnekleri
  • Bilgisayar Aglari-Ag Temelleri
  • Bilgisayar Mesleki Yabanci Dil Dersi Için Kelimeler 1
  • 2015-2016 Staj Kabul Listesi
  • 2016-2017 Yaz Staji Yapacaklarin Listesi
  • ASP NET ile veritabanindaki alani gösterirken kisaltarak görüntüleme
  • ASP NET - Plesk ile veritabani olusturma ve MS SQL veritabani olusturma islemleri
  • Dreamveaver
  • ASP Net
  • CSS
  • Html
  • Visual Studio C# ve C Console
  • Programlamanin Temelleri-Algoritma
  • Mesleki Yabancı Dil
  • Windows Server 2012
  • Ag Temelleri-Bilgisayar Aglari
  • Staj
  • Copyright (c) Ferdi DOĞAN