HTML Iframe ও Layouts এর ব্যবহার
শুক্রবার, ১৯ জুলাই, ২০১৯
Comment
একটা ওয়েব পেজের মধ্যেই অপর এক বা একাধিক ওয়েব পেজ প্রদর্শন করার অন্যতম উপায় হচ্ছে আই ফ্রেম। কোন বিষয় বিস্তারিতভাবে উপস্থাপনার ক্ষেত্রে প্রাসঙ্গিক বিষয়ের উপর বিভিন্ন ওয়েব পেজের লিংক প্রকাশ করা গুরুত্বপূর্ণ, পাশাপাশি উক্ত পেজটিকে সংক্ষিপ্ত স্থানের মধ্যে স্ক্রলিং করে প্রদর্শন করতে পারলে মন্দ হয় না।
*<iframe> ট্যাগের মাধ্যমে আইফ্রেম ডিফাইন করা হয়
*height এবং width এট্রিবিউট ব্যবহার করে আইফ্রেমের উচ্চতা এবং প্রস্থ নির্ধারণ করা যায়
*এইচটিএমএল style এট্রিবিউট ব্যবহার করে আইফ্রেমের বর্ডার বাদ দেওয়া যায়
*আইফ্রেমকে লিংকের টার্গেট হিসেবে সেট করা যায়
উদাহরণ প্রোগ্রাম:
<!DOCTYPE html>
<html>
<body>
<iframe height="300px" width="100%" src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="https://biplobparbatipur.blogspot.com/" target="iframe_a">W3Schools.com</a></p>
<p>When the target of a link matches the name of an iframe, the link will open in the iframe.</p>
</body>
</html>
লে আউট

একটা ওয়েব পেজ কতটা সুন্দর হবে তা সম্পূর্ণরূপে নির্ভর করে পেজের লে আউটের উপর। আগে শুধুমাত্র HTML ব্যবহার করেই সকল ওয়েব সাইটের লে আউট তৈরি করা হত। বর্তমানে HTML এর সাথে CSS ব্যবহার করা হয়। শুধুমাত্র HTML ব্যবহার করে লে আউট তৈরি করার জন্য <table> এর সারি ও কলাম ব্যবহার করা হয়।
উদাহরণ প্রোগ্রাম:
<!DOCTYPE html>
<html>
<head>
<title>এইচটিএমএল উদাহরণ</title>
<style>
div.container {
width: 100%;
border: 1px solid gray;
}
header, footer {
padding: 1em;
color: white;
background-color: teal;
clear: left;
text-align: center;
}
nav {
float: left;
max-width: 160px;
margin: 0;
padding: 1em;
}
nav ul {
list-style-type: none;
padding: 0;
}
nav ul a {
text-decoration: none;
color:black;
}
article {
margin-left: 170px;
border-left: 1px solid gray;
padding: 1em;
overflow: hidden;
}
</style>
</head>
<body>
<div class="container">
<header>
<h1>সিটি গ্যালারী</h1>
</header>
<nav>
<ul>
<li><a href="#">ঢাকা</a></li>
<li><a href="#">চাঁদপুর</a></li>
<li><a href="#">রাজশাহী</a></li>
</ul>
</nav>
<article>
<h1>ঢাকা</h1>
<p>ঢাকা বাংলাদেশের রাজধানী এবং ঢাকা বিভাগের প্রধান শহর। ঢাকা একটি মেগাসিটি এবং দক্ষিণ এশিয়ার অন্যতম প্রধান শহরও বটে।</p>
<p>বুড়িগঙ্গা নদীর তীরে অবস্থিত এই শহর বাংলাদেশের বৃহত্তম শহর। ঢাকার মহানগর এলাকার জনসংখ্যা প্রায় ১ কোটি ৫০ লক্ষ।</p>
</article>
<footer>Copyright © sattacademy.com</footer>
</div>
</body>
</html>
বি:দ্র: Output দেখার জন্যে একটা নোটপ্যাড open করে উপরের উদাহরনের code টুকু লিখে file মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as type : All files, দিয়ে save করে index.html ফাইলটি যে কোন Browser দিয়ে open করুন।
☞ এই পোষ্ট সম্পর্কে যদি আপনার কোন প্রশ্ন☞জিজ্ঞাসা☞সমস্যা☞তথ্য জানার থাকে তাহলে আপনি☞কমেন্ট করলে আপনাকে আমরা প্রয়োজনীয় তথ্য দিয়ে সাহায্য করার চেষ্টা করব☞☞☞ "HTML Iframe ও Layouts এর ব্যবহার"
একটি মন্তব্য পোস্ট করুন