HTML Block Ve Inline Elementler - Bilişim & Programlama

Trang chủ » Html Blok Elementleri » HTML Block Ve Inline Elementler - Bilişim & Programlama

Có thể bạn quan tâm

Her HTML öğesinin, ne tür öğe olduğuna bağlı olarak varsayılan bir görüntüleme değeri vardır.

İki görüntüleme değeri vardır: blok ve satır içi. (Block ve inline)

Blok Düzeyindeki Öğeler

Blok düzeyinde bir öğe her zaman yeni bir satırda başlar ve mevcut tüm genişliği kaplar (olabildiğince sola ve sağa uzanır).

Örnek:

HTML’deki blok düzeyi öğeler şunlardır:

<address> <article> <aside> <blockquote> <canvas> <dd> <div> <dl> <dt> <fieldset> <figcaption> <figure> <footer> <form> <h1>-<h6> <header> <hr> <li> <main> <nav> <noscript> <ol> <p> <pre> <section> <table> <tfoot> <ul> <video>

HTML Satır içi Öğeler

Satır içi bir öğe yeni bir satırda başlamaz ve yalnızca gerektiği kadar genişliğe sahip olur.

HTML’deki blok düzeyi öğeler şunlardır:

<a> <abbr> <acronym> <b> <bdo> <big> <br> <button> <cite> <code> <dfn> <em> <i> <img> <input> <kbd> <label> <map> <object> <output> <q> <samp> <script> <select> <small> <span> <strong> <sub> <sup> <textarea> <time> <tt> <var>

Not: Bir satır içi öğe, blok düzeyinde bir öğe içeremez!

<div> Öğesi

<div> öğesi genellikle diğer HTML öğeleri için bir kap olarak kullanılır.

<div> öğesinin gerekli öznitelikleri yoktur, ancak stil, sınıf ve kimlik ortaktır.

CSS ile birlikte kullanıldığında, <div> öğesi içerik bloklarına stil uygulamak için kullanılabilir:

Örnek:

XHTML <!DOCTYPE html> <html> <body> <div style="background-color:blue;color:white;padding:20px;"> <h2>Londra</h2> <p>Londra, İngiltere'nin başkentidir. 13 milyondan fazla nüfusu olan bir metropol alanı ile Birleşik Krallık'ın en kalabalık şehridir.</p> <p>Thames Nehri üzerinde duran Londra, iki bin yıldır önemli bir yerleşim yeri olmuştur ve tarihi, Londinium adını veren Romalılar tarafından kurulmasına kadar uzanmaktadır.</p> </div> </body> </html>
1234567891011121314 <!DOCTYPE html><html><body> <div style="background-color:blue;color:white;padding:20px;"><h2>Londra</h2><p>Londra, İngiltere'nin başkentidir. 13 milyondan fazla nüfusu olan bir metropol alanı ile Birleşik Krallık'ın en kalabalık şehridir.</p><p>Thames Nehri üzerinde duran Londra, iki bin yıldır önemli bir yerleşim yeri olmuştur ve tarihi, Londinium adını veren Romalılar tarafından kurulmasına kadar uzanmaktadır.</p></div> </body></html>

Çıktı:

<span> Öğesi

<span> öğesi, bir metnin bir bölümünü veya bir belgenin bir bölümünü işaretlemek için kullanılan bir satır içi kapsayıcıdır.

<span> öğesinin gerekli öznitelikleri yoktur, ancak stil, sınıf ve kimlik ortaktır.

CSS ile birlikte kullanıldığında, <span> öğesi metnin bölümlerine stil uygulamak için kullanılabilir:

Örnek:

XHTML <!DOCTYPE html> <html> <body> <h1>Span öğesi</h1> <p>Ali' nin gözleri <span style="color:blue;font-weight:bold">mavi</span> renkli, babasının gözleri ise <span style="color:darkolivegreen;font-weight:bold">koyu yeşil</span> dir.</p> </body> </html>
123456789101112 <!DOCTYPE html><html><body> <h1>Span öğesi</h1> <p>Ali' nin gözleri <span style="color:blue;font-weight:bold">mavi</span> renkli, babasının gözleri ise <span style="color:darkolivegreen;font-weight:bold">koyu yeşil</span> dir.</p> </body></html>

Bunu paylaş:

  • Twitter üzerinde paylaşmak için tıklayın (Yeni pencerede açılır)
  • Facebook'ta paylaşmak için tıklayın (Yeni pencerede açılır)

İlgili

TagsHTML Blok Elementler HTML Dersleri HTML Div Etiketi HTML inline ve block Elementler HTML Span Etiketi

Từ khóa » Html Blok Elementleri