Ramka kodi. Iframe va Frame - ular nima va Html-da freymlardan qanday foydalanish yaxshiroq

Uy / Muzlab qoladi

Element

Ramkalar

Nima qiladi

O'rtasidagi asosiy farq

Yuqoridagi belgilashda sayt manzilini boshqasiga almashtirish va kerak bo'lganda ramka hajmini sozlash kifoya.

Ramkalar - bu veb-brauzer oynasini bir nechta mustaqil oynalarga bo'lish imkonini beruvchi HTML elementlari bo'lib, ularning har biri alohida HTML hujjatini yuklashi mumkin. Har bir bunday oyna (ramka) o'zining o'tish panellariga ega bo'lishi va boshqa mustaqil oynalardan mustaqil ravishda ishlashi yoki aksincha, ularning mazmunini boshqarishi mumkin. Ulardan doimiy ravishda bitta oynada joylashgan menyuni tashkil qilish uchun foydalanish mumkin, ma'lumotlarning o'zi esa boshqa oynada joylashgan. Foydalanuvchilar istalgan vaqtda menyuga qaytmasdan kirishlari mumkin oldingi sahifa boshqa menyu bandini tanlash uchun. Ramkalardan foydalanish sizga tasvirlar yoki boshqa statik interfeys elementlarini brauzer oynasiga "qo'yish" imkonini beradi, qolgan qismi esa freym ichida aylanadi.
Ammo shuni ta'kidlash kerakki, bugungi kunda ramkalar eskirgan vosita deb hisoblanadi va freymlari bo'lgan saytlar endi nomunosib hisoblanadi, chunki professional veb-ustalar o'z loyihalarida hech qachon ramkalardan foydalanmaydilar. Ramkalarda bir qator mashhur muammolar mavjud. Ular, masalan, qidiruv tizimlarini chalkashtirib yuborishadi, chunki tarkibni o'z ichiga olgan sahifalar boshqa hujjatlarga havola qilmaydi. Agar siz tashrif buyuruvchilarni qabul qilmoqchi bo'lsangiz qidiruv tizimlari, ramkalar haqida unuting. Foydalanuvchi o'ziga yoqqan sahifani brauzerning xatcho'plar bo'limiga joylashtirishi mumkin emas, chunki ramkalar u joylashgan sahifaning manzilini yashiradi va har doim faqat veb-sayt manzilini ko'rsatadi. Shu sababli, ular tarixni kuzatishda brauzerlar uchun muammolarni yaratadilar va ular turli xil ekran o'lchamlari va mobil qurilmalarga juda mos kelmaydi.
Ramkali loyihalar mavjud bo'lishiga qaramay Internet kamdan-kam hollarda HTML tilini o'rganish ramkalar mavzusini yoritmasdan to'liq bo'lmaydi. Ramkalar, ularning kamchiliklari bilan bir qatorda, ushbu texnologiyani istiqbolsiz deb e'tibordan chetda qoldirishga imkon bermaydigan ba'zi afzalliklarga ega.

Ramkalar yaratish

Ramkali HTML hujjatning tuzilishi tashqi ko'rinishi bo'yicha oddiy HTML hujjat formatiga juda o'xshaydi. Oddiy HTML hujjatidagi kabi barcha kodlar juftlangan teglar orasiga joylashtiriladi Va , va konteynerda sarlavhalari joylashgan. Ramkali hujjatning oddiy HTML hujjatidan asosiy farqi teg o‘rniga freymli hujjatdir juftlangan teg qo'llaniladi (inglizcha ramka to'plamidan - ramkalar to'plami).
Quyidagi misolda HTML hujjatining ramkalar bilan tuzilishi ko'rsatilgan:

Misol: Ramkali HTML hujjat tuzilishi

  • O'zingiz sinab ko'ring »
frame_top
ramka_chap frame_right



Ramkalar bilan hujjat

