Atölye › Kartvizitim › 9/12. adım

Bağlantılarını ekle

Ne yapıyoruz

Kartvizit sana nasıl ulaşılacağını söyler. Kartın altına bir bağlantı listesi ekleyeceğiz: e-posta ve bir web sitesi (GitHub, Instagram, ne istersen).

Bağlantılar <a> etiketiyle yapılır; liste ise <ul> ve <li> ile.

```html
<ul>
  <li><a href="mailto:ada@example.com">E-mail</a></li>
  <li><a href="https://github.com/">GitHub</a></li>
</ul>
```

Ne işe yarıyor

• <ul> → madde işaretli liste (unordered list). Her maddesi bir <li> (list item).
• <a href="...">E-mail</a> → bağlantı. href özelliği bağlantının nereye gittiğini söyler; <a> ile </a> arasındaki yazı tıklanan kısımdır.
• mailto:ada@example.com → tıklayınca bu adrese e-posta yazma penceresi açılır. Kendi adresini yazabilirsin.
• https://github.com/ → bir web sitesi adresi. Kendi profilinin adresini yazabilirsin.
• Etiketler iç içe: liste → madde → bağlantı. Her biri kendi sırasıyla kapanır.

Sıra sende

Listeyi kartın içine, <p> satırının altına yaz (</div>'in üstüne). Adresleri kendininkilerle değiştirebilirsin. Çalıştır.

Beceriler: HTML ile sayfa yapısı

← Adını renklendir Bağlantılar yan yana →

Tüm adımlar

1. Başlık olarak adın
2. Kendin hakkında bir satır
3. Bir kutuya koy
4. İlk CSS
5. Kutuyu karta benzet
6. Kartı ortala
7. Yumuşak bir gölge
8. Adını renklendir
9. Bağlantılarını ekle
10. Bağlantılar yan yana
11. Tepki veren bağlantılar
12. Kendin yap: tepki veren kart