Yatak katman şablonu

H

hacışakir34

Decapat
Katılım
23 Ocak 2021
Mesajlar
31
Daha fazla  
Cinsiyet
Erkek
Herkese selamlar. Ben siteme aşağıdaki linklerde de mevcut olan dinamik yatak katman şemalarından yapmak istiyorum. Bunu CSS'te yapabilir miyim? Konuyla alakalı bilgili arkadaşlar bana destek olursa çok sevinirim.

Magnasand Therapy Yatak - Bambi Yatak - Yatak Sanatı | Yatak Fiyatları

bambi.com.tr bambi.com.tr
www.isbiryatak.com

Boss - İşbir Yatak

Boss isbiryatak.com'da! En çok tercih edilen Viscostar Akıllı Yataklar modellerini İşbir Yatak'ta keşfetmeye başla!
www.isbiryatak.com www.isbiryatak.com

Şimdiden teşekkürler.
 

Dosya Ekleri

  • yatak katman şeması.jpg
    yatak katman şeması.jpg
    48,2 KB · Görüntüleme: 161
Son düzenleyen: Moderatör:
Elbette.

HTML: 
<!DOCTYPE html>
<html>
<head>
    <style>
        .toggle-Button:checked + .item-Description {
            display: block;
        }

        .item-Description {
            display: none;
        }
    </style>
</head>
<body>
    <div class='a-Container'>
        <input type='radio' name='toggle-Button' class='toggle-Button' checked>
        <div class='item-Description'>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut aliquam felis. Ut nec sem ac ante euismod luctus quis vitae nisi. Sed dapibus lacus purus, sit amet hendrerit sem interdum et. Praesent tincidunt metus eget nunc semper ullamcorper.
        </div>

        <input type='radio' name='toggle-Button' class='toggle-Button'>
        <div class='item-Description'>
            Proin gravida ex erat. Suspendisse nunc urna, interdum ut cursus vitae, rhoncus non mauris. Nam faucibus erat vitae lectus bibendum viverra. Nulla consectetur interdum tempor. Aenean quis efficitur nulla.
        </div>

        <input type='radio' name='toggle-Button' class='toggle-Button'>
        <div class='item-Description'>
            Integer vel nibh eu nisi eleifend hendrerit at vitae ante. Nulla blandit accumsan tempus. Nullam sollicitudin neque non mi lacinia, id pharetra nisi ultricies. Donec sodales erat at tortor eleifend convallis. Curabitur hendrerit nisi quis elit rutrum, eu elementum nibh convallis.
        </div>
    </div>
</body>
</html>
 
Umarım daha açıklayıcı olmuştur.

HTML: 
<!DOCTYPE html>
<html>
<head>
    <style>
        .an-Item {
            display: flex;
        }

        .toggle-Button {
            display: none;
        }

        .toggle-Button:checked + .item-Description {
            display: block;
        }

        .item-Description {
            display: none;
        }
    </style>
</head>
<body>
    <div class='a-Container'>
        <label class='an-Item'>
            <img src='1-ustkumas_boss.webp'>
            <input type='radio' name='toggle-Button' class='toggle-Button' checked>
            <div class='item-Description'>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ut aliquam felis. Ut nec sem ac ante
                euismod luctus quis vitae nisi. Sed dapibus lacus purus, sit amet hendrerit sem interdum et. Praesent
                tincidunt metus eget nunc semper ullamcorper.
            </div>
        </label>
        <label class='an-Item'>
            <img src='aeromax-active-zone-3cm_.webp'>
            <input type='radio' name='toggle-Button' class='toggle-Button'>
            <div class='item-Description'>
                Proin gravida ex erat. Suspendisse nunc urna, interdum ut cursus vitae, rhoncus non mauris. Nam faucibus
                erat vitae lectus bibendum viverra. Nulla consectetur interdum tempor. Aenean quis efficitur nulla.
            </div>
        </label>
    </div>
</body>
</html>
 

Benzer konular

omertares
Haber sitesi şablonu önerisi
Mesaj
3
Görüntüleme
312
746439
7
rauzy
WordPress hazır site şablonu nereden bulunur?
Mesaj
6
Görüntüleme
335
nme2
N
kKerem
Kod Alanı V4 - Yazılım Blog Şablonu
Mesaj
0
Görüntüleme
330
kKerem
kKerem
kKerem
Virids - Dizi V Film Sitesi Şablonu
Mesaj
1
Görüntüleme
528
Helelehololo
H
2
Free WordPress blog sitesi şablonu var mı?
Mesaj
1
Görüntüleme
381
izmirkartali
izmirkartali

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

Toplam: 2 (üye: 0, misafir: 2)

Technopat Haberler

Yeni konular

Yeni mesajlar

Geri
Yukarı