Html İçin Menü

Abdullah T. · 6 Temmuz 2019

Sa Aşağıdaki Gibi Bir Menü Lazızm yapacak Arkadaş Varmı

Abdullah T. · 6 Temmuz 2019

+ Güncel

patrick2dev · 6 Temmuz 2019

Responsive bir menüdür. Ekran küçülürse ona göre şekil alacaktır. iyi forumlar...
Şu HTML kısmı:

HTML:

<div class="navigation">
  <a href="#">Link</a>
  <a href="#">Link</a>
  <a href="#">Link</a>
</div>

Şu CSS kısmı:

CSS:

* {
  box-sizing: border-box;
}

.navigation {
  overflow: hidden;
  background-color: #333;
}

.navigation a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.navigation a:hover {
  background-color: #ddd;
  color: black;
}

@media screen and (max-width: 600px) {
  .navigation a {
    float: none;
    width: 100%;
  }
}

patrick2dev · 6 Temmuz 2019

élvio dedi:

Responsive bir menüdür. Ekran küçülürse ona göre şekil alacaktır. iyi forumlar...
Şu HTML kısmı:

HTML:

<div class="navigation">
  <a href="#">Link</a>
  <a href="#">Link</a>
  <a href="#">Link</a>
</div>

Şu CSS kısmı:

CSS:

* {
  box-sizing: border-box;
}

.navigation {
  overflow: hidden;
  background-color: #333;
}

.navigation a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.navigation a:hover {
  background-color: #ddd;
  color: black;
}

@media screen and (max-width: 600px) {
  .navigation a {
    float: none;
    width: 100%;
  }
}

buradan önizleme yapıp, biraz değiştirilmiş kodları alabilirsin.

Abdullah T. · 6 Temmuz 2019

élvio dedi:
buradan önizleme yapıp, biraz değiştirilmiş kodları alabilirsin.

Neden Böyle Oluyor Yardım Edermisin

patrick2dev · 6 Temmuz 2019

Yazdığın kodları atabilirsen yardımcı olayım.

Abdullah T. · 6 Temmuz 2019

élvio dedi:
Yazdığın kodları atabilirsen yardımcı olayım.

AnyDesk Atayım İsterseniz Özelden Bakın Kodlara

patrick2dev · 6 Temmuz 2019

Yazdığınız kodları buraya mesaj olarak atın ki sadece siz değil, diğer kullanıcılar da yararlansın.

Abdullah T. · 6 Temmuz 2019

élvio dedi:
Yazdığınız kodları buraya mesaj olarak atın ki sadece siz değil, diğer kullanıcılar da yararlansın.

HTML:

<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>TRCraft |Minecraft Hizmetleri</title>
<div class="navigation">
  <a href="#">Link</a>
  <a href="#">Link</a>
  <a href="#">Link</a>
</div>
               
    <link rel="stylesheet" href="style.css" type="text/css" media="all" />
     </head>
    <body>

</p>
<b onclick="this.parentNode.className='';"><svg fill="#5677fc" fit="" height="100%" preserveAspectRatio="xMidYMid meet" style="pointer-events: none; display: block;" viewBox="0 0 24 24" width="100%"><g><polygon points="19,6.4 17.6,5 12,10.6 6.4,5 5,6.4 10.6,12 5,17.6 6.4,19 12,13.4 17.6,19 19,17.6 13.4,12 "></polygon></g></svg></b> <div onclick="this.parentNode.className='acbakalim';"><svg fill="#5677fc" fit="" height="100%" preserveAspectRatio="xMidYMid meet" style="pointer-events: none; display: block;" viewBox="0 0 24 24" width="100%"><g><path d="M3,18h18v-2H3V18z M3,13h18v-2H3V13z M3,6v2h18V6H3z"></path></g></svg></div></div><style> #koddostu-materyalmenu{position:relative;width:32px;height:32px;overflow:visible;z-index:4000;transition:all 0.25s ease-in;text-align:left;} #koddostu-materyalmenu div, #koddostu-materyalmenu b{cursor:pointer;margin:0 0 0 0;padding:0 0 0 0;position:absolute;top:4px;right:4px;display:inline-block;width:24px;height:24px;transform:rotate(0deg);-webkit-transform:rotate(0deg);transition:all 0.25s ease-in;-webkit-transition:all 0.25s ease-in;} #koddostu-materyalmenu b{width:24px;height:24px;opacity:0;} #koddostu-materyalmenu p{ display:inline-block; overflow:hidden;width:0px;height:0px;position:absolute;top:0px;left:0px;background:#fff; margin:0 0 0 0; padding:0 0 0 0; transition:all 0.25s ease-in; } .acbakalim p{ width:200px !important; height:210px !important; padding:30px 0 0 0 !important; box-shadow:0 2px 5px 0 rgba(0, 0, 0, 0.26) !important; } #koddostu-materyalmenu p a{text-decoration:none !important; font-family:Arial, sans-serif; font-size:14px; color:#455ede; padding-left:15px; display:block; height:40px; line-height:40px; width:200px; } #koddostu-materyalmenu p a:hover{ background:#d0d9ff; } .acbakalim b{ transform:rotate(270deg) !important; -webkit-transform:rotate(270deg) !important; opacity:1 !important; } .acbakalim div{ transform:rotate(360deg) !important; -webkit-transform:rotate(360deg) !important; opacity:0; width:1px !important; height:1px !important; } </style>

