STAJIN ÜÇÜNCÜ GÜNÜ
Web tasarımının devamı yapıldı. Verilen ödevler yapıldı. Sorulan sorular cevaplandı. HTML-CSS hakkında bilgiler araştırıldı.Bazı kavramlarım karşılığı verildi.
HTML-CSS
*Doctype nedir?
Doctype HTML - XHTML doküman tipini belirler. Html kodlama yaparken DOCTYPE bildirimi tarayıcının yani browserin tarama metodunu belirler. Bir dökümanda DOCTYPE tanımı yapılırsa bu sayfa belirli standartlara uygundur denir. Eğer doğru kullanılmazsa veya hiç kullanılmazsa web tarayıcıları tarafından sitemiz doğru okunmayacağı gibi kodlamaları da yanlış yapmış oluruz. Bunun için Doctype kullanımı önemlidir.*Css Nedir?
Css internet sayfalarının görünümünü değiştiren bir tanım dosyasıdır. CSS kendine has kuralları olan bir tanım dilidir denilebilir. CSS Sayfa içersindeki her bir elemana ait farklı özellik atamayı sağlar
Css Özellikleri:
- Html sayfasındaki nesnelerin görüntüsünü belirler
- Html 4.0 sürümü ile stil dosyaları geliştirilmiştir
- CSS ayrı bir dosyada *.css uzantısı ile saklanabilir. Bu işlem sayfanın daha hızlı açılmasını sağlar
- Elemanlar üzerinde style="" parametresi ile özel kısa tanımlar yapılabilir
<html> sayfa türünü belirtir.
<head> Dökümanın temel başlık elemanlarını içerir.
<link > Dökümana dışardan bir kaynak bağlar
<div> Dökümanda bir bölümü temsil eder.
<span> Dökümanda bir bölümü gösterir.
<h1> Başlık yazısı belirler.
<ul> Düzensiz liste oluşturur.
<li> Liste elemanını temsil eder.
<a> Link belirtir.
<strong> Kalın yazı yazmayı sağlar.
<label> Form için metin etiketleri oluşturmaya yarar.
<form> Bilgi kayıt formu oluşturur.
<input>Form için bilgi alanı oluşturur.
<textarea>Yazı alanı oluşturur.
<p>Paragraf oluşturmaya yarar.
<b> Kalın yazmayı sağlar.
<footer>Altbilgi oluşturur.
<header> Üstbilgi oluşturur.
<article>Etiketi bağımsız, kendi kendine yeten içeriği belirtir.Örnek:Forum sonrası,Blog yazısı,Haber,Yorum
<aside>Kenar çubuğu gibi görünümü sağlar.
background :arkaplan
overflow :Belirlenen yükseklikle yazının taşması engellenir.
border:Sınırı belirler.kalınlığı değiştirir.
float: Float bir elementi normal akışın dışına çıkarmak için kullanılan bir yöntemdir. Birbiri ardına sıralanmış elementlere float uygulandığında elementler eğer yeterli alan varsa yan yana dizilirler.
margin :Dış boşluk ayarlar.
padding :İç boşluk ayarlar.
width :Genişliği ayarlamaya yardımcı olur.
height :Yüksekliği ayarlamaya yardımcı olur.
display:Elemanın nasıl görüneceğini belirler.(Satır ,sutun, Grup...)
list-style:Liste özelliklerinin kısa yoludur.
color :Renk atamak için kullanılır.
font-size : Yazının buyuklüğünü ayarlar.
font-weight:Yazının kalınlığını ayarlamak için kullanılır.
test-decoration:Bu özellik metinlerimize özel işaretler koymamızı sağlar. Örneğin metinlerinizin altını çizmek gibi..
JQuery Nedir?
Jquery bir javascript kütüphanesi, bir javascript frameworküdür. Sayfalardaki animasyonlar için Flash alternatifi olarak kullanılan bu teknoloji ile, slaytlar, foto galeriler,tab menüler yapmak oldukça kolaydır.
Jquery bir javascript kütüphanesi, bir javascript frameworküdür. Sayfalardaki animasyonlar için Flash alternatifi olarak kullanılan bu teknoloji ile, slaytlar, foto galeriler,tab menüler yapmak oldukça kolaydır.
Jquery ile CSS iç içedir. Az kod yaz fazla tasarım çıkart Jquery’nin sloganıdır.
Nasıl Çalıştırılır?
JQuery sadece 1 dosyadan oluşan .js uzantılı bir dosyadır. Sürekli güncellenen bu dosyayı JQuery nin resmi sitesinden indirebilirsiniz.
İndirme işleminden sonra artık dosyayı kendi sayfanıza entegre edebilirsiniz.
<script type="text/javascript" src="latest-jquery.js"></script>
Entegre edilen bu kütüphane JQuery komutlarını çalıştırabilmemizi sağlayacaktır.
JQuery Örnekleri;
Nasıl Çalıştırılır?
JQuery sadece 1 dosyadan oluşan .js uzantılı bir dosyadır. Sürekli güncellenen bu dosyayı JQuery nin resmi sitesinden indirebilirsiniz.
İndirme işleminden sonra artık dosyayı kendi sayfanıza entegre edebilirsiniz.
<script type="text/javascript" src="latest-jquery.js"></script>
Entegre edilen bu kütüphane JQuery komutlarını çalıştırabilmemizi sağlayacaktır.
JQuery Örnekleri;
click ve alert komutu;
hover ve alert komutu;
Hiç yorum yok:
Yorum Gönder