HAKKOD
Filistin'e insani yardım sağlanmasına yardım edin

Metnin Arka Planını Çizerek Vurgulamak

HTML Dersleri > Metnin Arka Planını Çizerek Vurgulamak

Kağıt üzerinde önemli bir yeri vurgulamak istediğimiz zaman fosforlu kalem ile üzerini çizeriz. Aynı işlemi web sitemiz üzerinde de yapmak mümkündür. Bunun için <mark> etiketini kullanırız. Şimdi bir örnek yapalım ve örneğimizde metnin bir kısmının arka planını çizelim.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Enfal Suresi 2</title>
  </head>
  <body>
    <p>
      Müminler ancak ALLAH anıldığı zaman yürekleri titreyen, kendilerine <mark>ALLAH'ın ayetleri okunduğunda imanları artan</mark> ve yalnız Rabbine dayanıp güvenen kimselerdir.
    </p>
  </body>
</html>

Şimdi de tüm paragrafın arka planını çizelim.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Furkan Suresi 58</title>
  </head>
  <body>
    <p>
      <mark>
        Ölümsüz ve daima diri olan ALLAH'a güvenip dayan. Onu hamd ile tespih et. Kullarının günahlarını O'nun bilmesi yeter.
      </mark>
    </p>
  </body>
</html>

<mark> etiketini <h1> etiketi ile birlikte kullanarak sonucu gözlemleyelim.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Şuara Suresi 217</title>
  </head>
  <body>
    <h1><mark>Şuara Suresi 217</mark></h1>
    <p>Sen O mutlak galip ve engin merhamet sahibine güven dayan.</p>
  </body>
</html>

Bir önceki derslerde metnin altını çizmek için kullandığımız <u> etiketi ile birlikte <mark> etiketini kullanalım.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Neml Suresi 79</title>
  </head>
  <body>
    <p>
      <u>
        <mark>
          O halde sen ALLAH'a güvenip dayan.
        </mark>
      </u>
    </p>
  </body>
</html>

Gördüğünüz gibi metnimizin hem altını hemde arka planını çizmiş olduk. Bu şekilde diğer etiketleride birlikte kullanabilirsiniz. Örneğin bir metnin hem altını çizebilir (<u> etiketi), hem arka planını çizebilir (<mark> etiketi), hem kalın yazabilir (<b> ve <strong> etiketleri), hem de italik yazabilirsiniz (<i> ve <em> etiketleri).

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Neml Suresi 79</title>
  </head>
  <body>
    <p>
      <u>
        <mark>
          <strong>
            <em>
              O halde sen ALLAH'a güvenip dayan.
            </em>
          </strong>
        </mark>
      </u>
    </p>
  </body>
</html>

Yukarıdaki örneğimizde metnimizi girmek için <p> etiketini, metnimizin altını çizmek için <u> etiketini, metnimizin arka planını çizmek için <mark> etiketini, metnimizi kalın yazmak için <strong> etiketini, metnimizi italik yazmak için ise <em> etiketini kullandık.

<p> etiketi sabit kalmak koşuluyla <u>, <mark>, <strong>, <b>, <em> ve <i> etiketlerinin sıralamasını değiştirebilirsiniz. Bunda hiçbir sakınca yoktur.