Extra

Kategori: HTML , 27 Ekim 2019 , JanFranco


Bu yazımda HTML'de bahsetmediğim son özelliklerden bahsedeceğim. HTML'de her elementte id ve class attribute'larını kullanabiliriz. Eğer bir elementi diğer elementlerden spesifik olarak ayırmak istiyorsak id attribute'ını kullanacağız. Eğer bir sayfada bir kaç elementi diğer elementlerden ayırmak istiyorsak class attribute'ını kullanacağız. id attribute'ı tek bir elemente, class attribute'ı ise birden fazla elemente uygulanabilir. Sayfada gözle görülebilir bir değişiklik yaratmazlar ancak CSS veya JS ile id veya class belirttiğimiz elementlere direkt olarak ulaşabilir ve değişiklik yapabiliriz. Kullanıma örnekler verelim:


<p>Water and air. So very commonplace are these
substances, they hardly attract attention - and
yet they vouchsafe our very existence.</p>
<p id="pullquote">Every time I view the sea I feel
a calming sense of security, as if visiting my
ancestral home; I embark on a voyage of seeing.
</p>
<p>Mystery of mysteries, water and air are right
there before us in the sea.</p>

<p class="important">For a one-year period from
November 2010, the Marugame Genichiro-Inokuma
Museum of Contemporary Art (MIMOCA) will host a
cycle of four Hiroshi Sugimoto exhibitions.</p>
<p>Each will showcase works by the artist
thematically contextualized under the headings
"Science," "Architecture," "History" and
"Religion" so as to present a comprehensive
panorama of the artist's oeuvre.</p>
<p class="important admittance">Hours: 10:00 – 18:00
(No admittance after 17:30)</p>
Elementleri bir gruba dahil edebiliriz. Bunu div etiketini kullanarak yaparız. div etiketini kullanarak bir grup açabilir, bu grubun id'sini belirleyebilir ve CSS ile bu id'yi kullanarak bu gruptaki tüm elementlerin görünüşlerini değiştirebiliriz. Bunları CSS yazı serisinde anlatacağım. div kullanımına bir örnek verelim:


<div id="header">
	<img src="images/logo.gif" alt="Anish Kapoor" />
	<ul>
		<li><a href="index.html">Home</a></li>
		<li><a href="biography.html">Biography</a></li>
		<li><a href="works.html">Works</a></li>
		<li><a href="contact.html">Contact</a></li>
	</ul>
</div>
div etiketi dış elementler için kullanılırken, text içinde gruplar oluşturmak için span etiketi kullanılır:


<p>Anish Kapoor won the Turner Prize in 1991 and
exhibited at the <span class="gallery">Tate
Modern</span> gallery in London in 2003.</p>
Bir web sayfasının içinde bir pencere aracılığıyla başka bir web sayfasını gösterebiliriz. Bunu inline frame anlamındaki iframe etiketi ile yapabiliriz:


<iframe width="450" height="350" src="http://maps.google.co.uk/maps?q=moma+new+york
&amp;output=embed"></iframe>
width ve height attribute'ları ile boyutu değiştirebiliriz. src attribute'ı sayfanın linkidir. Meta etiketleri ile sayfa hakkında bilgi verebiliriz. Gözle görülür bir değişiklik yaratmazlar ancak arama motorları tarafından çok önemlidir. Header bölümünde tanımlanırlar. Örnek:


<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript" />
<meta name="description" content="Tutorials on Computer Science" />
<meta name="author" content="Jan Franco" />
<meta name="robots" content="nofollow" />
<meta http-equiv="refresh" content="30" />
İlk satırda sayfa hakkında anahtar kelimeler tanımladık. İkinci satırda içerik hakkında bilgi verdik. Google'da bir arama yaptığımızda sayfa altlarında bu yazıyı görebiliriz. Üçüncü satırda yazar hakkında bilgi verdik. Dördüncü satırda robotlara, botlara sayfanın indexlenmemesini söyledik. Son satırda da sayfanın 30 saniyede bir yenileneceğini söyledik.


Sonraki Yazı: Flash, Audio, Video
Yorumlar

Henüz bir yorum bulunmuyor.
Yorum bırakın