HayalSohbet Forum - Güncel Haber, Videolar, ve dahası!

sohbet odaları

Go Back   HayalSohbet Forum - Güncel Haber, Videolar, ve dahası! > HayalSohbetCom ~Webmaster~ > Web Dilleri > HtmL


Kullanıcı Tag Listesi


Konu Bilgileri
Kısayollar
Konu Basligi Html Kodları Dersleri Ders Notları
Cevaplar
0
Sonraki Konu
sonraki Konu
Görüntüleyenler
 
Görüntüleme
2043
Önceki Konu
önceki Konu

Yeni Konu aç Cevapla
 
LinkBack Seçenekler Stil
Alt 03-04-2014, 12:20 AM   #1
Üye
GiCiK - ait Kullanıcı Resmi (Avatar)

HayalSohbet.Net - Türkiyenin Sohbet ve Paylaşım Platformu! www.hayalsohbet.net - irc.hayalsohbet.net
Üye No: 564
Üyelik tarihi: Feb 2014
Üye Grubu: Üye
Mesajlar: 1.920
Konular: 1131
Şube: Yurtdışı Şubesi
İlişki Durumu: İlişkisi Yok
Ruh Hali:  none
Tuttuğu Takım:

Level: 36 [♥ Bé-Yêu ♥♥ Bé-Yêu ♥♥ Bé-Yêu ♥♥ Bé-Yêu ♥]
Paylaşım: 88 / 884
Güç: 640 / 26244
Tecrübe: 39%

Teşekkürler: 42
221 Mesajına 236 Kere Teşekkür Edildi
REP Gücü : 13
REP Puanı : 100
REP Seviyesi : GiCiK will become famous soon enoughGiCiK will become famous soon enough
Lightbulb Html Kodları Dersleri Ders Notları

1 Web Tasarımı HTML Kodları ve Kullanımları:
1.1 Temel bileşenler: html, head, title, meta ve body
Web tasarımı yaparken bir WEB sayfasının ilk karşılaşacağımız standart bileşenleri şunlardır:
<html> ve </html> : sayfanın başlangıç ve bitişini belirtir.
<head> ve </head> : sayfanın başlık bilgileri 'title', 'meta' vs. buraya yerleştirilir.

<title> ve </title> : sayfanın içeriğinin ne olduğunun tanıtılmasında kullanılır. Sayfada görünmez ama Firefox ya da Internet Explorer bunu sayfayı tanımlamakta kullanır.

<meta> : sayfanın içeriği hakkında www tarayıcılarına bilgi sağlamak, arama motoru ve arama motoruna kayıt için gereklidir.

<body> ve </body> : sayfanın içeriğinin başlangıç ve bitişini belirtmekte ve sayfa hakkındaki genel tanımlamaları yapmakta kullanılır.
Yukarıdaki bu komutların, bir web sitesi içindeki sıraları aşağidaki gibidir. Bir yazı editörü (joe, pico, xedit, edit, notepad vs.) ile ilk örneğimizi yazarsak:

<html>
<head>
<title>Bir HTML Denemesi</title>
<meta name="description" content="html sayfası için bir kullanım örneği"> </head>
<body bgcolor=white>
'Bu sayfa inşa halindedir', ya da 'this page is under construction' web sitelerinde ille de olması gerektiği düşünülen saçma yazılardır. </body>
</html>

Aslında en basit web sayfası şöyle olabilir:

<html>
Benim neyim eksik?
</html>

sondaki '</html>' yi koymasak dahi www sitesi gosterici programı (Firefox, Opera, IE, ...) bunu bir HTML sayfası olarak yorumlayacaklardır.
1.2 Renkler, body, font, ve h1..h6

Önceki örnekte '<body color=white>' diye, aşağıdakinin basitlestirilmiş biçimini kullanmıştık:

<body font=purple bgcolor=#FFFFFF text=black link=blue vlink=#808090>
Burada font ile kullanilan genel yazıların rengi,
bgcolor ile arkaplan rengi,
text ile tanımsız yazıların rengi,
link ile üzerine gelince el hareketi çekilen yazıların rengi,
vlink ile de seçilmis bağların rengi belirlenir.

renk belirtmek için o rengin İngilizce adı ya da RGB değerleri onaltılık sistemde verilir. RGB deki sıraya göre 00-FF arası üç değer kullanılır. Hepsi sıfır ise hiçbir renkten karıştırılmaz. hepsi FF ise her renk maksimum oranda kullanılır ve beyaz elde edilir.
Örneğin salt bir kırmızı #FF0000 ile elde edilir.

