Sunuyu indir
Sunum yükleniyor. Lütfen bekleyiniz
1
BİLİŞİM TEKNOLOJİLERİ
MODÜL : WEB TASARIM
2
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
3
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
4
KODLARLA TANIŞALIM Eğer numara tipini değiştirmek istersek <ol> nin tipini değiştirmemiz gerekir. Diğer bir deyişle <ol type=”A”> şeklinde düzenlenmiş tag listeyi A dan başlatır.
5
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
6
KODLARLA TANIŞALIM Bunun gibi <ol type=”a”> veya <ol type=”I”> şeklinde de olabilir. Eğer tersten sıralamak isteniyorsa <ol reversed=”reversed”> özelliği kullanılmalıdır.
7
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
8
KODLARLA TANIŞALIM Eğer liste belirli bir sıradan başlatılmak isteniyorsa <ol start=”başlangıç noktası”> özelliği kullanılmalıdır. Aşağıdaki örnekte liste tersten tipi roma rakamı ve başlangıç noktası “11” seçilmiştir.
9
KODLARLA TANIŞALIM 1 Onluk tabanda numaralama (1,2,3,4,…) i Küçük rakamlarla romen sayıları (i,ii,iii,iv,…) I Büyük rakamlarla romen sayıları (I,II,III,IV,…) a Küçük harflerle alfabetik (a,b,c,…) A Büyük harflerle alfabetik (A,B,C,…)
10
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
11
KODLARLA TANIŞALIM <ul> tiplerini de listeleme yaparken “square” , ”circle” veya “disc” ayarlanabilir. Daha önce yapılan örneklerde default olarak disc alınmıştır.
12
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
13
KODLARLA TANIŞALIM Tanımlama Listeleri:
Tanımlama ve kategorik listeleme için sırasıyla <dl> <dt> ve <dd> tagları kullanılır. <dl> description list “Tanımlama Listeleri”, <dt> description terim “ Tanımlama Terimleri”; <dd> description definition “Açıklamalar”;
14
BİLİŞİM TEKNOLOJİLERİ
RESİM İŞLEMLERİ
15
KODLARLA TANIŞALIM Resim işlemleri <img> tagı ile yapılmaktadır. Ayrıca <img> tagının src, alt, title,width, ve height özellikleri vardır. src: source, resim kaynağını alt: alternate text; resim adının görüntülenememe durumunda verilmesini title: resim üzerine gelindiğinde resmin adını verir. Arama motorları için önemlidir. width: resmin genişliğini ayarlamak için kullanılır. height: resmin yüksekliğini ayarlamak için kullanılır.
16
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
17
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ Resim genişliği 180 ve yüksekliği 75
18
KODLARLA TANIŞALIM Resimlere alt veya üst yazı ekleme <figcaption>: Resim 1.1, Şekil 1.2 gibi resmin alt ve üstünde yazı eklemek istendiğinde <figcaption> tagı kullanılır. Yazının resmin üstünde olması isteniyorsa <img> tagının üzerinde altında olması isteniyorsa altında yazılır.
19
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
20
KODLARLA TANIŞALIM Favicon:
Web sayfalarının sekmelerinde gözüken küçük resim yani ikon sitenizin veya sayfanızın faviconudur. Favicon genelde ico uzantıldır. Ancak gif, jpeg veya png formatında olan dosyaları da kullanabiliriz. Favicon dosyalarının kodları <head> bölümüne yazılır ve <link> tagının rel, type ve href özelliği kullanılır. rel=”icon” ikon olduğunu belirtir. type=”image/png veya jpeg” href=”dosya ismi”
21
BİLİŞİM TEKNOLOJİLERİ
UYGULAYIN BİLİŞİM TEKNOLOJİLERİ
22
BİLİŞİM TEKNOLOJİLERİ
MODÜL : WEB TASARIM
Benzer bir sunumlar
