• 20-01-2016, 12:55:24
    #1
    Arkadaşlar aşağıdaki kodda bayağı çözdüm beyazda yaptım ama tüm sitedeki renkler beyaz oldu. Sadece butonların içindeki linklerin rengini nasıl beyaz yaparım.

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    .button {
        background-color: #4CAF50; /* Green */
        border: none;
        color: white;
        padding: 16px 32px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: 4px 2px;
        -webkit-transition-duration: 0.4s; /* Safari */
        transition-duration: 0.4s;
        cursor: pointer;
    }
    
    a:link
    {
        color:#FFFFFF;
    }
    
    .button1 {
        background-color: #27ae60; 
        color: white; 
        border: 2px solid #27ae60;
    }
    
    .button1:hover {
        background-color: #32ce74;
        color: white;
    }
    
    .button2 {
        background-color: #2980b9; 
        color: white; 
        border: 2px solid #2980b9;
    }
    
    .button2:hover {
        background-color: #3599db;
        color: white;
    }
    
    .button3 {
        background-color: #c0392b; 
        color: white; 
        border: 2px solid #c0392b;
    }
    
    .button3:hover {
        background-color: #e74c3c;
        color: white;
    }
    
    .button4 {
        background-color: #f39c12;
        color: white;
        border: 2px solid #f39c12;
    }
    
    .button4:hover {background-color: #f1c40f;}
    
    .button5 {
        background-color: #2c3e50;
        color: white;
        border: 2px solid #2c3e50;
    }
    
    .button5:hover {
        background-color: #34495e;
        color: white;
    }
    </style>
    </head>
    <body>
    
    <h2>Hoverable Buttons</h2>
    <p>Use the :hover selector to change the style of the button when you move the mouse over it.</p>
    <p><strong>Tip:</strong> Use the transition-duration property to determine the speed of the "hover" effect:</p>
    
    <button class="button button1">green</button>
    <button class="button button2">Blue</button>
    <button class="button button3">Red</button>
    <button class="button button4">Gray</button>
    <button class="button button5">Black</button>
    
    </body>
    </html>
  • 20-01-2016, 13:06:28
    #2
    Üyeliği durduruldu
    a:link
    {
    color:#FFFFFF;
    }

    bunu değiştirmeyi denediniz mi?

    color: red;

    yapın mesela.
  • 20-01-2016, 13:15:03
    #3
    TylerDurden adlı üyeden alıntı: mesajı görüntüle
    a:link
    {
    color:#FFFFFF;
    }

    bunu değiştirmeyi denediniz mi?

    color: red;

    yapın mesela.
    Yaptım hocamda o kodu nereye ekleyeceğimi bulamadım. Üst kısma denedim olmadı şuanki yerine eklediğimde yorumlardaki cevap ver kısımları fln hepsi beyaz oldu. Tek tek butonlara ekleyim dedim çalışmadı.
    Sorunu anladım bir üstünde yorum kodları varmış css'de ikisi birbirine karışıyor. Nasıl ayırabilirim ikisini. Style kodunu açıp kapatınca butonlar küçüldü.
  • 20-01-2016, 13:37:39
    #4
    Üyeliği durduruldu
    böyle olmasını mı istiyorsunuz. change sözcüğüne link verdim:

    Alıntı
    <!DOCTYPE html>
    <html>
    <head>
    <style>
    .button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
    }

    a:link
    {
    color:red;
    }

    .button1 {
    background-color: #27ae60;
    color: white;
    border: 2px solid #27ae60;
    }

    .button1:hover {
    background-color: #32ce74;
    color: white;
    }

    .button2 {
    background-color: #2980b9;
    color: white;
    border: 2px solid #2980b9;
    }

    .button2:hover {
    background-color: #3599db;
    color: white;
    }

    .button3 {
    background-color: #c0392b;
    color: white;
    border: 2px solid #c0392b;
    }

    .button3:hover {
    background-color: #e74c3c;
    color: white;
    }

    .button4 {
    background-color: #f39c12;
    color: white;
    border: 2px solid #f39c12;
    }

    .button4:hover {background-color: #f1c40f;}

    .button5 {
    background-color: #2c3e50;
    color: white;
    border: 2px solid #2c3e50;
    }

    .button5:hover {
    background-color: #34495e;
    color: white;
    }
    </style>
    </head>
    <body>

    <h2>Hoverable Buttons</h2>
    <p>Use the :hover selector to <a href="#">change</a> the style of the button when you move the mouse over it.</p>
    <p><strong>Tip:</strong> Use the transition-duration property to determine the speed of the "hover" effect:</p>

    <button class="button button1">green</button>
    <button class="button button2">Blue</button>
    <button class="button button3">Red</button>
    <button class="button button4">Gray</button>
    <button class="button button5">Black</button>

    </body>
    </html>
  • 20-01-2016, 13:46:37
    #5
    Hocam sorunu buldum beyaz renk yaptım linkleri ama yorumlardaki linklerde beyaz oldu. İki ayrı kod var css kısmında biri yorum hemen altında ise butonların kodu. Ben ikisini birbirinden ayırmak istiyorum sadece şu aşamada.
  • 21-01-2016, 11:00:15
    #6
    Arkadaşlar problemi hala çözemedim bir üstte yokmu yapabilecek kimse?
  • 21-01-2016, 12:23:22
    #7
    button a{
    color:White;
    }

    dene hocam.
  • 21-01-2016, 14:19:43
    #8
    BoraBozdogan adlı üyeden alıntı: mesajı görüntüle
    button a{
    color:White;
    }

    dene hocam.
    Sonunda oldu hocam allah razı olsun
  • 21-01-2016, 14:50:16
    #9
    McCoy adlı üyeden alıntı: mesajı görüntüle
    Sonunda oldu hocam allah razı olsun
    önemli değil hocam

    Tepetakla Yazıldı.