çerçeveler ekranın dikdörtgen alanlarıdır ve her biri kendi HTML belgesini içerir. Çerçeveler aşağıdaki belgeler için harikadır:

İçindekiler. Bir Web sayfasındaki dikey bir sütuna bir içindekiler tablosu koyarsanız, kullanıcı, sürekli olarak bir önceki sayfaya dön düğmesini tıklamak zorunda kalmadan, herhangi bir zamanda buna erişebilir. İçindekiler çerçeve içindeyken her zaman el altında olacağından, kullanıcının içindeki başka bir öğeyi seçmesi ve ihtiyaç duyduğu bilgileri hemen alması yeterli olacaktır.

Sabit arabirim öğeleri. Sayfanın geri kalanı başka bir çerçevede kayarken, şirket logosu gibi ekrandaki grafik bir görüntüyü dondurabilirsiniz.

Formlar ve sonuçlar. Bir çerçevede form oluşturabilir ve sorgu sonuçlarını başka bir çerçevede görüntüleyebilirsiniz.

Çerçeveler artık eski kabul ediliyor ve HTML5'te desteklenmiyor. Projelerinizde normal çerçeveler kullanmayın! HTML5 etiketleri çerçeve, çerçeve kümesi ve çerçevesiz artık yok, bunun yerine tek bir iframe etiketi var (satır içi veya kayan çerçeve).

Etiket

Etiket - etiketi değiştirir ve ekranı bölmek için kullanılır. Kapanış etiketi vardır.

Öznitellikler

COLS. Ekranı dikey olarak böler. Piksel, yüzde veya basitçe * cinsinden değerleri kabul eder. * değeri, belirli bir sütunun ekranın geri kalanını kaplayacağını belirtir.

SATIRLAR. Ekranı yatay olarak böler. Piksel, yüzde veya basitçe * cinsinden değerleri kabul eder. * değeri, belirli bir satırın ekranın geri kalanını kaplayacağını belirtir.

ÇERÇEVE SINIR. Kenarlıkların varlığını belirtir, örn. çerçeve sınırları. "evet" veya "hayır" değerlerini kabul eder.

SINIR. Kenarlığın genişliğini piksel cinsinden belirtir.

SINIR RENGİ. Kenarlıkların rengini belirtir. Varsayılan olarak (standart Windows sistem renk şemasını kullanıyorsanız), çerçeve kenarlıkları donuk, gri bir tondur. Ama isterseniz başka bir renk seçebilirsiniz. Bir rengi tanımlarken, hem adını hem de RGB sistemindeki sayısal karşılığını seçebilirsiniz. Örneğin, MAVİ veya #0000FF.

Ayrı bir etikette özniteliklerden yalnızca birini kullanmak mantıklıdır - COLS veya SATIRLAR. Bu, çerçeve yapısının yalnızca sütunlardan veya yalnızca satırlardan oluşacağı anlamına gelir. Sütunların içinde satırlar veya satırların içinde sütunlar oluşturmak için iç içe kaplara ihtiyacınız vardır. ….

Örnek

Sonuç:

Çerçeve numaralandırma sırasındaki farka da dikkat edin.

Etiket

Etiket bir konteynere yerleştirildi …, belirli bir çerçevede tam olarak neyin görüntülenmesi gerektiğini belirler. Kapanış etiketi yoktur.

Öznitellikler

SRC. Belirli bir çerçeveyle ilişkili URL'yi belirtir.

KENAR GENİŞLİĞİ. Çerçeve içeriği ile sağ ve sol kenarlıkları arasındaki mesafeyi belirtir.

KENAR YÜKSEKLİĞİ. Çerçeve içeriği ile üst ve alt kenarlıkları arasındaki mesafeyi belirtir.

KAYDIRMA. Bir çerçeve penceresinin kaydırma çubuğu olup olmadığını belirtir. "evet", "hayır" ve "otomatik" (varsayılan) değerlerini alabilir.

NORESİZE. Çerçevenin kenarlıklarını "kablolu" olarak tanımlar ve kullanıcının çerçeve penceresini yeniden boyutlandırmasını engeller. Ayrıca, sabit olanla ortak bir sınırı olan tüm çerçevelerin boyutları sabittir.

ÇERÇEVE SINIR, SINIR, SINIR RENGİ. Bu nitelikler çerçevelerle ilişkilendirilir ve etikettekilere benzer. .

İSİM. Çerçeve penceresinin adını belirtir. Çerçevenin görünümünü etkilemeyen tek özellik. Çerçeve yükleme sürecini kontrol etmenizi sağlar. Bir çerçeve penceresinin benzersiz bir adı varsa, diğer çerçevelerden doğrudan erişilebilir. Çerçeve pencerelerini adlandırırken, bir sınırlama akılda tutulmalıdır: ad alt çizgi "_" ile başlamamalıdır, aksi takdirde dikkate alınmaz. Çünkü bazı hizmet adları bu karakterle başlar.

Örnek

etiket kullanımı A bir çerçeveye yüklemek için

Öznitellikler

HREF. Belirtilen çerçeve penceresine yüklemek istediğiniz yeni belgenin URL'sini veya adını belirtir.

HEDEF. Yeni belgenin yükleneceği çerçevenin adını belirtir. Bu isim, etiket üzerindeki NAME özelliği tarafından çerçeveye verilmelidir. .

Aşağıdaki örnek, ekranı iki dikey bölgeye ayırır. Daha küçük sol taraf içindekiler tablosunu içerirken sağ taraf diğer tüm HTML belgelerini yükleyecektir. İçindekiler dosyası, ilgili bölümlere basit metin köprüleri içerir. Her şeyin çalışması için cosm.htm, eat.htm, perf.htm, massage.htm ve manic.htm dosyalarında HTML belgeleri oluşturmanız gerekir.

Örnek

İçindekiler

• Ürün:% s
  • Makyaj malzemeleri
  • Besin takviyeleri
  • Parfümeri
• Hizmetler
  • Masaj
  • Manikür

Merhaba!

Etiket

Etiket hepsi aynı çerçeve penceresine işaret ediyorsa, sizi her bir köprüde TARGET özniteliğini tekrar etme zahmetinden kurtaracaktır. Bunu yapmak için etiketi koyun kapsayıcıya TARGET özniteliği ile ….

etiket kullanımı önceki örneğin içindekiler tablosu left.htm dosyasının boyutunu küçültmeyi mümkün kılacaktır.

Örnek

İçindekiler

• Ürün:% s
  • Makyaj malzemeleri
  • Besin takviyeleri
  • Parfümeri
• Hizmetler
  • Masaj
  • Manikür

