এইচটিএমএল মিউজিক টিউটোরিয়াল (HTML Embed Music Tutorial in Bangla)

0
60
html
html

এইচটিএমএল মিউজিক টিউটোরিয়াল (HTML Embed Music Tutorial in Bangla)

ওয়েব পেজ এ music ঢুকানো অনেক সহজ। Embed ট্যাগ এর সাহায্যে music ঢুকানো হয় এবং src attribute এর সাহায্যে media file এর লোকেশন ঠিক করা হয়।

1.<embed src="/Madine Ko Jain.mp3" />

 

Embed Attributes – প্রদর্শনের সাথে সর্ম্পকিত:

Embeded media player এর বাহ্যিক রুপ কে কাস্টমাইজ করতে নিচের attribute কে সেট করতে হবে।

১. width – media player  এর প্রসস্থতা

২. height – media player এর উচ্চতা

৩. hidden – যদি এর মান সত্য হয় তবে media player টি প্রদর্শিত হবে না। আমি সুপারিশ করব এই attributeটি ব্যবহার করতে যদি আপনি জেনে থাকেন ওয়েব পেজ এ চলা music টি  ভিজিটর  বন্ধ করা option না চান।

1.<embed src="/last breath.mp3" width="360" height="165" />

 

Embed Attributesকার্যপ্রণালী :

Embeded media player এর কার্যপ্রণালী কে কাস্টমাইজ করতে নিচের attribute কে সেট করতে হবে।

autostart – এই attribute এর  দুটি মান false বা true । যদি মান true দেয়া হয় তবে ওয়েব পেজ খোলার সাথে সাথে গান শুরু হবে।

loop – এই attribute এর  দুটি মান false বা true। true সেট  করা থাকলে গানটি  রিপিট হবে আর false  থাকলে হবে না।

volume – এই attribute দ্বারা media file এর volume সেট করা হয়। এর সীমা হল ০-১০০।

1.<embed src="/beethoven.mid" autostart="false" loop="false"
2.volume="60" />
এইচটিএমএল ভিডিও টিউটোরিয়াল (HTML Video Tutorial in Bangla)

Music ফাইল এর মত ভিডিও ফাইল কে ট্যাগ দিয়ে ওয়েব পেজ এ  প্রদর্শন করা যায়। image ট্যাগ এর মত embed ট্যাগ এর কোন closing ট্যাগ এর প্রয়োজন নেই। src attribute এর মাধ্যমে সঠিক URL(local বা global) ঠিক করে ভিডিও ওয়েব পেজে প্রদর্শন করা যায়।

1.<embed src="http://www.webcoachbd.com/files/html/htmlexample.mpeg"
2.autostart="false" />

প্রদর্শন:

 

আপনি href attribute এর মাধ্যমেও সঠিক URL ঠিক করে ভিডিও ওয়েব পেজে প্রদর্শন করা যায়।

1.<a href="http://www.webcoachbd.com/pics/flash/motiontween1easy.swf">
2.motiontween1easy.swf</a>

 

(রাইট বাটন ক্লিক করে play)

এইচটিএমএল -ভিডিওর ধরন

Flash movies (.swf), AVI’s (.avi), and MOV’s (.mov)। embed ট্যাগ এসব ফরমেটকে সাপোর্ট করে।

.swf files – এই ফরমেটটি হচ্ছে   ফ্লাশ

.wmv files – এই ফরমেটটি হচ্ছে  মাইক্রোসফট উইন্ডোজ মিডিয়া টাইপ।

.mov files – এই ফরমেটটি হচ্ছে   এপল কুইক টাইম মিডিয়া

.mpeg files – এটি একটি  standard ফরমেট যা  Moving Pictures Expert Group দ্বারা compression movie ফাইল তৈরী হয়েছে।

উপরের ফরমেট গুলোর মধ্যে ইন্টানেটে বেশি ব্যবহার হয় swf, mpeg এই ফরমেট গুলো ।

এইচটিএমএল – Embed Attributes:

Src attribute এর মত ট্যাগ  এর আরো attribute  রয়েছে সেগুলো হলো volume, autostart, hidden, and loop ।

autostart – এই attribute এর  দুটি মান false বা true । যদি মান true দেয়া হয় তবে পেজ খোলার সাথে সাথে ভিডিও টি শুরু হয়ে যাবে।

hidden – এই attribute এর মাধ্যমে play/stop/pause নিয়ন্ত্রন করে। embedded object is hidden or not. Values are true or false. (Hide your embeded media if you just want background noise).

loop – এই attribute এর  দুটি মান false বা true। true সেট  করা থাকলে ভিডিও টি  রিপিট হবে আর false  থাকলে হবে না।.

playcount – Setting a playcount সেট করা অর্থ হচ্ছে mediaটি  x number পর্যন্ত  repeat হবে অবিরত হওয়ার repeat পরিবর্তে  (playcount=”2″ এর অর্থ video টি দুই বার চলবে).

volume – এই attribute দ্বারা media file এর volume set করা হয়। এর সীমা হল ০-১০০।

এইচটিএমএল বডি (HTML Body)

Body tag যা web page এর সকল element ধারন করে। Tables, Lists, Forms, paragraph element গুলোকে Body element এর মধ্যে রাখতে হয়।

HTML – Body Margins:

Attributes

Leftmargin: body element. এর বাম পাশের মারজিন।

topmargin :body element এর উপরের  মারজিন।

1.<body topmargin="50">
2.<body leftmargin="50">
show
Top margin
Left margin

HTML – Base Text:

Text attributes এর মাধ্যমে Body tag এর ভিতরের সকল টেক্সট এর কালার ঠিক করা যায়।

1.<body text="red" >

বা

1.<body text="rgb(255,0,0)"

এইচটিএমএল ডিভ টিউটোরিয়াল ( HTML Div Tutorial in Bangla)

<div> ট্যাগ অন্যান্য ট্যাগ এর পাত্র হিসাবে কাজ করে অনেকটা body ট্যাগ এর মত।

Div এলিমেন্ট গুলো হলো block এলিমেন্ট যারা অন্তরালে থেকে অন্যান্য ট্যাগ গুলোকে একত্রে করে।

সিএসএস এর ক্ষেত্রে  Div এলিমেন্ট অনেক গুরুত্তপুর্ন।

নিচে ডিভে ব্যবহৃত কতকগুলো attributes দেয়া হলো।

id

width

height

title

style

দর্শকদের strong visualization এর জন্য ডিভের style attribute এর মাধ্যমে কালার প্রদর্শন করা যায়।

1.<body>
2.<div style="background: green">
3.<h5 >SEARCH LINKS</h5>
4.<a target="_blank" href="http://www.google.com">Google</a>
5.</div>
6.</body>

প্রদর্শন:

ডিভ কালার উদাহরন

LEAVE A REPLY

Please enter your comment!
Please enter your name here