<font color=...> ve </font> arasındakı yazılar belirtilen renkte yazılır.
<h1> ve </h1> den <h6> ve </h6> ya kadar standard yazı tiplerinden biri seçilerek yazı yazılır. h1 ile belirtilenler h6 ile tanımlananlardan daha büyüktür.

örneğin:

<html>
<h1>Sayfa başlığı için uygun büyüklükte harfler</h1>
<h4>Bu harfler sanırım yazı için yeterliler</h4>
<h6> Gözleriniz bozuk değilse, ve her gün A vitamini alıyorsaniz bu yazı sizin için okunabilir olmalı.</h6>
</html>

1.3 Yazıları biçimlendirmek: kalın, yatık, ortalanmış, vs. ...
Önceki web tasarımı örneğinde <h1>, <h2>, ... ile yazıların büyüklüklerini ayarlamanın basit bir yolunu görmüştük. HTML web sayfamızın yazılarına biraz daha kişilik kazandırmak için aşağıdaki komutları da kullanabiliriz.
<b> ve </b> arasındaki yazılar koyu görünür.
<i> ve </i> arasındaki yazılar ise italik basılır.
<blink> ve </blink> arasındaki yazılar ise yanıp söner.
<center> ve </center> arasındaki yazılar ortalanır.
<pre> ve </pre> ile sınirlanan yazıların göruntüsünde ayarlama yapılmaz. Yani birden fazla boşluk varsa bunlar bir tane olacak şekilde azaltılmaz.
<p> paragraf başı yapmak için kullanılır.

<br> bir satır atlamak için kullanılır.

<hr> bir çizgi çeker.

1.4 Sayfada resim göstermek

En basit şekliyle, bir sayfaya resim koymak için aşağıdaki komut şu şekilde;

<img src="dosya-adi" alt="..." align=... >

kullanılır.

Burada dosya-adı gösterilecek grafik dosyasının (png, gif ya da jpg tipinde) bulunduğu yer ve adıdır. Bağlanılan html sayfası ile aynı dizinde bulunan resimler için yer adı belirtmeye gerek yoktur.

Alt ile ise lynx kullanıcılarının görebileceği bir açıklama yazmış oluruz.
Align ile de resmin konumunu belirleriz.

Örneğin:

<img src=resim.gif align=right> ile resmin sağa yanaşık olarak çizilmesini sağlarız. 'right' yerine 'left', 'center', 'middle' gibi konum bildirici bir başka sözcük de kullanılabilir.

Ayrıca yukarıdakilere ek olarak 'border', 'width', 'height' belirteçlerini de <img ...... > içinde kullanabiliriz. Bunlardan 'border='i kullanarak resmin çerçevesini belirleriz; border=0 dersek hiç çerçeve çizilmez.
Width ve height ile resmin boyutlarını belirleyebiliriz. Bunlardan sadace birini verirsek, resmin boyutu orantılı olarak çizilecektir. Yani <img src=resim.gif width=300> demişsek, ve de resmimiz aslında 100 nokta genişliğinde 50 nokta yüksekliğinde idiyse, ekrana 300 nokta eninde ve 150 nokta yüksekliğinde çizilecektir. Her iki değeri de (width=... height=...) kullanmışsak, resmin oranını istediğimiz gibi değiştirmek mümkün olur.
Bu arada, sayfanın internetten indirilirken hızlı gösterilmesini istiyorsak, her resmin width ve height özelliklerini kullanmalıyız. Bu sayede browser (gösterici) programınız resimlerin yüklenmesini beklemeden çevrelerine yazıları yerleştirebilecektir.

Sayfanın hızlı geliyor gibi görünmesini sağlamanın bir yolu da 'lowsrc' belirtecini <img .....> içinde kullanmak. Web tasarımı yaparken eğer kullandığımız resimlerin bir de bulanık/niteliksiz/siyah-beyaz ama az yer tutan bir benzerini daha yapar, ve bunu <img src="resim.gif" lowsrc="hizliresim.gif" alt="[resim]"> şeklinde tanımlarsak, ilk önce hizliresim.gif yüklenip gösterilecektir. Bu sayede bulanık iken yavaş yavaş netleşmeye başlayan resimler belirir sayfamızda. Bunun yararı ise sayfanıza bakan kişinin çabuk karar vermesini sağlıyor olmasındadır.

1.5 HTML sayfasına bağ (link) yerleştirmek

<a> ve </a> : HTML'nin temeli olan bu komutlarla bağ (link) yapılır.
<a href="hedef bağ"> Açıklama </a> Biçiminde kullanılır.
Açıklama denilen kısım ister yazı ister bir grafik ya da herhangi bir nesne olabilir. "hedef bağ" kısmı ise yerel kaynakları gösteren bir dosya adı ya da uzak bir makinedeki bir başka nesneyi (yazı, grafik, video vs.) gösteren bir bağ (link) olur.