Bağlanmak HEDEF her belirli bağlantı, aynı ada sahip etiket özniteliğinin yerini alır .

Örnek

İçindekiler

• Ürün:% s
  • Makyaj malzemeleri
  • Besin takviyeleri
  • Parfümeri
• Hizmetler
  • Masaj
  • Manikür

İşte mallar!

Hizmetler burada!

TARGET özniteliği ile elde edilen özel efektler

Daha önce de belirtildiği gibi, çerçeve adları, tarayıcıya özel bilgiler ileten hizmet adlarını başlattığı için alt çizgi ile başlayamaz. Aşağıdakiler, her biri belirli bir etkiyi elde etmek için kullanılan özel adlardır.

HEDEF=”_blank”. Belge yeni bir tarayıcı penceresine yüklenir.

HEDEF=”_kendisi”. Belge geçerli pencereye yüklenir.

HEDEF=”_ebeveyn”. Belge üst çerçeveye yüklenir. Bu genellikle bir kap içindeki bir çerçevedir. … mevcut olandan önce. Ana çerçeve yoksa, "_parent" değeri "_self" ile aynı olur.

HEDEF=”_üst”. Belge en üstteki çerçeveye yüklenir.

Temel olarak, bu hizmet adlarının şu veya bu şekilde mevcut çerçeve yapısından "kırılması" amaçlanır. Belgeleri farklı pencerelere nasıl yükleyebileceğinizi görmek için onlarla deney yapın.

Etiket gereklidir!

Öznitellikler

ALING. Hizalama türünü belirtir. "Sol", "orta", "sağ" değerlerini alır.

YÜKSEKLİK. Çerçevenin yüksekliğini piksel cinsinden belirtir

GENİŞLİK. Çerçevenin genişliğini piksel cinsinden belirtir.

SRC, KENAR GENİŞLİĞİ, KENAR YÜKSEKLİĞİ, KAYDIRMA, ÇERÇEVE KENAR, KENAR, KENAR RENGİ, İSİM. Daha önce tartışılanlara benzer.

vspasa. iframe'in dış kısmındaki üst ve alt kenar boşluklarını ayarlar

hspace. Yan kenar boşluklarını iframe'in dışına ayarlar

marj genişliği. iframe içindeki sol ve sağ kenarlardaki girinti miktarını belirler; 1'e eşit veya 1'den büyük olmalıdır.

marj yüksekliği. iframe içindeki üst ve alt kenarlar boyunca dolgu miktarını tanımlar; 1'e eşit veya 1'den büyük olmalıdır.

kaydırma. iframe'de bir kaydırma çubuğunun görüntülenip görüntülenmeyeceğini belirtir; değer "evet", "hayır" veya "otomatik" olabilir. Normal belgeler için varsayılan değer auto'dur.

Başlık. Araç ipucu metni.

Etiket </h3> <p>Çerçeveleri desteklemiyorsa, tarayıcı penceresinde neyin gösterileceğini belirtir.</p><p> <NOFRAMES>Tarayıcınız iframe'leri desteklemiyor!

Ek dosyalar olmadan bir çerçeve nasıl yüklenir?

Bir çerçeveyi harici dosyalar kullanmadan yüklemek için, çerçevenin HTML kodunu bir değişkene ve ardından bir SRC etiketi olarak koymanız gerekir.

Sitenin çerçeve yapısı ile adres çubuğunun sorunu

Bir site, çerçeveleri kullanırken, çerçevelerin konumunu belirten tek bir sayfa kullanır.

İşte böyle bir sayfanın bir örneği:

Bu sayfa yüklendikten sonra bilgiler çerçevelere yüklenir. Bu çerçeveler içerisinde, sitenin sayfaları arasındaki tüm kullanıcı geçişleri gerçekleşir. Adres çubuğu her zaman yalnızca geçişler sırasında değişmeyen ana sayfanın yolunu görüntüler. Ziyaretçi şu anda nerede olduğunu bilmiyor.

Ziyaretçi sitenin ana sayfasına hemen gelmezse (örneğin, bir arama motorundan), bu, genel çerçeve yapısının yeniden inşasına yol açmaz. Site sahibi sitenin iç sayfasına adres verememesinin nedeni budur.

Bu sorunun birkaç çözümü var

Daha önce top, bir çerçeve yapısının bir örneği olarak görülüyordu. Üzerinde bu sorunu çözmenin çeşitli yollarını ele alacağız.

Buradaki fikir şu: bilgi içeren bir sayfa yüklenirken, sayfa ortamını kontrol edeceğiz ve gerekli çerçeve yapısı eksikse, onu bir komut dosyası kullanarak oluşturacağız.

Üç durum mümkündür:

1. ziyaretçi bir çerçeve yapısı içeren bir sayfaya geldi;
2. ziyaretçi bilgi sayfalarından birine gitti;
3. ziyaretçi navigasyon menüsü olan bir sayfaya geldi.

İlk durumda, kontrol yapıldıktan sonra herhangi bir işlem yapılmasına gerek yoktur. İkinci ve üçüncü neredeyse aynıdır, bu yüzden sadece ikinci durumu ele alacağız.

Ve böylece ziyaretçi "olmaması gereken yere" ulaşır. Sayfanın en başına bir çerçeve yapısı oluşturacak bir komut dosyası ekliyoruz.

Çözümün uygulanması hem istemci tarafında hem de sunucu tarafında mümkündür. İstemci tarafındaki uygulamanın ana dezavantajı açıktır - istemcinin yeteneklerine ve ayarlarına bağımlılık. Örneğin, kullanıcının bilgisayarında komut dosyalarının çalıştırılması yasaktır. Sunucuda destek yoksa ikinci seçenek çalışmayacaktır. PHP.

JavaScript çözümü.

Bu yaklaşımla ilgili bir sınırlama vardır - tüm tarayıcılar desteklemez JavaScript ve bazı durumlarda kullanıcılar komut dosyalarını kendileri devre dışı bırakır.

Öncelikle sayfa ortamını kontrol ediyoruz ve ardından gerekli çerçeve yapısının olmaması durumunda onu oluşturuyoruz.

Bir dosya oluşturalım çerçeve.js :

Eğer (window.name != "main") ( window.name="root"; document.write(" "); belge.yaz(" "); belge.yaz(" "); belge.yaz(""); }

Öncelikle sayfanın yüklendiği pencerenin adını kontrol ediyoruz: if (window.name != "ana"). Pencerenin adı ile çerçevenin adı uyuşmuyorsa, bir çerçeve yapısı oluşturmanız gerekir. Bu, yöntem kullanılarak dinamik olarak yapılır. yazmak nesne belge.

