Html Ders: 3

Yazılım Tarihi Ağustos 09, 2023

Birden çok öğeye bağlantı ekleme

Bağlantılar, yalnızca metin değil, birçok öğe içerebilir.

Bir videoya bağlantı vermek için bazı resimler ve metin kullanalım. Kullanıcının metne tıklamaya gerek kalmadan istediğimiz yere gitmesini istediğimizde kullanışlı olabilir.

<div>
  <a href="https://www.youtube.com/watch?v=gBjnfgnwXic">
    <img src="images/img4.jpg" alt="cute owl">
    <img src="images/img5.jpg" alt="another cute owl">
    <br>
    Watch the video
  </a>
</div>

Metni biçimlendirme

Ayrıca metni vurgulayabilir veya önemli hale getirebiliriz . Vurgu için kullanıyoruz <em>ve önem için<strong>

Paragrafınızın içeriğinin bir kısmını vurgulayalım

<p>
  Most birds of prey sport eyes on the sides of their heads,
  but the stereoscopic nature of
  the owl's forward-facing <strong>eyes permits the greater
  sense of depth perception</strong> necessary for low-light hunting.
</p>

Özel karakterler ve daha fazla biçimlendirme

Bazı karakterlerin HTML'de özel anlamları vardır. Örneğin, HTML etiketleri yapmak için <ve kullanırız >ve niteliklerimizi sarmak için “ kullanırız. Peki ya bu karakterleri sayfamızda kullanmak istersek?

Bunun bir yolu HTML varlıklarını kullanmaktır . Bunlar bir ve işareti, bir ad ve ardından noktalı virgülden oluşur. İşte bir alıntı karakteri için HTML varlığı: ".

Özel karakterler oluşturmak için sayısal bir biçim de kullanabilirsiniz. İşte bazı ortak varlıkların bir listesi.

Sayfanıza, "Baykuş ve Kedi-kedi" yerine ilk cümlenin "Baykuş ve Kedi-kedi" olduğu küçük bir kafiye ekleyin ve işareti için HTML öğelerini kullanın: &.

<div>
  <p>
    <strong>
       "The Owl &amp; the Pussy-cat went to sea <br> 
        In a beautiful pea-green boat"
    </strong>
  </p>
  <small>&mdash; nursery rhyme</small>
</div>

posta bağlantıları`<a>`

Bağlantılar ayrıca bir kullanıcının e-posta istemcisini açabilir ve içerik paylaşabilir. Bağlantılar ve mailto bağlantıları arasındaki fark, href özelliğinde tanımlanan içeriktir .

<ul>
  <li>
     <a href="mailto:social@codebar.io?subject=I%20love%20owls%20::%20codebar">Email us</a>
  </li>
  <li>
     <a href="mailto:?subject=I%20love%20owls%20::%20codebar">Email a friend</a>
  </li>
</ul>