Yuqoridagi misolda sahifa uchta maydonni o'z ichiga oladi, ularning har biri dastlab frame_top.html, frame_left.html va frame_right.html HTML hujjatlari bilan yuklanadi. HTML hujjatlaridan tashqari ramkada grafikalar ham bo'lishi mumkin. Buning uchun atributda mos keladigan tasvirning manzilini ko'rsatish kerak src, Masalan src="image.gif". E'tibor bering, element yopish tegisiz ishlatiladi.
Idishning ichida faqat teglarni o'z ichiga olishi mumkin yoki teglar bilan qoplangan boshqa ramkalar to'plami Va .
teg quyidagi atributlarga ega:

  • qatorlar— sahifani qatorlarga boʻlish yoʻlini tavsiflaydi:
  • cols— sahifa qanday ustunlarga boʻlinishini tavsiflaydi:
Ushbu sahifaning bo'linishi natijasida yuzaga keladigan joylar ramkalar bo'ladi. Ushbu atributlarning yo'qligi butun brauzer oynasini egallaydigan yagona ramkani belgilaydi.

Atributlarning ma'nosida qatorlar Va cols Bu qatorlar yoki ustunlar sonini emas, balki ramkalarning kengligi va balandligini ko'rsatishi kerak. Ro'yxatdagi barcha qiymatlar vergul bilan ajratilgan. O'lchamlar mutlaq birliklar (piksellar) yoki foizlarda ko'rsatilishi mumkin:

  • cols = "20%, 80%"— brauzer oynasi atribut yordamida ikki ustunga bo‘linadi cols, chap ustun brauzer oynasining 20%, o'ng esa 80% ni egallaydi.
  • satrlar = "100, *" Brauzer oynasi atribut yordamida ikkita gorizontal oynaga bo'linadi qatorlar, yuqori oyna 100 pikselni, pastki oyna esa yulduzcha belgisi bilan belgilangan qolgan joyni egallaydi.