Sitenin her sayfasına bir dosya ekliyoruz çerçeve.js . Artık site sayfaları aşağıdaki yapıya sahip olacaktır:

... ...

Bu sorunu çözmeye yönelik bu yaklaşımla, çerçeve yapısı içeren bir dosyaya olan ihtiyaç ortadan kalkar.

PHP Çözümü

Bu yaklaşımla, site daha fazla sayıda ziyaretçi tarafından erişilebilir hale gelecektir.

Sayfa ortamını farklı bir şekilde kontrol edeceğiz (kullanırken olduğu gibi değil) JavaScript). Belgeyi parametre ile çerçeveye yükleyeceğiz çerçeveler=evet. Sayfayı açarken bu parametreyi kontrol ediyoruz ve gerekirse dinamik olarak bir çerçeve yapısı oluşturuyoruz. Bunu yapan kod aşağıdadır.

Kodu bir dosyaya koymak çerçeveler.php . Şimdi onu sitenin her sayfasına bağlamanız gerekiyor. Aşağıda böyle bir sayfa örneği verilmiştir.

require("çerçeveler.php"); ?> ...

Bu durumda, istemci tarafı uygulamasında olduğu gibi, ayrı ayrı oluşturmaya gerek yoktur. HTMLçerçeve yapısını açıklayan bir belge.

Merhaba, blog sitesinin sevgili okuyucuları. Bugün Html dilindeki çerçevelerden bahsedeceğiz. En baştan, yani ne tür bir hayvan olduğu ile başlayacağımız açık. .

Makalenin sonunda, Html kodunda (zaten nadiren kullanılan) satır içi çerçeveler oluşturma sürecinin ve klasik yapılarının ayrıntılı bir açıklamasından sonra, bunlar üzerinde bir site oluşturmanın önemine değineceğiz ve ayrıca olası yolları tartışacağız. blogum örneğini kullanarak bunları şimdiki zaman diliminde kullanın.

Nedir ve Iframe'in Frame'den farkı nedir?

Bu ne? Yalnızca web sitelerinde değil, aynı zamanda programlara yönelik herhangi bir uygulamada da kullanılabildikleri, ancak bir web sayfasının veya uygulamanın penceresinin, her biri ayrı bir belge ile yüklenen birkaç alana bölünmesiyle farklılık gösterdiği ortaya çıktı. Üstelik bu çerçeve alanları birbirinden bağımsız hareket etmektedir.

Neredeyse hepinizin karşılaştığı kullanımlarının muhtemelen en bariz örneği, bilgisayarınızda yüklü olan birçok programın sahip olduğu sözde yardım dosyalarıdır (yardımcı olur).

Yardım menüsünü içeren dosya sol pencereye yüklenir ve sağ pencerede seçilen menü öğesine karşılık gelen belge görüntülenir. Böyle bir yapının, sağ pencerede yeni bir belge açarken menü ile dosyanın sol pencereye yeniden yüklenmesine izin vermemesi dikkat çekicidir. tam olarak bu çerçeve kullanmanın ana avantajı html'de.

Aslında, bu öğelerin adı tam olarak bağımsız bir pencere olarak yorumlanmalıdır. Çerçevelerin yardımıyla, büyük bir pencereyi birkaç parçaya ayırma olanağına sahibiz, bu da birbirinden bağımsız ayrı belgeler (sayfalar, metinler, resimler, videolar vb.) için alıcı görevi görebilir.

Köprü metni biçimlendirme dilinde bir çerçeve yapısı nasıl oluşturulur? Şu anda ana standart olan Html 4.01 standardından (sınıflandırmaya göre) bahsedersek, bunun için üç öğe kullanılır - Çerçeve, Çerçeve Kümesi ve Çerçeve Yok.

Iframe - Html 5 standardında gömülü bir çerçeve

Html 5 standardından (bazı öğeleri zaten birçok tarayıcı tarafından desteklenen geleceğimiz) hakkında konuşursak, o zaman Frame, Frameset ve Noframes etiketleri olmayacak ve bunların yerine klasik çerçeve yapısı olacak başlangıçta bahsedeceğimiz tek bir Iframe etiketi (gömülü çerçeve) ve ardından tüm dikkatimizi şu anda kullanılan 4.01 sürümünden klasik şemaya çevireceğiz.

Aşağıda tartışılan klasikten farklı olarak Iframe, Body etiketinin Frameset etiketleriyle değiştirilmesini gerektirmez. Şunlar. bu etiket normal sayfalara, örneğin bir paragrafın içine veya başka herhangi bir yere yerleştirilebilir. Özünde, bu öğe, daha önce ele aldığımız Img etiketine çok benzer.

Tam olarak bir satır içi öğe gibi davrandığından, değiştirilebilir içeriğe sahip satır içidir, ancak içinde yabancı harici içerik. Html dilinde bu türden yalnızca dört öğe vardır - Img, Iframe, Object ve Embed. Bu nedenle kahramanımız, boyutu bu etiketin nitelikleri kullanılarak ayarlanan alana yüklenecek harici bir dosyanın varlığını ima eder.

O. iframe, içine harici bir nesnenin (video gibi) yüklendiği bir dize öğesidir. Ve sayfaya yüklenmesi gereken bu dosyanın yolunu belirtmek için özel Src niteliği kullanılır. Ancak Img'den farklı olarak, Iframe öğesi eşleştirilmiştir, yani. ayrıca bir kapanış etiketi var:

Bu örnek, bir Youtube videosunun Iframe kullanan bir sayfada görüntülenmesini göstermektedir. Harici dosyanın yükleneceği çerçevenin (pencerenin) alanını sınırlamak için nitelikler sağlanır. Genişlik ve yükseklik değerleri piksel cinsinden belirtilen:

Şunlar. bu etiket, bazı harici nesnelerin yüklendiği bir alan oluşturur (sitenizden veya başka bir kaynaktan olması fark etmez). Alanın genişliği ve yüksekliği Genişlik ve Yükseklik kullanılarak ayarlanır ve bu nesneye giden yol Src özniteliğinde belirtilir.

Iframe öğesi, tüm bu öznitelikleri değiştirilmiş içeriğe sahip benzer satır içi etiketlerden devralmıştır (yukarıda bahsedilen Img gibi). O da resimlerden nitelikler aldı. hspace ve vspace, çerçevenin kenarlıklarından etrafını saran metne kadar olan girintileri ayarlamanıza olanak tanır.

Yerleşik çerçevenin hizalamasının, Html-'de resimleri incelerken görebildiğimiz gibi tam olarak aynı şekilde yapılması da önemlidir. Hala aynı Hizala, ancak Alt, Üst, Orta, Sol ve Sağ olası değerlere sahip Iframe etiketi için.

