Frame Özellikleri 1 - 2

bitter_im

Admin
Admin
Genel Yönetici
Katılım
3 Aralık 2009
Mesajlar
64.633
Tepki
53.644
Puan
113
Yaş
32
Konum
kocaeli
Çerçeveler(Frames) üzerinde düzenleme yaparken en büyük yardımcımız Frames panelidir. Çerçeveleri ve çerçeve gruplarını seçmek için bu paneli kullanmakta fayda vardır. Gerçi sayfamız içerisinde görünür olan çerçeve sınır çizgileri ile de çerçeveleri seçebiliriz.
FrameOzellik1_1.gif

Bir önceki derste sayfamıza eklediğimiz 3 çerçeveden oluşan çerçeve setinin, örneğin GaleriSol çerçevesini (LeftFrame) seçip üzerinde bazı değişiklikler yapalım.
Öncelikle Frames panelinde GaleriSol isimli çerçeve üzerine tıklayalım. Properties penceresinde bu çerçeveye ait özellikler belirir.
FrameOzellik1_2.gif

Buradaki özellikleri teker teker açıklayalım.
Src: Çerçevenin içerisinde görüntülenecek web sayfasının adresidir. Yani çerçevenin içeriğinde gözükecek htm( ya da asp, php, jsp vs.) uzantıli sayfayı gösterir.
Hemen altında Scroll çekme menüsü vardır. Bu çekme menüdeki seçenekler çerçevemizin içerisinde kaydırma çubuklarının görünüp görünmeyeceğini belirlelemiz içindir. Bir çerçeve içerisinde açtığımız sayfa bazen çerçeve boyutundan büyük olabilir. Böyle durumlarda sayfanın tamamı görüntülenemez. İşte bu durumda kaydırma çubuklarına ihtiyacımız vardır.
No Çerçevemizde kesinlikle kaydırma çubuklarının belirmemesini istiyorsak bu seçeneği seçmeliyiz.
Yes Çerçevemizin içeriğinde bir taşma olsa da olmasa da her durumda kaydırma çubuklarının görünmesini istiyorsak seçmeliyiz.
Auto Kaydırma çubuklarının sadece çerçevenın içeriği taştığında görüntülenmesini sağlar.
Default Kaydırma çubuklarının çerçeveli sayfanın görüntülendiği tarayıcı(browser)nin ayarlarına göre görüntülenip görüntülenmemesi sağlanır.
Biz eğer Çerçeve boyutumuzu, içerisinde açılacak sayfalarla aynı boyutta tutuyorsak No seçeneğini seçmemiz daha doğru olacaktır. Eğer açılan sayfalar değişken boyutluysa Auto seçeneği seçilmelidir.
"No Resize" onay kutusu işaretli ise sayfamız bir tarayıcıda görüntülendiğinde kullanıcı çerçeve boyutlarını değiştiremez. Eğer işareti kaldırırsak sayfamız bir tarayıcıda görüntülendiğinde sayfayı görüntüleyen kisi çerçeve sınır çizgilerini kullanarak çerçevelerin boyutunu değiştirebilir.
Değiştirilebilir çerçeve boyutlarına ilişkin örneği görmek için asağıdaki bağı tıklayınız.

Borders çekme menüsü çerçevelerimize ait sınır çizgilerinin görünür olup olmamasını ayarlamak içindir.
Yes seçeneğini seçersek sınır çizgileri görünür durumda olur.
No seçeneğini seçersek gizli durumda olurlar.
Default seçeneğini seçtiğimiz de ise çerçeve sınır çizgilerinin görünüp görünmemesini, sayfanın görüntülenecegi tarayıcıya(browser) bırakmış oluruz.
Kenar çizgilerinin görünür olup olmaması konusunda dikkat etmemiz gereken önemli bir nokta var. Örneğin bizim çerçeve setimizde biz GaleriSol çerçevesi için Borders seçeneğini No olarak belirleyip GaleriAna ve GaleriUst için Borders seçeneği Yes olarak belirlersek asağıdaki görüntüyü elde ederiz.
FrameOzellik1_3.gif