Ushbu misoldan ko'rinib turibdiki, konteyner atribut bilan qatorlar birinchi navbatda ikkita gorizontal ramka hosil qiladi va ikkinchi ramkani boshqasi bilan almashtiradi atribut yordamida pastki gorizontal ramkani ikkita ustunga ajratadi cols, chap ustun brauzer oynasining 20%, o'ng esa 80% ni egallaydi.
Brauzer ramkalarni qo'llab-quvvatlamasa, oyna teglar orasida joylashgan matnni ko'rsatadi </b> Va <b> . Teglar orasidagi hamma narsa </b> Va <b> , ramkalarni qo'llab-quvvatlaydigan brauzerlar tomonidan e'tiborga olinmaydi. Shunday qilib, ishlab chiquvchi ramkalar tarkibini boshqa usullar bilan takrorlaydigan kodni yozishi va ushbu kodni konteynerga joylashtirishi kerak. </b>, keyin barcha foydalanuvchilar uning veb-sahifasini ko'rishlari mumkin. <br>Yuqorida aytib o'tilganidek, ajratilmagan teg hujjatga alohida ramka kiritish uchun ishlatiladi <b><frame> </b>. Atribut <b>src</b> ushbu ramka ichida ko'rsatilishi kerak bo'lgan hujjatni belgilaydi, masalan: <frame src="frame_top.html">. Agar atribut <b>src</b> etishmayotgan bo'lsa, bo'sh ramka ko'rsatiladi.</p> <h2>Chegaralar yoki ramkalar orasidagi bo'shliq</h2> <p>Odatiy bo'lib, brauzer freymlar orasidagi kulrang, odatda 3D chiziqli chegarani ko'rsatadi, undan tashrif buyuruvchilar ramka o'lchamini sozlash uchun foydalanishi mumkin. <br>Ramka chegarasi boshqa har qanday ramka elementi kabi o'zgartirilishi mumkin. Buning uchun bir nechta element atributlari mavjud <b><frameset> </b>, ramkalar chegaralarini sozlash imkonini beradi. Chegara chizig'ining qalinligi atribut bilan belgilanadi <b>chegara</b>. Standart chegara qalinligi qiymati besh. <br>Kadr chegarasini yashirish uchun siz chegara kengligi qiymatini nolga yoki atributga "no" yoki "0" qiymatini belgilashingiz kerak. <b>ramka chegarasi</b>. Atribut <b>ramka chegarasi</b> faqat ikkita qarama-qarshi ma'noni qabul qilishi mumkin. Agar atribut qiymati bo'lsa <b>ramka chegarasi</b>"ha" yoki "1" ga teng bo'lsa, ramka chegarasi ko'rsatiladi va "0" yoki "yo'q" bo'lsa, yo'q. E'tibor bering, atribut qiymatlari <b>ramka chegarasi</b> uchun farqlanadi <a href="https://ermake.ru/uz/kak-vklyuchit-cookies-v-raznyh-brauzerah-chto-takoe-faily-i-kak-ustanovit/">turli xil brauzerlar</a>. Ushbu muammoni hal qilish uchun atributdan ikki marta foydalaning <b>ramka chegarasi</b>, va ba'zi brauzerlar uchun atributni ham qo'shishingiz kerak <b>ramka oralig'i</b>"0" qiymati bilan:</p><p> <frameset frameborder="0" framespacing="0" frameborder="no" border="0"> </p><p>Quyidagi misolda biz ramkalar orasidagi chegarani olib tashlaymiz:</p> <h3>Misol: ramkalar orasidagi chegarani olib tashlash</h3> <ul><li>O'zingiz sinab ko'ring »</li> </ul><table><tr><td style="width: 10px;background-color:green;color: white;">ramka_chap</td> <td style="width: 90%;background-color:lime;color: white;">frame_right</td> </tr></table><p> <!DOCTYPE html> <html><br><head><br><meta charset="UTF-8"> <title>Chegarasiz ramkalar</title> </head> <frameset cols="100,*" frameborder="0" framespacing="0" frameborder="no" border="0"> <frame src="frame_left.html" name=" frame_left" > <frame src="frame_right.html" name="frame_right" > </frameset> </html></p> <p>Agar siz ramkalar orasidagi chegarani olib tashlasangiz, tashrif buyuruvchilar brauzerda ramka hajmini o'zgartira olmaydi. Bundan tashqari, atribut yordamida chegaralarni saqlab, ramka hajmini o'zgartirishni oldini olishingiz mumkin <b>noresize</b>:</p><p> <frame src="frame_left.html" noresize> </p><p>Atributdan foydalanish <b>chegara rangi</b> Siz ramka chegarasining rangini o'zgartirishingiz mumkin, shunchaki kodni yoki tegishli zaxiralangan rang nomini ko'rsatishingiz kerak. <br>Quyida yuqorida tavsiflangan ramka chegarasini boshqarish atributlarini o'z ichiga olgan HTML sahifasiga misol keltirilgan: chegara rangi qizil, yuqori freymning o'lchamini o'zgartirib bo'lmaydi:</p> <h3>Misol: ramka chegarasini boshqarish</h3> <ul><li>O'zingiz sinab ko'ring »</li> </ul><table style="border-collapse:collapse;"><tr><td style="border-bottom: 4px solid red;background-color:blue;color: white;" colspan="2">frame_top</td> </tr><tr><td style="border-right: 4px solid red;width: 20%;background-color:green;color: white;">ramka_chap</td> <td style="width: 80%;background-color:lime;color: white;">frame_right</td> </tr></table><p> <!DOCTYPE html> <html><br><head><br><meta charset="UTF-8"> <title>Ramka chegaralarini boshqarish</title> </head> <frameset rows="150, *" border="10" bordercolor="red" frameborder="1" frameborder="yes"> <frame src="frame_top.html" noresize> <frameset cols="20%, 80%"> <frame src="frame_left.html"> <frame src="frame_right.html"> </frameset> </frameset> </html></p> <p>Agar siz ramka ichida ko'rsatilgan sahifani uning chegaralariga yaqinroq joylashtirmoqchi bo'lsangiz yoki aksincha, uzoqroqqa ko'chirmoqchi bo'lsangiz, atributlarni o'zgartiring. <b>chegara balandligi</b> Va <b>chegara kengligi</b> teg <b><frame> </b>. Atribut <b>chegara balandligi</b> ramka mazmuni va uning yuqori va pastki chegaralari orasidagi to'ldirishni belgilaydi. Sintaksis:</p><p> <frame marginheight="число"> </p><p>Atribut <b>chegara kengligi</b> ramka mazmuni va uning o'ng va chap chegaralari orasidagi to'ldirishni belgilaydi. Sintaksis:</p><p> <frame marginwidth="число"> </p><p>Ushbu html qatori, masalan, ko'rsatilgan sahifani ramka chegarasiga yaqin joylashtiradi:</p> <p>Agar sahifa siz xohlamagan aylantirish panelini ko'rsatsa, siz atributni ko'rsatish orqali muammoni hal qilishingiz mumkin. <b>aylantirish</b> tegda "yo'q" <b><frame> </b>. Ammo shuni yodda tutingki, agar ramka sahifaning butun mazmunini ko'rsatish uchun etarlicha katta bo'lmasa, u holda tashrif buyuruvchi ko'rsatilgan sahifani aylantirish imkoniyatiga ega bo'lmaydi.</p> <h2>Ramkalar ichidagi havolalar</h2> <p>Oddiy HTML hujjatidagi havoladan keyin quyidagi tarzda amalga oshiriladi: havolani bosing va joriy hujjat joriy yoki yangi brauzer oynasida yangisiga almashtiriladi. Kadrlardan foydalanganda HTML hujjatlarini yuklash sxemasi odatdagidan farq qiladi va asosiy farq HTML hujjatini boshqa freymdan bir freymga yuklash imkoniyatidir. <br>Hujjatni ma'lum bir ramkaga yuklash uchun atributdan foydalaning <b>maqsad</b> teg <b><a> </b>. Atribut qiymati sifatida <b>maqsad</b> atribut tomonidan ko'rsatilgan hujjat yuklanadigan ramka nomi ishlatiladi <b>nomi</b> teg <b><frame> </b>. Shuni ham ta'kidlash kerakki, ramka nomi raqam yoki lotin harfi bilan boshlanishi kerak. Quyidagi nomlar zahiradagi nomlar sifatida ishlatiladi:</p> <p>Tashqi havolalar uchun maqsadli atributni _top yoki _blank ga o'rnatishingiz kerak, shunda uchinchi tomon loyihalari sizning ramkalaringizda ko'rinmaydi, balki butun brauzer oynasini to'ldiradi.</p> <p>Quyidagi misolda o'ng freym yuqori freymga joylashtirilgan havoladan sahifani yuklaydigan HTML hujjatini ko'rsatadi. To'g'ri ramkada ochiladigan hujjatga havola:</p><p> <a href="http://www.google.com" target="frame_right">Google</a> </p><p>To'g'ri ramkaga nom beriladi <i>frame_right</i>:</p><p> <frame src="frame_right.html" name="frame_right"> </p><p>Hujjatni belgilangan ramkaga yuklash uchun konstruksiyadan foydalaning <i>maqsad = "ramka_o'ng"</i>, misolda ko'rsatilganidek:</p> <h3>Misol: boshqa ramkaga havola</h3> <ul><li>O'zingiz sinab ko'ring »</li> </ul><p> <!DOCTYPE html> <html><br><head><br><meta charset="UTF-8"> <title>Boshqa ramkaga havola</title> </head> <frameset rows="100, *"> <frame src="frame_topic.html"> <frameset cols="20%, 80%"> <frame src="frame_left.html"> <frame src="frame_right.html" name="frame_right"> </frameset> <noframes> <p>Brauzeringiz ramkalarni ko'rsatmayapti</p>