Ancak bu öğe, aşağıda çok ama çok ayrıntılı olarak bahsedeceğimiz klasik çerçeve yapısındaki Frame etiketinden de birkaç özellik aldı. Bu nitelikler, değeri bir değer olarak kullanılabilen Ad'ı içerir, böylece bağlantıya tıkladığınızda ihtiyacınız olan belge bu çerçevenin penceresinde açılır (daha fazlasını aşağıda okuyun).

Ayrıca Iframe'de, Frameborder niteliği, yalnızca iki değeri olan Frame etiketinden taşınmıştır - ya 0 (çerçevenin etrafındaki çerçeve görüntülenmez) ya da 1 (çerçeve görünür). Varsayılan değer Frameborder=1'dir, bu yüzden onu kaldırmak için Frameborder="0" yazmanız gerekir:

Kaydırma özelliği de Çerçeve'den bu öğeye taşınmıştır; varsayılan değer Otomatik'tir - çerçevedeki kaydırma çubukları, içerik onu görüntülemesi amaçlanan pencereden daha büyük olduğunda gerektiği gibi görünür.

Marginwidth ve Marginheight nitelikleri de Frame öğesinden geldi. Aşağıda metinde ayrıntılı olarak ele alınacaklar, ancak kısaca - çerçevenin kenarlarından içine yerleştirilen içeriğe genişlik ve yükseklik girintisi ayarlamanıza izin veriyorlar.

Daha önce de belirttiğim gibi, Iframe kullanmanın net bir örneği:

Iframe'i doğrudan web sayfasına ekleyerek, videonun çıktısını YouTube'dan alırsınız. Bu öğenin, şimdi tartışılacak olan değiştirilebilir içeriğe sahip satır içi öğelerin ve aslında klasik çerçevelerin bir karışımı olduğu sonucuna vardık.

Çerçeve ve Çerçeve Kümesi etiketlerine dayalı çerçeveler - yapıları

Bu nedenle, klasik bir çerçeve yapısı oluşturmak, normalde öğe tabanlı kapsayıcısının yerini alan herhangi bir belgede bulunması gereken açılış ve kapanış Body etiketi yerine Html kodunda yazdıklarınızla başlar. çerçeve kümesi.

Temel nokta, Body öğesinin bu durumda kullanılamayacağıdır - Body (normal bir belge için) veya Frameset (bir belge çerçeve yapısı oluştururken):

Ana çerçeve içerisinde oluşturduğumuz her çerçeve ayrı bir eleman kullanılarak oluşturulur. çerçeve. Bu etiket tektir ve içinde bu pencereye yüklenmesi gereken belgenin yolunu belirleriz.

Henüz değinmediğimiz üçüncü unsur ise çerçevesiz. Eşleştirilmiştir ve yalnızca aynı tarayıcı (veya başka bir görüntüleme cihazı) çerçeveleri desteklemiyorsa, tarayıcı tarafından işlenecek ve web sayfasında görüntülenecek olan kendi içinizde bir miktar metin yazmanıza izin verir. Bu, örneğin mobil cihazlar için bir tarayıcı kullanırken olabilir.

Genellikle Noframe'ler, çerçeve yapısını işlemenin imkansızlığı ile sadece mevcut durum hakkında bilgi eklemekle kalmaz, aynı zamanda bunları kullanmadan çalışmaya devam edebileceğiniz diğer sayfalara gitme yeteneği de ekler. Onun hakkında başka bir şey söylemek zor, o yüzden devam edelim.

Body etiketi yerine kullanılan Frameset elemanının viewport için ayrılan tüm alanı kapladığı ve bu bölge içerisinde ayrı Frame elemanları kullanılarak çerçeveler oluşturulacağı ortaya çıkıyor. Bu bağlamda, görüntüleme alanının ayrı pencereler arasında nasıl bölüneceği veya başka bir deyişle, her birinin boyutunun nasıl ayarlanacağı sorusu ortaya çıkar.

Bu, Frameset öğesine uygun öznitelikler eklenerek yapılır. İki tane var - Sütunlar ve Satırlar. Cols, büyük bir pencerenin dikey çerçevelere veya sütunlara bölünmesini ayarlar ve Rows, onu yatay pencerelere veya satırlara bölmenize olanak tanır.

Çerçeve Kümesi ve Sütunlar ve Satırlar özniteliklerine dayalı bir yapı oluşturma

Html Frameset etiketinin Cols ve Rows değerleri virgülle ayrılmış (boşluksuz) sayılardır. Bu sayılar, sonuç olarak elde etmek istediğimiz pencerelerin oranlarını belirler. Bu nedenle sütunlarda veya satırlarda virgülle ayrılmış kaç sayı yazılacaksa, o kadar çok çerçevemiz var ve sonuç olmalı.

Örneğin, böyle bir gösterim kullanarak, genişlik olarak 2:5:3 oranlarına karşılık gelecek üç dikey sütun elde edeceğiz.

Oranları üç çerçeve için belirlediğimiz için, ek nitelikler belirtmeden bile açılış ve kapanış Frameset etiketi arasına üç Frame öğesi yazmamız gerekecek:

Sonuç olarak, üç boş pencereden oluşan çerçeve yapımız şöyle görünecektir:

Bu örnekte, pencerelerin boyutlarını (Çerçeve), görünümün genişliğinden (Sütunları kullanırken durum budur) veya yüksekliğinden (Satırlar) alınan yüzdeleri kullanarak ayarladık. Görünümü değiştirdiğinizde çerçeve boyutları arasındaki yüzde oranı korunur. Ancak yüzdeler yerine, sadece anlam ifade edecek sayıları da kullanabilirsiniz. Burada da anlamada herhangi bir zorluk çıkmaması gerektiğini düşünüyorum.

Ancak boyut tanımlamalarında oldukça sıra dışı bir seçenek de var. yıldız işareti "*". Ayrıca, yalnızca “*” veya önünde bir sayı olan bir yıldız işareti, örneğin “3*” olabilir. Yüzdelere çok benzeyen aldatıcı bir şey, bu da Çerçeve için alanı orantılı olarak böldüğümüz anlamına gelir.

Bir örneğe bakalım. Şimdi Rows'u kullanarak görünümü yatay satırlara bölmeyi seçelim:

Bu giriş ne anlama geliyor? Dikey olarak kullanabileceğimiz tüm görüntü alanı üç satıra bölünecektir. İlk satırın yüksekliği 200 piksel, ikincisi - 500 piksel olarak alınacak, ancak üçüncü satırın yüksekliği kalan tüm alanı kaplayacak, çünkü Boyut olarak "*" kullanılmıştır.