Görüldüğü üzre sınırlar görülmektedir. Çünkü komşu çerçeveler sınırlara sahiptir. Eğer bütün çerçeveler için No seçeneği seçersek. Çerçeveler(Frames) görünmez. Bu sebeple eğer çerçevelerin görünür olmasını istemiyorsak komşu çerçevelerin sınır çizgilerini de hesaba katmalıyız.
Border Color bölümünde renk seçim paleti ve bir metin kutusu görürüz. Buradaki paletten bir renk seçerek ya da metin kutusuna rengin heksadesimal değerini yazarak rengimizi belirleyebiliriz.
Şimdi eğer renginizi seçip önizleme yaparsanız renginizin görünür olmadığını göreceksiniz. Peki ama belirlediğimiz renk neden gözükmüyor? Frame Özellikleri 2 dersinde anlatacağız. Simdilik bu bölümü geçiyoruz.
Bu pencerde son bölüm Margin Width ve Margin Height metin kutularıdır. Çerçevelerimizin içerisinde açacağımız sayfalarımızın çerçeve sınır çizgilerine uzaklığını buradan belirleriz. Eğer çerçevelerimiz içerisine yerleştirdiğimiz sayfaların kenarlarında boşluk kalmasını istemiyorsak her iki değeride 0 olarak belirlemeliyiz.
Margin Width: Sağ ve sol boşluk değerini;
Margin Height: Üst ve alt boşluk değerini belirlemek için kullanılır.
Çerçevelerimizi biçimlendirmeyi öğrendik. Peki ya çerçeve setine ait ayarlar. Bunun için yine Frames panelimize döneriz. Frames panelimizde GaleriUst ve GaleriAna çerçevelerinin kalın bir çizgiyle çevrelendiğini fark etmişsinizdir belki. Biz bu kalın çizgiye tıkladığımız da çizgi siyaha dönüşür.
FrameOzellik1_4.gif

FrameOzellik1_5.gif

Bu işlem sonrasında Properties penceresinde Frameset özellikleri belirir.
FrameOzellik1_6.gif

Burada dikkat edilmesi gerek bir nokta daha vardır. Biz 2 çerçeveyi seçili hale getirdik ve Frameset özelliklerini gördük. Oysa seçili durumda olmayan ve sol tarafta duran bir çerçevemiz daha var. Yani bizim seçtiğimiz çerçeve seti ana çerçeve setimiz içerisindeki bir çerçeve seti. Eğer dikkat ederseniz Frames panelinin içerisinde üç çerçevemizin etrafını çevreleyen kalın bir çizgi daha göreceksiniz. Bu kalın çizgiyi seçili hale getirdiginiz de yine siyah renk alacaktır fakat Properties panelinde ana çerçeve setine ait özellikler belirecektir.
FrameOzellik1_7.gif

FrameOzellik1_8.gif

Biz tekrar GaleriUst ve GaleriAna çerçevelerini kapsayan çerçeve setine dönelim.
Properties penceresinin en solunda Frameset yazısı altında bu çerçeve setinin kaç Satır(Row) ve kaç Sütun(Cols)'dan oluştuğu yazar.
FrameOzellik1_9.gif

Daha sonra Borders çekme menüsü vardır. Bu çekme menüde daha önce çerçevelere ait olan aynı seçenkleri içerir. Yes, No ve Default.
Hemen onun altında Border With metin kutusu vardır. Bu kutuya gireceğimiz sayısal değerler piksel cinsindendir. Yani 2 degerini verirsek 2 piksel kalınlığında çerçeve sınır çizgileri oluşturmuş oluruz.
Bu iki özelliğin sağında Border Color bölümü vardır. Yine çerçeve bölümünde olduğu gibi burada Renk Seçici düğmesine (
FrameOzellik1_10.gif
) tıklayarak bir renk seçebilir ya da metin kutusuna rengimizin heksedesimal değerini yazarak rengimizi belirleyebiliriz.
Hemen bu özelliklerin altında genişlik-yükseklik ayarları yapmamızı sağlayan bölüm vardır.
Şu an elimizde 1 sütun ve 2 satırdan olusan bir çerçeve seti olduğu için belirleyeceğimiz değer çerçevelerimizin yükseklik(dikey uzunluk) değerleridir.
Hangi çerçevenin yükseklik değerini belirledigimizi properties penceresinin en solunda yer alan RowCol Selection alanını izleyerek göresbiliriz.
FrameOzellik1_11.gif