Suzuvchi ramkalar

Element

Ko'rsatmalar

HTML tili (HyperText Markup Language) ikki turdagi freymlarni taqdim etadi. "Suzuvchi" yanada moslashuvchan va mavjud bo'lganiga kiritish osonroq. IN umumiy holat Suzuvchi ramka yordamida oynani o'rnatishni tavsiflovchi konstruktsiya quyidagicha ko'rinadi: Bu erda mavjud sayt (src atributi) ushbu ramka uchun ma'lumotlar manbai sifatida ko'rsatilgan. Kenglik va balandlik atributlarida ko'rsatilganidek, u 400 dan 300 gacha o'lchamdagi ramkada ochiladi. Siz src atributida saytingiz sahifasini ham belgilashingiz mumkin. Bunday holda, nisbiy manzilni ko'rsatish kifoya (ya'ni, ramka kiritilgan sahifaga nisbatan manzil): Ushbu misolda ramka balandligi ko'rsatilmagan, ammo id atributi mavjud. Undan foydalanish mumkin CSS yordamida() ushbu ramka uchun kerakli o'lchamlarni o'rnating:

Ramkalarning yana bir turi - "klassik" - ramkalar tuzilishi tavsifini o'z ichiga olgan alohida sahifani talab qiladi. Ramkalarning o'zi alohida sahifalarda, hatto alohida saytlarda ham joylashadi. Kadrlar uchun bunday konteyner sahifasining HTML kodi quyidagicha ko'rinishi mumkin:




Bloklar yo'q ... Va ... Oddiy sahifalar uchun zarur bo'lgan , bu misolda ochiladigan konteyner yorlig'i bo'lmasligi kerak qatorlar atributini o'z ichiga oladi - bu sahifa maydoni vertikal ravishda bo'linishi kerakligini anglatadi va birinchi ramka beriladi yuqori qismi. Agar siz satrlarni chiziq bilan almashtirsangiz, bo'linish gorizontal bo'ladi. Ushbu atributning qiymati "*, *" bo'lingan nisbatlarning teng ekanligini ko'rsatadi - har biri 50%. Agar siz, masalan, "20%,*" ni belgilasangiz, birinchi kadrga faqat 20%, qolgan bo'sh joy esa ikkinchisiga beriladi sichqoncha bilan ramkalar, lekin bu harakatni taqiqlash mumkin. Buning uchun ma'lum bir ramka tegiga noresize atributini qo'shishingiz kerak. Bundan tashqari, qo'shni ramkadan vertikal va gorizontal chekka o'lchamini belgilashingiz mumkin (marginwidth va marginheight atributlari): Har bir freymning aylantirish satrlari uchun xatti-harakatlar qoidalarini alohida o'rnatish mumkin. Bu uchta oldindan belgilangan qiymatdan birini o'z ichiga olishi mumkin bo'lgan aylantirish atributi yordamida amalga oshiriladi. Agar siz scrolling="auto" ni belgilasangiz, ramka mazmuni uning chegaralariga to'g'ri kelmasa, aylantirish panellari paydo bo'ladi. Agar "ha" bo'lsa - kerak bo'lishidan qat'i nazar, chiziqlar doimo mavjud bo'ladi. Agar "yo'q" bo'lsa - bu ushbu ramka uchun aylantirish chiziqlari o'chirilganligini anglatadi.

Oldingi ikki bosqichda keltirilgan ma'lumotlarga asoslanib, muammoingizni hal qilish uchun qulayroq bo'lgan html kodini yaratishingiz kerak. Shundan so'ng, uni sahifaning manba kodiga kiritish qoladi. Buning uchun siz o'zingizning sayt boshqaruv tizimingizning sahifa muharriridan foydalanishingiz mumkin - undagi kerakli sahifani oching, HTML kodini tahrirlash rejimiga o'ting va kodingizni sahifaning kerakli joyiga joylashtiring. Faylni yuklab olasizmi? manba kodi sahifa fayl menejerini boshqarish hosting yoki kontentni boshqarish tizimi, uni oching matn muharriri va unga kodni joylashtiring. Keyin o'zgartirilgan kodni serverga qayta yuklash uchun xuddi shu usuldan foydalaning.

© 2024 ermake.ru -- Kompyuterni ta'mirlash haqida - Axborot portali