একটা ওয়েব পেজ কতটা সুন্দর হবে তা সম্পূর্ণরূপে নির্ভর করে পেজের লে আউটের উপর। আগে শুধুমাত্র HTML ব্যবহার করেই সকল ওয়েব সাইটের লে আউট তৈরি করা হত। বর্তমানে HTML এর সাথে CSS ব্যবহার করা হয়। শুধুমাত্র HTML ব্যবহার করে লে আউট তৈরি করার জন্য <table> এর সারি ও কলাম ব্যবহার করা হয়।
উদাহরণ প্রোগ্রাম
<html>
<head>
<title> Badal World</title>
</head>
<head>
<title> Badal World</title>
</head>
<body bgcolor="pink">
<table width="400" border="0">
<tr>
<td colspan="3" style="background-color: #93C;">
<h1> Web Page header</h1>
</td>
</tr>
<tr>
<td colspan="3" style="background-color: #93C;">
<h1> Web Page header</h1>
</td>
</tr>
<tr valign="top">
<td style="background-color: #C99;width:100px;text-align:top;">
<p><b>Side bar</b><br />
<a href="#">PHP</a>
<br />
<a href="#">HTML</a>
<br />
<a href="#">CSS</a>
<a href="#">Wordpress</a>
</p></td>
<td style="background-color:#EEEEEE;height:200px;width:400px;text-align:top;"><h2 style="color:#900">This is heading.</h2>
<p style="color: #006">This is a paragraph.This is a paragraph. This is a paragraph.<br />
This is a paragraph.This is a paragraph. This is a paragraph.<br />
This is a paragraph.This is a paragraph.This is a paragraph.<br />
This is a paragraph.This is a paragraph.This is a paragraph.</p></td>
</tr>
<td style="background-color: #C99;width:100px;text-align:top;">
<p><b>Side bar</b><br />
<a href="#">PHP</a>
<br />
<a href="#">HTML</a>
<br />
<a href="#">CSS</a>
<a href="#">Wordpress</a>
</p></td>
<td style="background-color:#EEEEEE;height:200px;width:400px;text-align:top;"><h2 style="color:#900">This is heading.</h2>
<p style="color: #006">This is a paragraph.This is a paragraph. This is a paragraph.<br />
This is a paragraph.This is a paragraph. This is a paragraph.<br />
This is a paragraph.This is a paragraph.This is a paragraph.<br />
This is a paragraph.This is a paragraph.This is a paragraph.</p></td>
</tr>
<tr>
<td colspan="2" style="background-color:#999;text-align:center;">
Copyright © 2016 Badal World</td>
</tr>
</table>
<td colspan="2" style="background-color:#999;text-align:center;">
Copyright © 2016 Badal World</td>
</tr>
</table>
</body>
</html>
একটা নোটপ্যাড open করে উপরের code টুকু লিখে file
মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as
type : All files, দিয়ে save করে index.html ফাইলটি Mozilla Firefox
দিয়ে open করলে নিচে প্রদর্শিত ছবির মত দেখাবে।</html>
লে আউট পদ্ধতি
Reviewed by Chef
on
10:04:00 PM
Rating:
Reviewed by Chef
on
10:04:00 PM
Rating:
No comments: