Html টিউটোরিয়াল পর্ব (৫)

2
506
এটি 9 পর্বের এইচটিএমএল পাঠশালা সিরিজ টিউনের 5 তম পর্ব
Html টিউটোরিয়াল পর্ব (৫)

মুক্ত বিহঙ্গ (রিজভী)™

আমি ২০১১ সালে ডিপ্লোমা ইন-ইলেকট্রিক্যাল ইঞ্জিনিয়ারিং কমপ্লিট করেছি এখন EEE তে বিএসসি ইঞ্জিনিয়ারিং এ অধ্যায়নরত আছি, আর শুরু হতে টিউনারপেইজের সাথে আছি আশা করি ভবিষ্যৎও থাকব ইনশাআল্লাহ,আমার ব্লগ সাইট
Html টিউটোরিয়াল পর্ব (৫)

কেমন আছেন টিজে এবং পাঠক ভাইয়েরা আশা করছি ভালই আছেন আজকে আপনাদের জন্য নিয়ে আসলাম এইচটিএমএল এর  আর একটি পর্ব আশা করছি ভাল লাগবে সবার আর একটা কথা বলে নিই অনেক নতুন ইউজার আছে তারা হয়ত এইচটিএমএল নাম শুনলে আর আগাতে চাই না বেশিরভাগ নতুন ইউজারই এইচটিএমএলকে অনেক কিছু মনে করে তাই নতুন ইউজারদের উদ্দেশ্যে বলছি আসলে ভয় পাবার কিছু নেয় সবচেয়ে সহজ হল এইচটিএমএল শুধু নোডপেড হলে এইচটিএমএল পারবেন আর কিছু লাগবেনা..এই পর্বে কি কি আলোচনা করব তা আগে থেকেই বলে নিই Html এ দিয়ে কিভাবে অ্যানিমেটেড লিখা দিবেন অর্থাৎ ডান পাশ থেকে বাম লেখার স্ক্ররলিং অ্যানিমেশন কিভাবে দিবেন কিভাবে লেখার কলাম তৈরী করবেন চলুন তাহলে শুরু করা যাক..

Html টিউটোরিয়াল পর্ব (৫)

অ্যানিমেটেড টেক্সট

Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting

প্রথমে আপনার পিসিতে নোড পেড অপেন করে নিচের কোডটি কপি করে নোডপেডে পেস্ট করুন তারপর .html নামে সেভ করুন অথবা আমার আগের টিউন গুলো যারা ফলো করেছেন তারা এই আগের যে কোড গুলো বসিয়েছেন তার উপরে যেকোন জায়গায় <head> বা <html> এ নিচে যেকোন জায়গায় পেস্ট করুন অতঃপর এটাকে সেভ করুন এর পর সেভ করা ফাইলটি খুলুন দেখুন আপনার লেখাটি ডানপাশ থেকে বাম অ্যানিমেট হচ্ছে


<head>

</head><body>

<div id=”animation”><marquee>Welcome To Digital Bangladesh</marquee></div>

</body>

</html>


এইখানে Welcome To Digital Bangladesh জায়গায় আপনার  ইচ্ছেমত যে কোন লেখা লিখতে পারবেন অর্থাৎ এই লেখাটি অ্যানিমেটেড হবে উটা আপনার ইচ্ছামত পরিবর্তন করতে পারবেন…

 

লেখার কলাম তৈরী

২টি পদ্ধতির কোড সেয়ার করছি যার যেটা ইচ্ছা সেটা ইউজ করবেন

১ম পদ্ধতি

নিচের কোডটি কপি করে নোডপেড অন করে পেস্ট করুন


<table width=”100%” cellpadding=”0″ cellspacing=”10″ border=”0″>

<tr>

<td width=”20%” valign=”top”>

<p>Columns in text are a very handy tool.

Unfortunately, most designers don’t use

them because they’re tedious to

implement.</p>

</td>

<td width=”20%” valign=”top”>

<p>However, if you take the time and effort

of putting them into use, you’ll find

that they really add to the aesthetics

and functionality of your work.</p>

</td>

</td>

<td width=”20%” valign=”top”>

<p>However, if you take the time and effort

of putting them into use, you’ll find

that they really add to the aesthetics

and functionality of your work.</p>

</td>

</td>

<td width=”20%” valign=”top”>

<p>However, if you take the time and effort

of putting them into use, you’ll find

that they really add to the aesthetics

and functionality of your work.</p>

</td>

</tr>

</table>


তারপর anyname.html নামে সেভ করুন

 

 

২য় পদ্ধতি

নিচের কোডটি কপি করে নোডপেড অন করে পেস্ট করুন


<style>

#columns {

width: 600px;

}

#columns .column {

position: relative;

width: 46%;

padding: 1%;

border: solid 1px #000;

}

#columns .left {

float: left;

}

#columns .right {

float: right;

}

</style>

<div id=”columns”>

<div>

<p>Columns in text are a very handy tool.</p>

<p>Unfortunately, most designers don’t use

them because they’re tedious to implement.</p>

</div>

<div>

<p>However, if you take the time and effort

of putting them into use, you’ll find

that they really add to the aesthetics

and functionality of your work.</p>

</div>

</div>


তারপর anyname.html নামে সেভ করুন

Html টিউটোরিয়াল পর্ব (৫)

 

উপরের ছবির মত করতে নিচের  ফাইলটি ডাউনলোড করে নিন ফাইলটির মধ্যে সম্পূর্ণ কিছু দিয়ে দিয়েছি যাতে আপনাদের প্রেকটিসের সুবিধা হয়….

আজ এইটুকুতে থাক পরের পর্বে আবার দেখা হবে নতুন কিছু নিয়ে সেই পর্যন্ত সবাই ভাল থাকবেন এই কামনায় শেষ করছি আল্লাহ হাফেজ…………

Series Navigation << Html টিউটোরিয়াল পর্ব (৪)Html টিউটোরিয়াল পর্ব (৬) >>
টিউনারপেজের নতুন টিউন আপনাকে ইমেইল করব?
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting
Unlimited Web Hosting

2 মন্তব্য

একটি উত্তর ত্যাগ

Please enter your comment!
Please enter your name here

13 + fifteen =