Çözüldü HTML yazısı alta geliyor

Bu konu çözüldü olarak işaretlenmiştir. Çözülmediğini düşünüyorsanız konuyu rapor edebilirsiniz.
C

Coderman128

Kilopat
Zamanın Tanığı
Katılım
12 Nisan 2020
Mesajlar
7.532
Makaleler
1
Çözümler
28
Daha fazla  
Cinsiyet
Erkek

Edit fiddle - JSFiddle - Code Playground

JSFiddle - Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle.
jsfiddle.net jsfiddle.net
Telefon no yazıyorum ama üstte görünmesini istiyorum. Bir de alttaki şeyi en alta almak istiyorum. Bu sorun nasıl çözülür?
 

Dosya Ekleri

  • Ekran Alıntısı.JPG
    Ekran Alıntısı.JPG
    34 KB · Görüntüleme: 99
Çözüm
Ecmel
HTML: 
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>NAVBAR DENEME</title>
        <link rel="stylesheet" href="iletisim.css">
        <script src="myScript.js"></script>
    </head>
<body> 
<input type="checkbox" id="menu-toggle">

<div class="container">
    <div class="header">
        <label class="hamburger-menu" for="menu-toggle">
            <span></span>
        </label>
        <a href="#" class="logo">
            FARUK SANCAR
        </a>
        <div class="actions">
            <div>telefon:000000000000</div>
        </div>
        <label for="menu-toggle" class="backdrop"></label>
    </div>
</div>
<nav class="menu">
    <ul>
        <li>
            <a href="#">Anasayfa</a>
        </li>
        <li>
            <a href="#">Hakkımda</a>
        </li>
        <li>
            <a href="#">Porfolyo</a>
        </li>
        <li>
            <a href="#">Blog</a>
        </li>
        <li>
            <a href="#">İletişim</a>
        </li>
    </ul>
</nav>

     <div class="footer-basic">
         <footer>
             <div class="social"><a href="#"><i class=img src=discordicon.png"></i></a><a href="#"><i class="icon ion-social-snapchat"></i></a><a href="#"><i class="icon ion-social-twitter"></i></a><a href="#"><i class="icon ion-social-facebook"></i></a></div>
              <ul class="list-inline">
                 <li class="list-inline-item"><a href="#">Ana Sayfa</a></li>
                 <li class="list-inline-item"><a href="#">Servisler</a></li>
                 <li class="list-inline-item"><a href="#">Hakkımızda</a></li>
                 <li class="list-inline-item"><a href="#">Şartlar</a></li>
                 <li class="list-inline-item"><a href="#">Gizlilik politikası</a></li>
             </ul>
             <p class="copyright">FARUK SANCAR © 2022</p>
         </footer>
     </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
</body>

</html>

CSS: 
  .footer-basic {
    padding:20px 0;
    background-color:#ffffff;
    color:#4b4c4d;
    position: absolute;
    bottom: 0;
    width: 100%;
  }

Bu şekilde ufak bir düzenleme yaptım ama ben yerinde olsam bu kodları kullanmam. Çok kötü şekilde yazılmış. Başka bir yerden alıp değiştirmeye çalışmaktansa kendin yapabilirsin. Çok basit bir şey zaten şunu yapması, boştan yere uğraşıyorsun şu anda.

Şimdi bu kodu çalıştıracaksın ama mobil uyumluluk da yazman gerecek. Kodlar zaten genel olarak doğru yazılmamış. Bazı yerlerde gereksiz tag açılıp kapamaları gördüm.

Dediğim gibi yerinde olsam sıfırdan kendim yazardım. Bu şekilde hiç sağlıklı bir site değil. Sorunun genel olarak bilgi eksikliğinden kaynaklı zaten. Tamamen öğrenmeden bir yerden başka yere atlamaya çalışıyorsun. Sırayla ilerlemen gerekli.
Tarihe göre sırala Puana göre sırala
Arkadaşlar cevap vermiş ama ben senin kodları düzleyemedim hocam. Çok karıştırmışsın. Her yerden bir şeyler geliyor CSS'ler kategorize değil. HTML Cleancode ile yazılmamış. Bilmiyorum ne derecedesin ama Sadık Turan'ın ilk 70 dersi sana faydalı olacaktır. Bunu sadece daha iyi ol diye söylüyorum. Buyur aslında yapmak istediklerin burada daha az kod ile yapılı halde.
 

Dosya Ekleri

  • Capture.PNG
    Capture.PNG
    132,4 KB · Görüntüleme: 43
Artı 0 Eksi
Girdap dedi:
Arkadaşlar cevap vermiş ama ben senin kodları düzleyemedim hocam. Çok karıştırmışsın. Her yerden bir şeyler geliyor CSS'ler kategorize değil. HTML Cleancode ile yazılmamış. Bilmiyorum ne derecedesin ama Sadık Turan'ın ilk 70 dersi sana faydalı olacaktır. Bunu sadece daha iyi ol diye söylüyorum. Buyur aslında yapmak istediklerin burada daha az kod ile yapılı halde.
Genişletmek için tıkla...
Hocam daha acemiyim ne bulursam kattım. Teşekkürler yardımlarınız için.
 