Dikkat çekici bir şekilde, "*" ve "1*" değeri aynı anlama gelir - kalan tüm alanı bire böleriz ve bu parçayı bu çerçeveye veririz (yani, kalan tüm boşluk).

Ancak "*" değerini bir sayıyla orantılı olarak bölmek için kullanırsanız ne olduğuna bakın:

Sizce bu durumda Çerçevenin boyutları ne olmalıdır? İkinci satırın kesinlikle 100 piksel yüksekliğe sahip olacağı açık. Ancak kalan yükseklik alanı üçüncü ve birinci satır arasında nasıl bölünecek?

Sayması oldukça basit - sadece ikiye (2 *) dört (4*) ekleyin ve bu paydaya bölün (okul müfredatındaki kesirleri unutmayın) iki ve dörde bölün. Şunlar. çerçeveli ilk sütunun kalan alanın üçte birini ve üçüncü sütunun üçte ikisini alacağını anlıyoruz. Veya başka bir deyişle, üçüncüsü birincinin iki katı olacaktır:

Çerçeve pencerelerini tek bir öznitelikte boyutlandırmanın üç yolunu da kullanabilirsiniz, örneğin:

Sonuç olarak, ilk Çerçeve sütununu mevcut alanın yüzde 10'u, ikinci 100 piksel genişliğini elde edeceğiz ve kalan üçü, kalan alanın genişliğinin dört, üç ve dokuzda ikisi oranında genişliğe sahip olacak. İşte bu, her şey basit ve net.

Ana pencereyi yalnızca yatay ve dikey çerçevelere değil, örneğin bunların kombinasyonlarına bölmek istiyorsanız, Çerçevekümesi öğelerinin iç içe yapısını sütunlar için ayrı ve satırlar için ayrı ayrı kullanabilirsiniz. Örneğin aşağıdaki ekran görüntüsünde gösterilen yapıyı elde etmek için bu yapıyı kullanmak yeterlidir:

Şunlar. önce "frameset cols="20%,80%"" kullanarak mevcut tüm alanı dikey olarak iki sütuna ayırdık ve sağ sütunun içeriğini "frame" etiketiyle ayarladık, ancak sol için bir "frame" öğesi eklemek yerine sütununda yeni bir "frameset rows="10%,*"" açıyoruz.

Ve bunun yardımıyla, sağ sütunu, içeriği iki "çerçeve" etiketi kullanılarak ayarlanan çerçeveli iki satıra böldük ve ardından her iki "çerçeve kümesi" kapsayıcısını kapatıyoruz. Her şey basit ve mantıklı.

Yolu Frame öğesinin Src özniteliğinde belirtin

Ama hepimiz Çerçeve Kümesi öğesinden ve onun Sütunlar ve Satırlar özniteliklerinden bahsettik, bunların yardımıyla yapıyı oluşturuyor ve boyutlarını ayarlıyoruz. Şimdi doğru belgeleri doğru çerçevelerde nasıl görüntüleyeceğimizi ve pencereleri arasında etkileşimi nasıl kuracağımızı bulalım.

Peki, oluşturduğumuz pencerelerin görünümünü nasıl kontrol ederiz? Tüm bunlar, Çerçeve etiketinin niteliklerine yerleştirilmiştir. Bahsetmeye değer ilk kaynak. Html koduna resim eklemeyi düşündüğümüzde Img etiketinde zaten tanışmıştık. Özü değişmedi ve yine de çerçeveye yüklenmesi gereken belgenin yolunu belirtmenize izin veriyor.

Src'deki belgenin yolu olarak belirtilebilir. Göreceli yollar genellikle kendi kaynağınızda bulunan bir belge için kullanılır, ancak başka bir siteden bir çerçeve penceresine belge yüklemek istediğinizde mutlak yollara ihtiyacınız olacaktır.

İstenen belgenin yolu ile birlikte Src niteliği belirtilmemişse, pencereye boş bir belge yüklenecektir. Şahsen, bir zamanlar blogum için benzer bir şey yaptım (ek bir gezinme öğesi olarak) ve aynı zamanda barındırma sunucusunda onun için ayrı bir klasör oluşturdum ve oraya yalnızca çerçeve yapısına sahip bir Html dosyası yerleştirmedim (buna dizin adını verdim) .html), aynı zamanda tümü çeşitli belge pencerelerine ve arka plan olarak kullanılan görüntü dosyalarına yüklenebilir.

Bu nedenle, Frame etiketinin Src özelliğinde göreli bağlantıları kullanmak benim için en kolayıydı:

Dikkat çekici bir şekilde, bu koddaki tüm bağlantıları göreliden mutlaka değiştirirseniz (https://site/navigator/joomla.html gibi) ve bu dosyayı bir tarayıcıda açarsanız, Çerçevede belirtilen belgeler benim adresimden yüklenecektir. sunucu ve tarayıcınızda benzer bir resim göreceksiniz. Ve çerçeve yapısına (index.html) sahip dosyanızın bilgisayarınızda veya barındırmada nerede bulunacağı önemli değildir.

Şekilde gösterilen örnekte, sol çerçeve penceresine normal bir menü olan bir sayfa yüklenmiştir. Ancak menünün nasıl oluştuğu önemli değil, herhangi bir bağlantıya tıkladıktan sonra ne olduğu önemlidir.

Bunu yaparsanız, her şey olması gerektiği gibi olacak - belge sağ alt pencerede açılacaktır. Ancak bunun için küçük bir numara uygulamam gerekiyordu, çünkü varsayılan sürümde belge pencerenin tüm boyutuna açıldı ve solda ve üstte gezinme menüsü olduğu için hiç ihtiyacım olmayan çerçeve yapısını değiştirdi. çerçeveler kayboldu.

Çerçevedeki bir bağlantıdan belgeler nasıl açılır

Bu nedenle, köprülerden bahsettiğimizde, “A” etiketinin böyle bir özelliğinden Target=_blank olarak bahsetmiştik. Ne için olduğunu hatırlıyor musun? Bağlantılı belgeyi yeni bir pencerede açmak için düzeltin. Varsayılan olarak, target="_self" ile eşdeğer olan aynı pencerede açılmalıdır.

Ama bu olasılıklar hedef sınırlı değildir. Görünüşe göre ona değer katabilirsin çerçeve adı olarak, daha önce Frame etiketinin özel Name özelliğinde belirtilmiştir. Ardından, bu bağlantıdaki belge tüm alanını kaplayan aynı pencerede değil, belirttiğiniz Çerçevede açılacaktır. Temizlemek? Tam olarak değilse, örneği ayrıştırırken şimdi netleşecektir.

Öyleyse, yukarıdaki şekilde gösterilen örneğimize geri dönelim. Sağ alt (büyük) çerçevede sol pencereden linkleri kullanarak sayfaları açmamız gerekiyor. Bu nedenle ilk yapılması gereken Frame etiketi üzerindeki Name niteliğini kullanarak bu büyük pencereye bir isim vermektir.

Yaptı ve ona "ktona" adını verdi. Artık menü olarak yüklenen dosyayı sol pencerede güvenle açabilir ve içindeki tüm A etiketlerine Target="ktona" niteliğini ekleyebilirsiniz:

Joomla ve VirtueMart bileşeninin ortaya çıkış tarihi

Elbette bul ve değiştir aracını tüm köprülere koymada kullanmak zor olmayacak, ancak kullanma fırsatımız varken neden gereksiz yere kod indiriyoruz? özel etiket Tabanı Hedef boş kullanmaktan bahsettiğimizde, köprüler hakkında aynı makalede daha önce bahsettiğimiz.

Açılış ve kapanış Head etiketleri arasına base target="ktona" koymak yeterlidir ve bu belgenin Html kodundaki tüm bağlantılar "ktona" adı verilen belirtilen çerçevede yeni sayfalar açacaktır:

Bu arada, bir zamanlar var olan aracımı örnek olarak ele alırsak, o zaman üst yatay pencereden gelen tüm bağlantıların sayfalarını sol menüm olarak işlev gören sol dikey çerçevede açmasını sağlamamız gerekir. Bunun için ne yapılması gerekiyor?

Öncelikle sol dikey çerçeveye bir isim vermemiz gerekiyor:

Ve üst pencereye (gor.html) yüklenen dosyada, base target="gor" öğesini eklemeniz gerekir:

Her şey, şimdi her şeyi doğru yaptık. Üst çerçeveden bağlanan tüm belgeler sol pencerede açılır ve buradaki tüm bağlantılar belgeleri merkezi ve en büyük Çerçevede açar. Bence her şey basit ve mantıklı.

Pencerelerin görünümünü özelleştirmek için çerçeve etiketi nitelikleri

Şimdi çerçevelerin görünümünü özelleştirmek için Çerçeve etiketinde Src ve Name dışında hangi özniteliklerin kullanılabileceğini görelim. İle başlayalım kaydırma. Bununla birlikte, çerçeve yapınızın her penceresi için kaydırma çubuklarının görüntüsünü ayrı ayrı özelleştirebiliriz.

Kaydırma, varsayılan olarak Otomatik olarak ayarlanmıştır - tarayıcı, çerçeveye yüklenen belgenin boyutuna bağlı olarak kaydırma çubuğunun görüntülenip görüntülenmeyeceğine otomatik olarak karar verir. Belge pencereye tam olarak sığmazsa, sonuna kadar görüntülemenizi sağlayan bir kaydırma çubuğu görünür.

Ayrıca, Kaydırma değerleri olarak Evet (belge tamamen içine sığsa bile penceredeki kaydırma çubukları her zaman görüntülenecektir) ve Hayır'ı (belgenin bir parçası olsa bile kaydırma çubukları asla görünmeyecek) kullanabilirsiniz. uygun değil).

Bir zamanlar var olan aracımda, varsayılan Otomatik'i kullandım ve çerçevelerdeki kaydırma çubukları gerektiği gibi göründü:

Frame etiketinin aşağıdaki özelliği - normal boyut- tektir (değeri yoktur). Kaydederek, varsayılan olarak çerçevelerin kenarlığını fareyle sürükleyerek gerçekleştirilen boyutunun değiştirilmesini yasaklayacaksınız.

Fare imlecini kenarlığa getirdiğinizde imlecin çift başlı oka dönüştüğünü göreceksiniz ve artık farenin sol tuşuna basarak kenarlığı istediğiniz gibi hareket ettirebilirsiniz. Noresize, bu iradeye bir yasak getirir (fare imlecini pencerelerin kenarına getirdiğinizde, artık çift başlı bir ok görmezsiniz).

Diğer bir görsel özellik ise çerçeve kenarlığı. Bununla birlikte, çerçeveler arasında bir çerçeve (kenarlık) çizilip çizilmeyeceğini belirtebilirsiniz. Frameborder yalnızca iki olası değere sahip olabilir - 0 (çerçeve çizmeyin) veya 1 (kenarlık gösterin). Varsayılan, elbette, 1'dir.

Bir incelik var. Görünür kenarlığı kaldırmak istiyorsanız, aralarındaki görünür sınırları kaldırmak istediğiniz çerçevelerin tüm Çerçeve etiketlerine Frameborder=0 eklemeniz gerekir.

Pekala, yine de Frame etiketinin birkaç özelliğini dikkate almalıyız - marj genişliği ve marj yüksekliği, dolguyu pencere kenarlıklarından içine yüklenen içeriğe genişlik (sol ve sağ) ve yükseklik (üst ve alt) olarak ayarlayan (sayı, dolgu piksellerinin sayısı anlamına gelir):

Neden çerçeveler üzerinde bir site yapamıyorsunuz?

Bir site oluştururken esasen kullanımlarına son veren klasik yapıların temel dezavantajının ne olduğunu görelim. Bu çerçeve yapısına göre durumunu takip etmek imkansız.

Karmaşık yapıların binlerce farklı durumu olabilir (farklı çerçeve pencerelerinde açılan belgelerin varyantları), ancak bu yapının URL adresi değişmez. Bundan dolayı olacak Tarayıcı yer işaretleri kullanılamıyor veya favori sayfalarınızın bağlantılarını diğer kullanıcılara gönderin. Neden? Niye?

Adres aynı kaldığından ve onu tarayıcınızın yer imlerinden veya bir e-postadan açtığınızda, kaydetmek istediğiniz durumu değil, çerçeve yapısının başlangıç ​​durumunu içeren bir sayfa alırsınız.

Tabii ki, bu sorun çözülebilir, ancak Html aracılığıyla değil, sunucu (örneğin, Php) veya istemci tarafı programlama dilleri (JavaScript) yardımıyla çözülebilir ve bu çözümler yüz işe yaramayacaktır. yüzde. Bu tür çözümler aslında çerçeve yapısının Url adresine mevcut durumu hakkında ek veriler eklemenize izin verir, ancak bunu yapmak kolay değildir ve güvenilirlik mutlak olmayacaktır.

Bu, web siteleri oluşturmak için çerçeve kullanmanın ilk dezavantajıdır ve çok önemlidir, ancak başka bir büyük dezavantaj daha vardır. Arama motorları, elbette, onları endekslemeyi ve pencerelerine yüklenen bu belgelerin adreslerini onlardan çıkarmayı uzun zaman önce öğrendi. Sorun farklı.

Bir kullanıcı Yandex veya Google arama sonuçlarından bir çerçeve yapısı temelinde oluşturulmuş sitenize gittiğinde, yapının tamamı değil, yalnızca çerçevelerden birine yüklenmiş olan belge açılır. Neden bahsettiğimi anlıyor musun?

Kullanıcı belgeyi görecek ve sitenizde navigasyon görmeyecek, çünkü diğer pencerelerde korunacaktır ve bunlar yalnızca tüm yapının bir parçası olarak yüklenir.

Sonuç olarak, çerçeveler üzerine kurulu bir site kullanılamaz hale gelir. Yine, sunucu komut dosyalarına dayalı olarak bu soruna çözümler bulunsa da, tek tek belgelerin adreslerinden istenen durumdaki bir çerçeve yapısına bir yönlendirme gerçekleştirileceği zaman, ancak bu yine çok zordur ve her zaman güvenilir değildir.

Genel olarak, sonuç kesin olarak çıkarılabilir - çerçeveler üzerinde siteler oluşturmanıza gerek yoktur. Ancak öte yandan, çeşitli uygulamalar için yardım oluşturmak için sürekli olarak kullanılırlar ve başka bir yerde işe yarayabilirler.

Örneğin, "Gezgin" adını verdiğim (şimdi onu geçici olarak kaldırdım) ve blogum için bir tür genişletilmiş harici menü haline gelen ve bence kaynakla çalışmayı basitleştirmesi gereken bir çerçeve yapısı oluşturdum ve bu nedenle , artık "saçmalık olmadan" olanları iyileştirmek, sitenin tanıtımını çok, çok güçlü bir şekilde etkiler.

Ancak, arama motorlarında herhangi bir sorun yaşamamak için, tüm bu çerçeve yapısını ondan kapattım ve her ihtimale karşı, indekslemelerini yasaklayarak tüm Html dosyalarına Rodots meta etiketini ekledim:

Ancak tüm bu kısıtlamalar yalnızca Frame ve Frameset etiketlerindeki yapılar için geçerlidir ve iframe etiketlerinde satır içi çerçeveler görünür kusurları yoktur ve en azından YouTube'dan video eklemek için bunları projelerinizde kullanmak oldukça mümkündür ve hatta gereklidir.

Sana iyi şanslar! Yakında blog sayfaları sitesinde görüşmek üzere

ilginizi çekebilir

Html kodunda yorum direktifleri ve Doctype'ın yanı sıra blok ve satır içi öğeler (etiketler) kavramı
Gömme ve nesne - Web sayfalarında medya içeriğini (video, flash, ses) görüntülemek için Html etiketleri
Img - Bir resim (Src) eklemek, onu metinle hizalamak ve sarmak (hizalamak) ve ayrıca bir arka plan (arka plan) ayarlamak için Html etiketi
Html Köprü Metni Biçimlendirme Dili nedir ve W3C doğrulayıcıdaki tüm etiketlerin nasıl listeleneceği Select, Option, Textarea, Label, Fieldset, Legend - Açılır liste formunun ve metin alanının Html etiketleri
Html kodundaki listeler - UL, OL, LI ve DL etiketleri
Yazı Tipi (Yüz, Boyut ve Renk), Blockquote ve Pre etiketleri - saf HTML'de kullanımdan kaldırılmış metin biçimlendirmesi (CSS kullanmadan)
Html ve CSS kodunda renkler nasıl ayarlanır, tablolarda RGB gölgelerinin seçimi, Yandex sonuçları ve diğer programlar

Çerçeveli web siteleri giderek daha az yaygın hale gelse de, çerçeveler konusuna bakmadan HTML öğrenmek eksik kalır. Ayrıca çerçeveler bir anlamda nişlerini işgal etmiş ve yönetim ve yardım sistemleri için kullanılmaktadır. Çerçevelerin dezavantajlarının çok önemli olmadığı, aksine avantajların aktif olarak talep edildiği yerlerde.

etiketi bir çerçeve oluşturmak için kullanılır , etiketin yerine geçen bir belgede ve ekranı bölgelere bölmek için kullanılır. Bu etiketin içinde etiketler vardır , bölgeye yüklenecek HTML belgesini işaret eder (Şekil 13.1).

Pirinç. 13.1. Bir tarayıcı penceresini iki çerçeveye bölme örneği

Çerçeveleri kullanırken en az üç HTML dosyası gereklidir: ilki çerçeve yapısını tanımlar ve tarayıcı penceresini iki parçaya böler ve geri kalan iki belge belirtilen pencerelere yüklenir. Çerçeve sayısı mutlaka ikiye eşit değildir, daha fazla olabilir, ancak ikiden az olamaz, aksi takdirde çerçeve kullanmanın anlamı tamamen kaybolur.

Şekil 1'de gösterilen sayfaya göre çerçeve oluşturma adımlarını göz önünde bulundurun. 13.1. Üç dosyaya ihtiyacımız var: index.html belgenin yapısını tanımlar, menu.html sol çerçeveye ve content.html sağ çerçeveye yüklenir. Bunlardan yalnızca index.html, kod yapısı bakımından diğer dosyalardan farklıdır (örnek 13.1).

Örnek 13.1. index.html dosyası

Çerçeve kullanılması durumunda ilk kod satırına aşağıdaki belge türü yazılır.

butarayıcıya çerçevelerle uğraştığını gösterir, bu kod satırı gereklidir. Konteyner sayfa kodlaması ve belge başlığı gibi tipik bilgileri içerir. HTML dosyaları çerçeveler içinde açılırken başlığın değişmeden kaldığını unutmayın.

Bu örnekte, tarayıcı penceresi cols özniteliği kullanılarak iki sütuna bölünmüştür, sol sütun 100 pikseldir ve sağ sütun yıldız karakteriyle belirtilen kalan boşluktur. Çerçevelerin genişliği veya yüksekliği de tablolara benzer şekilde yüzde olarak ayarlanabilir.

etikette src özniteliği kullanılarak belirtilen alana yüklenen HTML dosyasının adını belirtir. Soldaki pencere menu.html (Örnek 13-2) adlı bir dosyayla, sağdaki pencere ise content.html (Örnek 13-3) ile yüklenecektir. Belgelerin, name özniteliği kullanılarak belirtilen pencereye yüklenebilmesi için her çerçeveye benzersiz bir ad verilmesi arzu edilir.

Örnek 13.2. menü.html dosyası

Bu örnekte, sayfadaki gri arka plan, daha sonra ele alınacak olan stiller kullanılarak ayarlanmıştır.

Örnek 13.3. içerik.html dosyası

İÇERİK

Halihazırda üç çerçeveli daha karmaşık bir örnek düşünün (Şekil 13.2).

Pirinç. 13.2. Sayfayı üç çerçeveye bölme

Bu durumda, etiket tekrar kullanılır , ancak iki kez, bir etiket diğerinin içinde iç içe olacak şekilde. Yatay bölümleme, çeşitlilik için yüzde gösteriminin kullanıldığı satırlar özniteliği aracılığıyla oluşturulur (Örnek 13.4).

Örnek 13.4. üç çerçeve

Bu örnekte de görebileceğiniz gibi, konteyner rows özelliği ile önce iki yatay çerçeve oluşturulur, ancak ikinci çerçevenin yerine başka bir çerçeve konur , zaten Örnek 13.1'den bildiğiniz yapıyı tekrarlar. Dikey kaydırma çubuğunun görünmesini ve kullanıcının üst çerçevenin boyutunu kendi başına değiştirememesi için Scrolling="no" ve noresize nitelikleri eklendi.

İyi günler. Alexey Gulynin temas halinde. Son yazımızda, bir web sitesine favicon nasıl kurulacağını tartıştık. Bu yazıda neyin ne olduğunu açıklamak istiyorum. html'deki çerçeveler. İngilizceden çevrilmiştir. çerçeve "çerçeve" anlamına gelir. Html açısından çerçeve, bir sayfada başka bir sayfaya bağlanan ve içeriğini (o diğer sayfanın veya sitenin) görüntüleyen belirli bir seçili alandır. Çerçevelerin çok fazla gelişme almadığı ve artık bazı özel projeler dışında neredeyse hiç kullanılmadığı hemen belirtilmelidir.Aynı şey CSS ve Javascript kullanılarak yapılabilir.
Bir çerçeve kullanarak, bir sayfa, her biri diğerlerinden bağımsız olacak birkaç bloğa bölünebilir. Ana index.html belgesini ve içeriği ana sayfada görüntülenecek iki yardımcı (dahili) belgeyi oluşturalım: menu.html (site gezinme işaretlemesini içerecek) ve content.html (site içeriği). index.html işaretlemesi şöyle görünecektir:

Lütfen burada etiket olmadığını unutmayın. , bunun yerine etiketi göründü . Bu etiketin birkaç özelliği vardır:

• cols - Bu özellik, çerçevelerin sütunlara yerleştirileceğini belirtir. Bu özelliğin değeri, çerçeve boyutlarını virgülle ayırarak belirtir. Bizim durumumuzda 2 çerçevemiz olacak. İlkinin genişliği, sayfa genişliğinin %40'ı olacaktır, *, sayfa boşluğunun geri kalanı anlamına gelir (bu durumda, %60 yazabilirsiniz). Boyutu piksel cinsinden de ayarlayabilirsiniz.
• satırlar - Bu özellik, çerçevelerin satırlara yerleştirileceğini belirtir.

menu.html dosyasının içeriği şöyle görünür:

• 1 menü öğesi
• 2 menü öğesi
• 3 menü öğesi

Content.html dosyasının içeriği şöyle görünür:

Başka bir belgenin içeriğini görüntülemek için etiketini kullanmanız gerekir. değeri dosyanın yolunu belirten src özniteliğiyle. Bu blokta görüntülemek istediğimiz sitenin url'sini de belirtebilirsiniz. Öncelikle menu.html ve content.html sayfalarımızı oluşturalım:

Her şeyin nasıl çalıştığını görmek için bu kodu yazdığınızdan emin olun.

Çerçeve etiketi aşağıdaki özelliklere sahiptir:

• src - sayfanın yolu veya sitenin url adresi (site sayfası). Bazı sitelerin embed korumasına sahip olduğunu belirtmekte fayda var,
• ad - çerçeveye, bu çerçevenin kontrol edilebileceği bir ad verir,
• noresize - çerçevenin yeniden boyutlandırılmasını yasaklar,
• kaydırma - içeriği kaydırma yeteneği.

Ödev için 2 çerçeve oluşturun ve bunları üst üste yerleştirin. src özniteliğinin değeri olarak sitelere giden yolu belirtin.

Herkese selam. Html'de web sayfanıza bir tane daha ekleyebileceğiniz ilginç bir etiket vardır ve bu etiket sizinkine dikilmiş gibi görünecektir. Bu, bir örnekle birlikte html iframe'e nasıl gömüleceğine ilişkin bir makaledir.

iframe Özellikleri

Böylece, bu çift etiketin yardımıyla, makalenize İnternet'teki herhangi bir web sitesinden bir sayfa ekleyebilirsiniz. Bu kod parçasına bakalım:

Gördüğünüz gibi, tüm yapıştırma seçenekleri etiket özniteliklerinde ayarlanmıştır. İlk ikisi hakkında hiçbir şey açıklamanıza gerek olmadığını düşünüyorum - bunlar, istenen sayfanın yerleştirileceği çerçevemizin genişliği ve yüksekliğidir. Boyutlar, içerik bloğunuzun genişliğine göre seçilmelidir.

İstenen sayfanın adresi src özelliğinde ayarlanır. İçinde sitenin tam adresini yazmanız gerekir. Bir sonraki özellik, çerçevenin adıdır. Burada isteğe bağlı bir değer yazabilirsiniz. Son olarak kaydırma, kaydırma çubuklarının görünmesini sağlamaktan sorumludur ve otomatik değeri, kaydırmanın yalnızca gerektiğinde görünmesini sağlar. Değeri burada hayır olarak da ayarlayabilirsiniz. Bu durumda, kaydırma çubukları görünmeyecek, ancak daha sonra sayfayı kaydırmak mümkün olmayacak - belirtilen yükseklik yeterli olduğu sürece yalnızca parçasını görüntüleyebilirsiniz.

Geri kalan parametreleri gerekirse css ile ayarlayabilirsiniz. Örneğin, dolgu veya çerçeve olabilir.

Html'ye iframe ekleme örneği

Yukarıda verdiğim örnek kodda sadece sayfa adresini ve gerekirse çerçeve ölçülerini kendinize göre değiştirmeniz yeterli. İşte bir örnek:

Şimdi bu yazıda, imleci ekranda hareket ettirerek renkleri seçebileceğiniz ve tıklandığında kaydedildikleri bir web servisi ortaya çıktı. Güzel menüler, düğmeler ve formlar oluşturmayı denerken bu yararlı siteyi çok kullanıyorum.

Sayfanıza başka bir siteyi bu şekilde kolayca ekleyebilirsiniz. Belki de bu bağlamda, kendinize bir iframe eklemek için birçok fikriniz olacaktır. Önemli olan, artık nasıl yapıldığını biliyorsunuz.