Burada koyu gri renge bürünen çerçeve o an ölçülerini gördügümüz çerçevedir. Örneğin yukarıdaki resimde GaleriUst çerçevesi seçilmis ve ona it özellikler görülmekte.
Value metin kutusu uzunluk değerini yazmamız içindir.
Çerçevelerin uzunluk ölçülerini berlirlerken 3 farklı birim vardır. Units çekme menüsü bunun içindir.
FrameOzellik1_12.gif

Pixels seçeneğini seçtigimizde çerçeve yüksekliği Value metin kutusunda yazdığımız ölçüde olur.
Percent birimini seçersek değerimiz yüzde olarak belirlenmis olur. Örneğin bizim 2 çerçevemiz var. Birisi için %40, digeri için %60 seçerek sayfanın görüntülendiği tarayicının boyutlarıyla göreceli olarak bir değişim sağlayabiliriz.
Bu konuyla ilgili örnekleri görmek için asağıdaki bağlara tıklayınız.

Son olarak bir de Relavite birimi vardir. Relavite seçeneğini seçtiğimiz de boyutunu belirlediğimiz çerçevenin diğer çerçevelerden kalan boşluğu doldurmasını sağlarız. Örneğin biz GaleriUst çerçevesi için 400 piksel değerini belirleyip GaleriAna çerçevesi için Relative değerini seçersek sayfamız hangi boyuttaki tarıyıcıda açılırsa açılsın GaleriUst çerçevesi 400 piksel yüksekliğinde olacak ve GaleriAna onun bittiği yerden başlayacaktır. Hatta eger sayfanın görüntülendiği tarayıcı penceresi 400 piksellik yüksekliği görüntülüyorsa GaleriAna isimli çerçevenin içeriği görüntülenmeyecektir.

Su ana kadar çerçeveler ile ilgi pek çok sey anlattık. Fakat hala anlatacaklarımız var. Çerçeve sınır çizgi renklerinin belirlenmesi, çerçeve boyutlarının düzenlenmesi ile ilgili bilgileri Frame Özellikleri 2 dersinde bulabilirsiniz.
 
OP
bitter_im

bitter_im

Admin
Admin
Genel Yönetici
Katılım
3 Aralık 2009
Mesajlar
64.633
Tepki
53.644
Puan
113
Yaş
32
Konum
kocaeli
Bir önceki dersimizde çerçeve boyutları nasıl değiştireceğimiz anlatmıştık. Şimdi bu konuya bir kaç ekleme daha yapalım :)
Daha önce iki çerçeveden oluşan çerçeve setinde alt alta olan iki çerçeveye ait yükseklik değerini düzenlemiştik. Şimdi Frames panelinden üç çerçeveninde çevresini saran kalın çizgiyi seçili hale getirerek(siyah renge dönüşmesini sağlayarak) soldaki çerçevemizin(GaleriSol) genişliğini belirleyelim.
FrameOzellik2_1.gif

Ana çerçeve setimizi seçili hale getirdiğimiz de Properties panelimizde aşağıdaki özellikler görünür hale gelecektir.
FrameOzellik2_2.gif

Frameset'imiz 1 satır ve 2 sütundan oluşmaktadır. Soldaki sütun GaleriSol çerçevesince doldurulmaktadır. Sağdaki sütünda ise GaleriUst ve GaleriAna çerçeveleri vardır.
Biz öncelikle Properties panelinde RowCol Selection bölümünden soldaki sütunu seçili hale getiriyoruz. Böylece GaleriSol isimli çerçeveye ait özellikleri görüyoruz.
FrameOzellik2_3.gif

