Entrance
06 Mayıs 2016, 23:34
Tamamen can sıkıntısından meydana gelen basit bir yatay menü.)
Ekran görüntüsü,
[Only Registered Users Can See Links]
HTML kodları,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[Only Registered Users Can See Links]">
<html xmlns="[Only Registered Users Can See Links]">
<head>
<title>Testing Menü!</title>
<meta [Only Registered Users Can See Links]"Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="stil.css"/>
</head>
<body>
<div class="menu">
<ul>
<li><a href="#">UnrealIRCd</a></li>
<li><a href="#">IRCServices</a></li>
<li><a href="#">Eggdrop</a></li>
<li><a href="#">Anope</a></li>
<li><a href="#">UIRC</a></li>
</ul>
</div>
</body>
</html>
CSS kodları,
.menu { width:600px; height:32px; margin:10px auto}
.menu ul{ margin:0; padding:0; list-style:none}
.menu ul li{ float:left }
.menu ul li a{ display:block; width:120px; height:25px; background:#330000; color:#FFFFFF; font:italic 15px arial; text-align:center; padding:7px 0 0 0; text-decoration:none; border-radius:20px 20px 20px 20px}
.menu ul li a:hover{ color:red; background:#000099}
NOT: CSS kodlarını stil.css dosyası oluşturup, içerisine eklemeniz gerekmektedir. Yada html kodları arasında bulunan head etiketinin içerisindeki stil.css'i istediğiniz bir isim olarak belirtip, oluşturabilirsiniz.
İyi forumlar. ^^
Ekran görüntüsü,
[Only Registered Users Can See Links]
HTML kodları,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[Only Registered Users Can See Links]">
<html xmlns="[Only Registered Users Can See Links]">
<head>
<title>Testing Menü!</title>
<meta [Only Registered Users Can See Links]"Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="stil.css"/>
</head>
<body>
<div class="menu">
<ul>
<li><a href="#">UnrealIRCd</a></li>
<li><a href="#">IRCServices</a></li>
<li><a href="#">Eggdrop</a></li>
<li><a href="#">Anope</a></li>
<li><a href="#">UIRC</a></li>
</ul>
</div>
</body>
</html>
CSS kodları,
.menu { width:600px; height:32px; margin:10px auto}
.menu ul{ margin:0; padding:0; list-style:none}
.menu ul li{ float:left }
.menu ul li a{ display:block; width:120px; height:25px; background:#330000; color:#FFFFFF; font:italic 15px arial; text-align:center; padding:7px 0 0 0; text-decoration:none; border-radius:20px 20px 20px 20px}
.menu ul li a:hover{ color:red; background:#000099}
NOT: CSS kodlarını stil.css dosyası oluşturup, içerisine eklemeniz gerekmektedir. Yada html kodları arasında bulunan head etiketinin içerisindeki stil.css'i istediğiniz bir isim olarak belirtip, oluşturabilirsiniz.
İyi forumlar. ^^