Bu linkler, mevcut internet araçlarından biridir.
Örneğin:
http:// ftp:// telnet:// gopher:// news:// bu araçlardan bazılarıdır.
Bunu kullanırken;

<a href="http://www.biltekakademi.com/>biltekakademi'ye bağlanmak için buraya tıklayın</a>

yazarak, telnet aracını bir bağ (link) olarak sayfamıza yerleştirmiş oluruz.
Ya da;

<a href="resmim.jpg">Neye Benzediğimi Görmek İçin Buraya Bas</a>
Yukarıda adı geçen resim bu web sayfası ile aynı dizinde (directory) olmalıdır.

Başka şekilde örnekler ise:

<a href="ftp://ftp.metu.edu.tr/pub/cica-win95/"> Windows95 için Uygulama dosyaları</a>

<a href="nntp://news.metu.edu.tr/> Netnews 60000 den fazla konuda insanların yazıştığı bölge</a>

<a href="news:comp.sys.cbm"> NetNews'in C64 bilgisayarlarına ilişkin tartışmaları</a>

Ve, internetin en gözde kullanımı: bir web sayfasından başka bir web sayfasına bağlanma:

<a href="http://www.biltekakademi.com/"> autocad kursu</a>

<a href="ihd.html"> İnsan Hakları Derneği ve pişmiş tavuk için buraya tıklayabilirsiniz.</a>


___________________________________________

Ne MuTLu TürKüM DiYeNe ......!!!



http://img387.imageshack.us/img387/3...a5ys5iqop8.gif
http://www.glitteryourway.com/img/gl...y-61df5cd7.gif
GiCiK isimli Üye şimdilik offline konumundadır   Alıntı ile Cevapla

GiCiK Kullanicisinin Son 5 Konusu
Baslik Kategori Son Yazan Cevaplar Okunma Son Mesaj
Günde 1.5 litre su içip 2.5 kilo verebilirsin… Bakım ve Guzellik GiCiK 0 11107 04-22-2014 12:48 PM
Sık yıkanan saç daha fazla dökülüyor Bakım ve Guzellik GiCiK 0 7317 04-22-2014 12:44 PM
Koyu renk ruj ne zaman sürülür? Bakım ve Guzellik aminaz 1 7834 04-22-2014 12:41 PM
El Titremesi Neyin Belirtisidir ? Genel Sağlık GiCiK 0 7190 04-13-2014 04:26 PM
Sevgiliye Romantik Aşk Sözleri Aşk ve Sevgi aaryansb 4 9248 04-13-2014 03:13 PM

Cevapla

Etiketler
ders notları, dersleri, html kodları


Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)
 

(View-All Konu Okunma Sayisi : 1
GiCiK
Seçenekler
Stil

Yetkileriniz
Konu Acma Yetkiniz Yok
Cevap Yazma Yetkiniz Yok
Eklenti Yükleme Yetkiniz Yok
Mesajınızı Değiştirme Yetkiniz Yok

BB code is Açık
Smileler Açık
[IMG] Kodları Açık
HTML-Kodu Kapalı
Trackbacks are Açık
Pingbacks are Açık
Refbacks are Açık


Tüm Zamanlar GMT +2 Olarak Ayarlanmış. Şuanki Zaman: 11:29 AM.

Forum Yasal Uyarı

Kuruluş : 2013
2013 - "HayalSohbet Forum" her hakkı saklıdır.
HS-Forum - HAYALSOHBET iştirakidir.
Sohbet - Chat
YASAL UYARI : İçerik sağlayacı paylaşım sitelerinden biri olan hayal forum Adresimizde 5651 Sayılı Kanun'un 8. Maddesine ve T.C.K'nın 125. Maddesine göre TÜM ÜYELERİMİZ yaptıkları paylaşımlardan sorumludur. hayal forum hakkında yapılacak tüm hukuksal Şikayetler, Yöneticilerimiz ile iletişime geçilmesi yada iletişim formunu doldurulması halinde ilgili kanunlar ve yönetmelikler çerçevesinde en geç 1 (Bir) Hafta içerisinde hayal forum yönetimi olarak tarafımızdan gereken işlemler yapılacak ve size dönüş sağlanacaktır.



Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Content Relevant URLs by vBSEO 3.6.0 RC 1
User Alert System provided by Advanced User Tagging v3.1.0 (Lite) - vBulletin Mods & Addons Copyright © 2024 DragonByte Technologies Ltd. Runs best on HiVelocity Hosting.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406