Burada çerçevemizin genişliğini 200 piksel olarak belirliyorum. Daha sonra yine RowCol Selection kısımından sağdaki sütunu seçerek genişlik değerini Relative olarak seçiyorum.
Böylece soldan 200 piksellik bir yer GaleriSol çerçevesinin olacak kalan genişlik sağdaki sütunda yer alan GaleriUst ve GaleriAna çerçevelerine kalacak.
"Peki biz boyutlandırma için sadece bu metin kutularını mı kullanacağız?" sorusuna karşılık cevabımız hayır olacak :)

Sayfamıza çerçevelerimizi yerleştirdiğimizde herhangi bir renk belirlemesek de çerçeve sınır çizgileri kendilerini belli edecektir.
FrameOzellik2_4.gif

İşte biz bu çizgileri faremizle sürükleyerk de piksel ya da yüzde birimli boyutlandırmalar yapabiliriz.
Örneğin ben soldaki ve sağdaki sütünları birbirinden ayıran çizgiyi farem ile tutup sürüklediğimde Properties panelinde Value metin kutusunda soldaki çerçevenin genişlik ölçüsündeki değişmeler izlenebilir.
FrameOzellik2_5.gif

Aynı şekilde GaleriUst ve GaleriAna çerçevelerini birbirinden ayıran sınır çizgisini faremin sol tuşuna basılı tutarak seçip aşağı-yukarı doğru hareke ettirdiğim de Properties penceresinde GaleriUst isimli çerçeveye ait Value metin kutusunda genişlik ölçüsündeki değişmeler izlenebilir.
FrameOzellik2_6.gif

Bütün bu boyutlandırma işlemleri sonucunda çerçeve renklerinin düzenlenmesi konusuna geçebiliriz.
Bütün bu boyut belirleme işlemleri sırasında hep bir ana çerçeve seti ve sonrasında başka bir çerçeve setinden daha bahsettik (GaleriUst ve GaleriAna çerçevesini içerisine alan). Bu durumun oluşmasını sağlayan bizim oluşturğumuz çerçevelerin sırasıyla oluşturulması sonucu meydana gelen şeyler.
Biz Insert araç çubuğundaki Frames sekmesinde yer alan Left And Nested Top Frames düğmesine (
FrameOzellik2_7.gif
) tıkladığımızda DreamWeaver MX önce yan yana 2 çerçeveden oluşan bir çerçeve seti oluşturdu. Ardından sağdaki çerçeveyi yatay olarak ikiye böldü ve biz 3 çerçeveden oluşan bir Frameset elde ettik. İşte bu oluşum sırası dolayısıyla aslında biz iç içe 2 çerçeve seti elde etmiş olduk. :)
FrameOzellik2_1.gif

Şimdi buradan yola çıkarak eğer çerçevelerimizi ilk oluşturulandan son oluşturulana doğru sıralarsak.
1. GaleriSol çerçevesi. Ana çerçeve setimizin sol sütunu yani!
2. GaleriUst çerçevesi. Soldaki sütunun ilk çerçevesi
3. GaleriAna çerçevesi. Soldaki sütunun ikinci çerçevesi şeklindedir.
aynı şekilde her çerçeveyi iskambil kartı olarak düşünür ve sadece kenarların kesiştiğini düşünelim. En üstte de 1. oluşan çerçevenin, altında 2. oluşan çerçevenin ve en altta 3. oluşan çerçeveyi temsil eden kartın olduğunu düşünelim.
FrameOzellik2_8.gif

Bu durumda örneğin 1. kartın(çerçevenin) kenar rengi yeşil olursa 2. çerçevenin ve 3. çerçevenin kenar renkleri ne olursa olsun biz 1. kartın kenar rengini göreceğizdir çünkü o üsttedir. Bu sebeple 2. ve 3. çerçevenin sol kenarları daima 1. çerçeve renginde olacaktır.
Sonuçta çerçeve kenar çizgilerinin rengini belirlerken çerçevelerin oluşturulma sıralarına dikkat etmeliyiz.
 

Şu anda bu konu'yu okuyan kullanıcılar

    Üst