Ara
  • Temel Bilgileri
  • HTML Dile Genel Bakış
  • HTML Editörler
  • HTML Temelleri
  • Paragraf Koordinasyon
  • HTML Paragraflar
  • HTML Başlıklar
  • HTML Metin Biçimlendirme
  • HTML Metin Düzenleme
  • HTML Alıntılar
  • HTML Kod biçimlendirme
  • HTML Bağlantılar
  • Listeler ve Tablolar
  • HTML Tablolar
  • HTML Sıralamalı listeler
  • HTML Sırasız Listeler
  • HTML Açıklama listeleri
  • Medya ve Dahili Sayfalar
  • HTML Dosya Yolları
  • HTML Resimler
  • HTML Videolar
  • HTML Sesleri
  • HTML Iframe
  • Form oluşturma
  • HTML Formlar
  • HTML Form Öğeleri Adresleme
  • HTML Form Giriş Alanları
  • HTML Formda Normal Düğmeler
  • HTML Onay Kutuları
  • HTML Radyo Düğmeleri
  • HTML Açılır Listeler
  • HTML Seçim Aralıkları
  • HTML Formun Ortak Öğelerini Toplamak
  • Sayfanın dilini belirtmek
  • HTML Dil Kodları
  • HTML Ülke Kodları
  • HTML Farklı Dillerde Sayfalar
  • Kapsamlı Referanslar
  • HTML Dilin Tüm Etiketleri Ve Özellikleri
  • Diğer dersler
  • HTML Yazı Arası Boşluk
  • Database - Veritabanları
  • HTML5 Nedir?
  • ens

K-kudo

HTML öğren

HTML araçları

  • Ana Sayfa
  • Kod Editor
  • Kod Dönüştürücü
  • Color Picker
  • Araştırma

HTML Paragraflar

önceki ders sonraki ders

Bu dersten öğrenmeye başlayacaksın, buradan programlama dünyasına başlangıç noktanı olacak ve benimle başlayacağın için çok mutluyum.
Her dersten önce bir bardak kahve hazırlamanı ve bir not defter ve kalem getirmeni rica ediyorum. Ve bütün yeni aldığın bilgiler ve anlamadığın tüm bilgileri not etmeni istiyorum. Ve bunca çabanı rağmen bir bilgiyi anlayamadığın durumda soruyu araştırmaya sorabilirsin ve Allah'ın izniyle en kısa sürede sorunu cevap vereceğim.

Bu kursun çok kolay olacağını bilmeni isterim ve inan birkaç gün içinde bitireceksin ve HTML öğrenmiş olacaksın ve yolunu başlamak için tamamen hazır olacaksın.

Bu kursu bir yıldan fazla bir süredir hazırlıyorum ve olabilecek en iyi kurs olması için hazırladım ve bu kursu senin için, evet senin için oluşturduğumu bilmeni isterim, senden tek istediğim şey iyi odaklanmanı ve Bu HTML kursundan öğrenebileceğin her şeyi öğrenmeni ve seni söylemek istediğim Bir şey daha var, bu kurs tüm ücretli kurslara eşdeğerdir hata daha iyi ve ücretsizdir. Burada verilen tüm hizmetler ücretsizdir, dersleri ücretsiz olarak okuyabilirsin ve öğrenebilirsin. senin için hazırladığım araçları ücretsiz olarak kullanabilirsin ve, istediğin soruyu veya anlamadığın her şeyi ücretsiz olarak sorabilirsin ve burada eklenen her şey tamamen ücretsizdir. Bana yardımcı olmanı ve kullanıyorsan reklam engelleyiciyi devre dışı bırakmanı rica ediyorum. Bilin ki can sıkıcı reklamlar eklemiyorum veya ders içi tüm reklamlar can sıkıcı olmasın diye sayfanın en üstüne ve en altına kadar ekledim.

Hepinize en iyisini diliyorum ve "iyi şanslar" gibi bir şey söylemeyeceğim çünkü bu sizin sıkı çalışmanıza bağlıdır ve kim çalışmazsa onu biçmez.


Sayfa içeriği
  • › Paragraf kavramı
  • › Metni uygun şekilde görüntülemek için paragraflar
  • › Paragrafta yeni bir satıra inme
  • › Bir paragraftaki kelimeler arasında birden fazla boşluk göstermek
  • › Metni olduğu gibi görüntülemek için paragraflar
  • › Sayfada HTML kodu nasıl görüntülenir
  • › Yatay bir çizginin görünümü

Paragraf kavramı

Paragraf, içine yerleştirdiğimiz metni yeni bir satırda görüntülemek için belirlenmiş bir alandır.

Paragraf türleri

Sayfaya eklenebilecek iki tür paragraf vardır:

  • Metni uygun şekilde görüntülemek için özel paragraflar.
  • Metni olduğu gibi görüntülemek için paragraflar.

İki tür arasındaki fark, metni uygun şekilde görüntülemesi amaçlanan paragrafın, içine yerleştirilen metni ekran boyutuna göre göstermesi ve böylece kullanıcının içindeki tüm metni kolayca görebilmesi ve metni otomatik olarak biçimlendirmesidir.
Ve paragraflar metni olduğu gibi görüntülemek için, yazdığın metni hiç değiştirmeden tamamen görüntüler. Formatlı olmadığı ve kullanıcıya göstereceğin metin formatsız ve düzensiz olacağı için kullanmanı tavsiye etmiyorum.


Metni uygun şekilde görüntülemek için paragraflar

Sayfada normal metin görüntülemek için metni <p> </p> içinde eklemelisin.

Bilgi: p, paragraf anlamına gelen paragraph kelimesinin kısaltmasıdır.

Bu etiketle metin görüntülerken, tarayıcı gereksiz bulduğu fazladan beyaz boşlukları (Ekstra Beyaz Boşluklar) aşağıdaki gibi kaldırır:

  • Sözcükler arasında birden fazla boşluk varsa, yalnızca bir boşluk kalır.
  • Boş satırlar bulursa, içeriği sayfada görüntülerken bunları kaldırır.
  • Birden fazla satıra kasıtlı olarak yerleştirilmiş metni bulursa, tüm içeriği aynı satırda görüntüler ve yalnızca gerektiğinde yeni satıra düşer.

"yalnızca gerektiğinde yeni satıra düşer" dediğim ya?, kastettiğim şey ekranda boş yer kalmadığı için tarayıcı metni yeni satırda tamamlamak zorunda kaldığı için yeni bir satıra geçti.

Aşağıdaki örnekte, sayfada iki paragraf görüntüledim.
Kodu denediğinde, sayfada iki paragrafın birbirinin altında nasıl görüneceğine dikkat et.

  • <p>Bu bir paragraftır.</p>
  • <p>Bu başka bir paragraf.</p>
kod dene  

Aşağıdaki örnekte, sözcüklerin arasına kasıtlı olarak fazla boşluk ekledim. Kodu denediğinde, tarayıcı gereksiz bulduğu tüm boşlukları nasıl kaldıracağına ve metni nasıl güzel bir şekilde görüntüleyeceğine dikkat et.

  • <p>   Bu   paragraf   fazladan   boşluk    içerir.</p>
kod dene  

Aşağıdaki örnekte metni birden fazla satıra yazmak kaste ettim.
Kodu denerken, metnin birden fazla satıra yazıldığını göz ardı ederek tarayıcının tüm metni bir satırda nasıl görüntüleyeceğine dikkat et.

  • <p>HTML zor değildir,
  • kolayca öğrenebilirsin ve
  • web programlama için çok önemlidir.</p>
kod dene  

Paragrafta yeni bir satıra inme

Tarayıcıya paragrafın içinde yeni bir satıra gitmek istediğin zamanda tarayıcı bildirmek için satırın sonuna <br> yazabilirsin.

Bilgi: br, gösteriyi aynı satırda durdurmak anlamına gelen Break'in kısaltmasıdır.

Aşağıdaki örnekte, tarayıcıya kesiyoruz kelimesinden sonra kalan metnin yeni bir satırda görüntülenmesi gerektiğini söyledim.

  • <p>Burada paragrafı kesiyoruz.<br> Bu, yeni bir satırda görünecektir.></p>
kod dene 

Bir paragraftaki kelimeler arasında birden fazla boşluk göstermek

Metinde arka arkaya birden fazla boşluk yazmak istediğin zamanda tarayıcıya söylemek için &nbsp; sembolu kullanmalısın, tarayıcı için boş alan anlamına gelir.
her bir &nbsp; sembolu tarayıcı kaldırılmaması gereken boş bir alan olduğu anlar.

Aşağıdaki örnekte metnin başına 4 boşluk ekledim.

  • <p>&nbsp;&nbsp;&nbsp;&nbsp;Başına dört beyaz boşluk ekledim. </p>
kod dene 
yazı arası boşluk hakkında daha çok bilgi almak istiyorsan html yazı arası boşluk dersı okuyabilirsin.

Metni olduğu gibi görüntülemek için paragraflar

Metni tam olarak kodda göründüğü gibi görüntülemek için metni <pre> </pre> içine eklemelisin.

Bilgi: pre, önceden biçimlendirilmiş metin anlamına gelen Preformatted Text'in kısaltmasıdır.

Aşağıdaki örnekte, tarayıcıda olduğu gibi görüntülemek için <pre> </pre> içine metin yazdım.

  • <pre>
  • Name: kaneki kudo
  • Job:  Programmer
  • Birth day:  (2007−4−25)
  • </pre>
kod dene 

Sayfada HTML kodu nasıl görüntülenir

Düşünmeni gereken tek şey, tarayıcının yazdığın kodu normal metin olarak kabul etmesini sağlamalısın, böylece normal kod olarak okumasın ve sonucunu sayfada göstersin.
Bir kodun sayfada görünmesi için yapmanı gereken üç şey vardır:

  • Koddaki her < öğesini &lt;'ye dönüştürmek.
  • Koddaki her > öğesini &gt;'ye dönüştürmek.
  • Kodda bulunan tüm & sembollar tümünü &amp;'a dönüştürmek.

Aşağıdaki örnekte, koddaki her < öğesini &lt; olarak değiştirerek sayfadaki HTML kodunu ekledim.

Not: Kodu <pre> </pre> içine koyduk, böylece bizim koyduğumuz şekilde görünecek.
  • <pre>
  • &lt;!DOCTYPE html>
  • &lt;html>
  • &lt;body>
  • &lt;p>HTML &amp; CSS are so easy to learn&lt;/p>
  • &lt;/body>
  • &lt;/html>
  • </pre>
kod dene 

Yatay bir çizgi eklemek

Sayfada yatay bir çizgi görüntülemek için sadece <hr> ekleyeceksin.

Bilgi: hr, yatay cetvel anlamına gelen Horizontal Rule kelimesinin kısaltmasıdır.

Aşağıdaki örnekte, iki paragraf arasında yatay bir çizgi ekledim.

  • <p> K-html.com'da ihtiyacın olan her şeyi ücretsiz olarak öğrenebilirsin.</p>
  • <hr>
  • <p>Bu kurstan sonra birçok şey ekleyeceğim !!</p>
kod dene 
önceki ders sonraki ders

Kullanım Koşulları ve Gizlilik Politikası © 2021-2023 HTML öğren.

Ankara Lastik Tamiri