<script src="https://www.koddostu.com/duzelt.js?no=77"></script>
<script type="text/javascript">
<!-- wmaraci html şifreleyici https://wmaraci.com -->
document.write(unescape('%3C%73%74%79%6C%65%3E%0A%20%20%20%20%20%20%20%20%68%74%6D%6C%20%7B%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%62%61%63%6B%67%72%6F%75%6E%64%3A%20%75%72%6C%28%69%6D%67%2F%61%72%6B%61%70%6C%61%6E%2E%6A%70%67%29%20%6E%6F%2D%72%65%70%65%61%74%20%63%65%6E%74%65%72%20%63%65%6E%74%65%72%20%66%69%78%65%64%3B%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2D%77%65%62%6B%69%74%2D%62%61%63%6B%67%72%6F%75%6E%64%2D%73%69%7A%65%3A%20%63%6F%76%65%72%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2D%6D%6F%7A%2D%62%61%63%6B%67%72%6F%75%6E%64%2D%73%69%7A%65%3A%20%63%6F%76%65%72%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%2D%6F%2D%62%61%63%6B%67%72%6F%75%6E%64%2D%73%69%7A%65%3A%20%63%6F%76%65%72%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%62%61%63%6B%67%72%6F%75%6E%64%2D%73%69%7A%65%3A%20%63%6F%76%65%72%3B%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%70%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%66%6F%6E%74%2D%73%69%7A%65%3A%20%32%30%70%78%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%63%6F%6C%6F%72%3A%20%77%68%69%74%65%73%6D%6F%6B%65%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%68%31%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%66%6F%6E%74%2D%73%69%7A%65%3A%20%33%35%70%78%3B%0A%20%20%20%20%20%20%20%20%20%20%20%20%63%6F%6C%6F%72%3A%20%77%68%69%74%65%73%6D%6F%6B%65%3B%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%0A%20%20%20%20%0A%20%20%20%20%3C%2F%73%74%79%6C%65%3E'));
</script>

      </body>

</html>

CSS:

@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
* {
  box-sizing: border-box;
}

.navigation {
  font-family: Poppins;
  overflow: hidden;
  background-color: #333;
}

.navigation a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.navigation a:hover {
  background-color: #ddd;
  color: black;
}

@media screen and (max-width: 600px) {
  .navigation a {
    float: none;
    width: 100%;
  }
}

patrick2dev · 6 Temmuz 2019

HTML:

<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>TRCraft |Minecraft Hizmetleri</title>       
    <link rel="stylesheet" href="style.css" type="text/css" media="all" />
</head>
<body>
    <div class="navigation">
        <a href="#">Link</a>
        <a href="#">Link</a>
        <a href="#">Link</a>
    </div>
</body>
</html>

gereksiz html, css & js kodları silindi. css dosyanızda bir sorun göremedim. html dosyasını düzenledim sorun şurda:
benim verdiğim menü kodlarını head taglarının içine yazmışsınız. oraya sadece css dosyaları ve sayfa elementleri gelir.

css dosyasını da body taglarının içinde çağırmışsınız 2. sorun da bu.

iyi forumlar.

Abdullah T. · 6 Temmuz 2019

élvio dedi:
HTML:

<html lang="tr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>TRCraft |Minecraft Hizmetleri</title> <link rel="stylesheet" href="style.css" type="text/css" media="all" /> </head> <body> <div class="navigation"> <a href="#">Link</a> <a href="#">Link</a> <a href="#">Link</a> </div> </body> </html>

gereksiz html, css & js kodları silindi. css dosyanızda bir sorun göremedim. html dosyasını düzenledim sorun şurda:
benim verdiğim menü kodlarını head taglarının içine yazmışsınız. oraya sadece css dosyaları ve sayfa elementleri gelir.

css dosyasını da body taglarının içinde çağırmışsınız 2. sorun da bu.

iyi forumlar.

Gene Aynı Şekilde Çalışmıyor Verdiğiniz Önizlemedeki Gibi

Abdullah T. · 6 Temmuz 2019

patrick2dev · 6 Temmuz 2019

Kod:

<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>TRCraft |Minecraft Hizmetleri</title>     
    <style>
    @import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
* {
  box-sizing: border-box;
}

.navigation {
  font-family: Poppins;
  overflow: hidden;
  background-color: #333;
}

.navigation a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.navigation a:hover {
  background-color: #ddd;
  color: black;
}

@media screen and (max-width: 600px) {
  .navigation a {
    float: none;
    width: 100%;
  }
}
    </style>
</head>
<body>
    <div class="navigation">
        <a href="#">Link</a>
        <a href="#">Link</a>
        <a href="#">Link</a>
    </div>
</body>
</html>

bu şekilde deneyin.

Abdullah T. · 6 Temmuz 2019

Konu Çözüldü Konu Kilit

Html İçin Menü

Abdullah T.

Nötr

Discord:

Abdullah T.

Nötr

Discord:

patrick2dev

ölü.

patrick2dev

ölü.

Abdullah T.

Nötr

Discord:

patrick2dev

ölü.

Abdullah T.

Nötr

Discord:

patrick2dev

ölü.

Abdullah T.

Nötr

Discord:

patrick2dev

ölü.

Abdullah T.

Nötr

Discord:

Abdullah T.

Nötr

Discord:

patrick2dev

ölü.

Abdullah T.

Nötr

Discord: