Uzman Cevap beta aşamasından çıkmaya hazırlanıyor! Yenilikleri takipte kalın.
Çözüldü! Bu soru aradığı cevabı buldu :) Teşekkürler iyi niyetli insanlar!

CSS | Responsive Site Yapımı

Merhaba arkadaşlar.
Framework'suz responsive tasarım nasıl yapılır, mantığı nedir? Aşağıdaki örnek üzerinden örnek verebilir misiniz?

index.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
   <link rel="stylesheet" type="text/css" href="style.css">    
   <title>Anasayfa</title>
</head>
<body>
   
<div id="header">Header</div>
<div id="container">
    <div id="content">İçerik</div>
    <div id="sidebar">Menü</div>
    <div id="clean"></div>
</div>
<div id="footer">Footer</div>
        
</body>
</html>


style.css
#header {padding: 10px; height: 50px; background-color: #f1efe2; border: 1px solid #ccc;}
#container {width: 980px; margin:30px auto;}
#content {width: 670px; height: 250px; padding: 10px; float:left; background-color: #f1efe2; border: 1px solid #ccc;}
#sidebar {width: 250px; height: 250px; padding: 10px; float:right; background-color: #f1efe2; border: 1px solid #ccc;}
#footer {padding: 10px; height: 50px; background-color: #f1efe2; border: 1px solid #ccc;}
#clean {clear: both;}
Cevaplar (3)
1
Dostum css @media etiketini araştır.Linkini paylaştım bak incele css ile hallediyorsun.
http://fatihhayrioglu.com/css-3-medya-sorgulari/
1
@media (width: 480px) { .. }
@media screen { .. }
@media all { .. }
vs. css kodlarını bilmen yeterli
örnek olarak bir h1 etiketinin 380px ekran çözünürlüğünde arkaplan renginin değişmesini istiyorsan,

@media (width: 380px ) {
    h1 {
          background-color: #fe0000;
}
}

komutunu kullanabilirsin ayrıca ek olarak :
http://www.w3schools.com/html/html_responsive.asp adresinden'de yardım alabilirsin.
0
Teşekkürler arkadaşlar.
Cevap Yazın..

[code=css,php,sql,asp..]..kod..[/code] , [url=http:...com] , [img=resim linki]
[color=renk kodu]..yazı..[/color]

yabancı dizi izle tv ünitesi