PSD to CSS Resim Konumu Değiştirme

bilalbakirci

Hectopat
Katılım
10 Kasım 2014
Mesajlar
13
Daha fazla  
Cinsiyet
Erkek
PSD to CSS öğrendim. Herşey tamam söyle bir sorunum var: 5 resimi ortaya nasıl koyucam ? Benim tasarımım:

Resim:

Metro arabirimli web sayfası.png


Ama gerçek tasarım böyle:


PSD to CSS.png



Html Ve Css Kodlarım.

Style.css kodlarım

PHP:
*{
  margin:0;
  padding:0;
}
body {
    background:url(../images/bg.png)
}
#logo, #menu, #footer-sol {
       width:825px;
  margin:0 auto;
}
#logo {
    padding:50px 0;
    position:relative;
}
p {
flotat:right;
}
#menu {
menu {overflow:hidden;}
menu {float:left; margin-right:20px;}
img {border:2px solid #000;}
.clear {clear: both}
}
#footer-sol
img {
float:left;
border:100px
}
#footer-sol p {
margin-right: auto;
margin-left: auto;
}
#menu img {
    height: auto;
    width: auto;
    margin: 1px;
margin-right: auto;
margin-left: auto;
padding:2px;
border:1px;
    margin:0 4px 4px 0;
}
#footer-sol {
 
    margin: 1px;
margin-right: auto;
margin-left: auto;
padding:10px;
border:10px;
}
#menu iletisim {
width:100px;height:100px;background:green;float:left;margin-left:5px;
}

HTML kodlarım:

HTML:
<html>
<head>
<meta http-equiv="Content - Type" content="text/html"; charset=utf-8">
<title> Bilal Bakırcı </title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="logo">
   <a href="index.html"><img src="images/logo.png" alt="logo" />
</div>
<div id="menu">
  <a href="index.html"><img src="images/anasayfa.png" alt="logo" />
  <a href="index.html"><img src="images/hakkimda.png" alt="logo" />
  <a href="index.html"><img src="images/kisiselbilgi.png" alt="logo" />
  <a href="index.html"><img src="images/resimler.png" alt="logo" />
  <div class="iletisim"><a href="index.html" clas="iletisim"><img src="images/iletisim.png" alt="logo" />
   <a href="index.html"><img src="images/projeler.png" alt="logo" />
   <a href="index.html"><img src="images/blog.png" alt="logo" />
   <a href="index.html"><img src="images/mail.png" alt="logo" />
</div>
<div id="footer-sol">
<a href="index.html"><img src="images/f.png" alt="logo" />
<a href="index.html"><img src="images/t.png" alt="logo" />
<a href="index.html"><img src="images/g.png" alt="logo" />
<div id="footer-sag">
<p> Bilal Bakırcı Candır Can </p>
</div>
</div>
</body>
</html>


Şimdiden yardımlarınız için teşekkürler.
 
Son düzenleyen: Moderatör:
Uyarı! Bu konu 11 yıl önce açıldı.
Muhtemelen daha fazla tartışma gerekli değildir ki bu durumda yeni bir konu başlatmayı öneririz. Eğer yine de cevabınızın gerekli olduğunu düşünüyorsanız buna rağmen cevap verebilirsiniz.

Bu konuyu görüntüleyen kullanıcılar

Technopat Haberler

Yeni konular

Geri
Yukarı