Artı 0 Eksi
Coderman128 dedi:
Hocam daha acemiyim ne bulursam kattım. Teşekkürler yardımlarınız için.
Genişletmek için tıkla...
Problem yok. Kendi kodlarını yazmaya özen göster. HTML'i 1 haftada bitirdikten sonra özellikle CSS Div yapısı - Flex yapısı - Pozisyonlama gibi konulara iyi çalış olayın zaten yarısını bitirirsin. Burada sana laf anlatan herkes bir zamanlar senden daha gerideydi. Devam
 
Artı 0 Eksi
Teşekkürler hocam.
Ecmel dedi:
HTML: 
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>NAVBAR DENEME</title>
        <link rel="stylesheet" href="iletisim.css">
        <script src="myScript.js"></script>
    </head>
<body>
<input type="checkbox" id="menu-toggle">

<div class="container">
    <div class="header">
        <label class="hamburger-menu" for="menu-toggle">
            <span></span>
        </label>
        <a href="#" class="logo">
            FARUK SANCAR
        </a>
        <div class="actions">
            <div>telefon:000000000000</div>
        </div>
        <label for="menu-toggle" class="backdrop"></label>
    </div>
</div>
<nav class="menu">
    <ul>
        <li>
            <a href="#">Anasayfa</a>
        </li>
        <li>
            <a href="#">Hakkımda</a>
        </li>
        <li>
            <a href="#">Porfolyo</a>
        </li>
        <li>
            <a href="#">Blog</a>
        </li>
        <li>
            <a href="#">İletişim</a>
        </li>
    </ul>
</nav>

     <div class="footer-basic">
         <footer>
             <div class="social"><a href="#"><i class=img src=discordicon.png"></i></a><a href="#"><i class="icon ion-social-snapchat"></i></a><a href="#"><i class="icon ion-social-twitter"></i></a><a href="#"><i class="icon ion-social-facebook"></i></a></div>
              <ul class="list-inline">
                 <li class="list-inline-item"><a href="#">Ana Sayfa</a></li>
                 <li class="list-inline-item"><a href="#">Servisler</a></li>
                 <li class="list-inline-item"><a href="#">Hakkımızda</a></li>
                 <li class="list-inline-item"><a href="#">Şartlar</a></li>
                 <li class="list-inline-item"><a href="#">Gizlilik politikası</a></li>
             </ul>
             <p class="copyright">FARUK SANCAR © 2022</p>
         </footer>
     </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/js/bootstrap.bundle.min.js"></script>
</body>

</html>

CSS: 
  .footer-basic {
    padding:20px 0;
    background-color:#ffffff;
    color:#4b4c4d;
    position: absolute;
    bottom: 0;
    width: 100%;
  }

Bu şekilde ufak bir düzenleme yaptım ama ben yerinde olsam bu kodları kullanmam. Çok kötü şekilde yazılmış. Başka bir yerden alıp değiştirmeye çalışmaktansa kendin yapabilirsin. Çok basit bir şey zaten şunu yapması, boştan yere uğraşıyorsun şu anda.

Şimdi bu kodu çalıştıracaksın ama mobil uyumluluk da yazman gerecek. Kodlar zaten genel olarak doğru yazılmamış. Bazı yerlerde gereksiz tag açılıp kapamaları gördüm.

Dediğim gibi yerinde olsam sıfırdan kendim yazardım. Bu şekilde hiç sağlıklı bir site değil. Sorunun genel olarak bilgi eksikliğinden kaynaklı zaten. Tamamen öğrenmeden bir yerden başka yere atlamaya çalışıyorsun. Sırayla ilerlemen gerekli.
Genişletmek için tıkla...
 
Artı 0 Eksi

Benzer konular

Timuçib
  • Çözüldü
Çözüldü  HTML - CSS sayfa küçülünce yazılar alt alta geliyor
Mesaj
6
Görüntüleme
1.782
Timuçib
Timuçib
2
  • Çözüldü
Çözüldü  HTML yazılar üst üste geliyor
Mesaj
4
Görüntüleme
3.913
264523
2
Spil3xx
  • Çözüldü
Çözüldü  Resimlerin altına yazı ekleyince resimler alt alta geliyor
2
Mesaj
12
Görüntüleme
565
Spil3xx
Spil3xx
The User 0
  • Çözüldü
Çözüldü  HTML yazılar ve butonlar navBar'ın üstüne geliyor
Mesaj
3
Görüntüleme
3.220
The User 0
The User 0
G
HTML vs HTML5?
2
Mesaj
14
Görüntüleme
3.333
Vavien.
Vavien.

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı