Html Html Dersleri , Html Sohbet Temaları , Html Kodları , Html Renk Kodları ' na bu başlık altından ulaşabilirsiniz. |
|
Seçenekler | Stil |
17 Ocak 2021, 01:59 | #1 |
CSS Speech bubbles (Konuşma balonu)
CSS Speech bubbles ile sohbet balonları oluşturup fikirlerinizi tasarım halinde okuyucularınıza veya ziyaretçilerinize iletmeniz için yararlıdır. Konuşma balonları olarak da sıkça aratılan css kodları , grafik , logo ve web tasarımında kullanılır. İkon ( icon , ico ) olarak da tercih edilir ki estetik ve görsel açıdan hoş görüntüler sağlar.
En çok sohbet sitelerinin işine yarayabilecek olan Sohbet Balonları ( CSS Speech bubbles ) konusunu hakkında bir kaç örnek vermeye çalışalım. Sohbet Balonu ( Üçgen Altta ) Html Kodu ; HTML-Kodu<hgroup class="bubble"> <h1>Mekansız</h1> <h2>CSS konuşma balonları mekansiz.net 'de!</h2> </hgroup> HTML-Kodu.bubble { position: relative; background: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=00aabb]#00aabb[/URL] border-radius: .4em; } .bubble { width: 260px; padding: 60px 20px; margin: 1em 0; text-align: center; color: white; font-weight: bold; font-size: 200%; text-shadow: 0 -0.05em 0.1em rgba(0,0,0,.3); } .bubble:after { content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 0; border: 20px solid transparent; border-top-color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=00aabb]#00aabb[/URL] border-bottom: 0; border-left: 0; margin-left: -10px; margin-bottom: -20px; } .bubble h1 { color:white; margin: 0; font-size: 150%; } .bubble h2 { margin: 0; font-size: 40%; font-weight: normal; } CSS3 Konuşma Balonu Yukarıda görmüş olduğunuz CSS kod bölümündeki ; HTML-Kodu.bubble:after { Konuşma Balonu Üçgen solda Css Kodu ; HTML-Kodu.bubble:after { content: ''; position: absolute; left: 0; top: 50%; width: 0; height: 0; border: 20px solid transparent; border-right-color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=00aabb]#00aabb[/URL] border-left: 0; border-bottom: 0; margin-top: -10px; margin-left: -20px; } Css Kodu ; HTML-Kodu.bubble:after { content: ''; position: absolute; top: 0; left: 50%; width: 0; height: 0; border: 20px solid transparent; border-bottom-color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=00aabb]#00aabb[/URL] border-top: 0; border-left: 0; margin-left: -10px; margin-top: -20px; } Css Kodu ; HTML-Kodu.bubble:after { content: ''; position: absolute; right: 0; top: 50%; width: 0; height: 0; border: 20px solid transparent; border-left-color: [URL=https://www.ircrehberi.net/usertag.php?do=list&action=hash&hash=00aabb]#00aabb[/URL] border-right: 0; border-bottom: 0; margin-top: -10px; margin-right: -20px; } Konu ExCaLuBuR tarafından (12 Mart 2023 Saat 22:16 ) değiştirilmiştir.. |
|
|
17 Ocak 2021, 02:01 | #2 |
Emeğinize sağlık
________________
Bazen de yıldızlar bakar.
İnsanlar kayar hayatımızdan.. |
|
|
17 Ocak 2021, 02:02 | #3 |
Emeğinize sağlık
________________
. |
|
|
17 Ocak 2021, 02:02 | #4 |
Teşekkürler LaviNia , Rima sizin de emeklerinize sağlık.
|
|
|
17 Ocak 2021, 02:25 | #5 |
Emeğine sağlık
________________
bazen insanlar iyilesmek istemez.
cünkü , icindeki acı sevdiklerinin son hatirasidir.. per aspera ad astra ✨ |
|
|
24 Mayıs 2021, 22:54 | #6 |
Güzel paylaşımlarınız ve herkesi konu ile alakalı bilgilendirdiğiniz için teşekkür ederiz.
________________
|
|
|
Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir) | |
|
|