ওয়েব প্রোগ্রামিং শিখিয়েই ছাড়ব…।।।( html part 2 )

Awesome! টিউনস

সকল Awesome! টিউনস

এ মাসের টেকটিউনস সংবাদঃ ডিসেম্বর-২০০৯

রনি পারভেজ

এক সাথে যত খুশি ততো ই-মেইল চেক করুন ডেস্কটপ থেকে! প্রয়োজনীয় না হলে মূল্য ফেরত

হাসান যোবায়ের

হয়ে উঠুন পেনড্রাইভ ভাইরাস/ম্যালওয়্যার কিলার

এস বি মেহদি

ওয়েবসাইট তৈরী এবং হোস্টিং এর কয়েকটি ফ্রি অনলাইন টুল

দুঃসাহসী টিনটিন

2,237 দেখা 6 টিউমেন্টস জোসস

টিউন বিভাগ প্রোগ্রামিং

প্রকাশিত

Level 0

আমি কে !!!

11 টিউনস 97 টিউমেন্টস 0 ফলোয়ার

টিউমেন্ট ফলো জোসস

নতুনদের (যারা ওয়েব প্রোগ্রামিং এ আগ্রহি) তাদের তো প্রোগ্রামিং শিখিয়েই ছারবো ...............

--------------------------------------------------------------------------------------------------------

আবারো সুসাগতম আপনাদের ... ২ নাম্বার tune html এর উপরে ।

আগের টা মনে দেখেছেন ? না দেখলে একটু টু টূ মারেন এইখানে

তো শুরু করলাম --- আরে দারান লোড হয়তাছে স্পীড তো জানেনই loading .... loading .... loading.....

আচ্ছা এতো loading দিলে আবার _____ হইয়া যাব 😈

তো text editor open করেন । যেহেতু আপনি নতুন তাই dreamwever এর কথা ভুলেও ভাববেন না । কারন ওইটা দিয়ে আপনি কিছুই শিখতে পারবেন না ! তো কোনটা চালাবো ??? আরে এগুলার অভাব নাকি । windows এর notepad ওপেন করে । আচ্ছা দারান আরেক্তু সহজ করি এইখানে গুতা মারেন আর notepad++ download করেন / করা শেষ ? very gooodd

now lets start .................................................................................................................

সবার আগে লাগব আপনার DOCTYPE HTML tag ..... তো লেখেন <!DOCTYPE HTM>

হ্যাঁ তারপরে লাগব html tag লেখেন <html> আর </html>

এখন দেন head tag তাইলে <head> আর </head

যেহেতু আপনার ওয়েবসাইট এর title টা লাগব , তাই title tag মারেন ! <title> আর </title>

এখন লেখেন body tag তো <body> আর </body>

তাহলে পুরো ব্যাপার টা হল

<!DOCTYPE HTM>

<html>

<head>

<title>website name here</title>

</head>

<body>

..........

</body>

</html>

এখন আপনি আপনার ওয়েবসাইট বানাইতে জাই লেখেন না কেন , সব body tag এর মধ্যেই লেখতে হবে ।

তো simple একটা পেজ বানানি শুরু করি ..................

<!DOCTYPE HTM>

<html>

<head>

<title>website name here</title>

</head>

<body>

<h1>HELLO</h1>

</body>

</html>

এইটা index.html নামে সেভ করেন আর browser দিয়ে open করেন ,

এইখানে আমি h1 তাগ দিছি তাই , লেখা টা বড় হইছে ।আপনি ইচ্ছা করলে h2 অথবা h3 দিয়ে লেখা ছোট বড় করতে পারেন ।

দেখছেন ? আপনার নিজের ওয়েবসাইট এর হোম পেজ আপনি নিজেই কত সহজে বানাইলেন !! 😀

এখন চলেন আরও কিছু যোগ করি ..।

এখন p ট্যাগ দিয়ে কিছু লেখেন , আমার লেখা কপি মাইরেন না 😛

<!DOCTYPE HTM>

<html>

<head>

<title>website name here</title>

</head>

<body>

<h1>HELLO</h1>

<p>ami html pari , kono somossa ase , ki . ami aro shikhmu eitate ki kono smomssa ? naki , somossa thakle jaoga</p>

</body>

</html>

এখন পর্যন্ত আমরা div ট্যাগ ব্যবহার করি নাই ,কারন div tag সাধারণত css এর কাজ এর সময় বেপক ভাবে দরকার পরে । কিন্তু আমারা তো আর css শিখতাছি না , তাই না ? তাহলে div tag টা আমি এখন দেখাব না । সব শেষে একটা tune করে css ধারণা দিব ।

এখন আমরা আরও কিছু যোগ করি , যে ফোল্ডার এ index সেভ করেছেন , ওই ফোল্ডার এ jpg অথবা png ফরম্যাট এর একটা ছবি কপি করেন আর ছোট একটা নাম দেন । আমি html.jpg দিলাম ,

আর img tag টা ব্যবহার করেন , চলেন করি ,

<!DOCTYPE HTM>

<html>

<head>

<title>website name here</title>

</head>

<body>

<h1>HELLO</h1>

<p>ami html pari , kono somossa ase , ki . ami aro shikhmu eitate ki kono smomssa ? naki , somossa thakle jaoga</p>

</body>

</html>

[ img হল image tag আর src হল source tag , তার মানে হল আপনার ছবি টার location।আর মাই আমার ছবি টার নাম দিছি html আর format হল jpg তাই মাই html.jpg লিখছি আপনারা আপনাদের টা লেখবেন ]

(ctrl+s)দিয়ে সেভ করেন , আর browser দিয়ে ওপেন করেন ,

ওঁ জটিল তো আপনি তো আপনার একটা ওয়েবসাইট পেজ বানিয়ে ফেলেছেন

এখন দেখেন a tag , a ট্যাগ এর মানে হল পুরাপুরি মানে আমিও জানি না (:P) কিন্তু এইটা link দেওয়ার সময় লাগে .

তো আমরা অন্য তো আর কোন পেজ বানাই নাই , তাইলে google মামারেই url মারি

<!DOCTYPE html>
<head>
<title>website name here</title>
</head>
<h1>HELLO</h1>
<p>ami html pari , kono somossa ase , ki . ami aro shikhmu eitate ki kono smomssa ? naki , somossa thakle jaoga</p>
<img src="html.jpg"/> 
<a href="http://www.google.com"><http://www.google.com"</a>
<body>
</body>
</html>

এইখানে প্রথম google.com হল লিঙ্ক , আর দ্বিতীয় google হল আপনি যে text টা তে লিঙ্ক যোগ করতে চান ঐটা .।

আপনি ইচ্ছা করলে কোন ছবি তেও লিঙ্ক যোগ করতে পারেন তার জন্য শুধু যেখানে দ্বিতীয় বার google লেখছেন অইখানে img tag এঁর line টা লেখতে হবে বা a tag টা নিয়ে img এঁর দুই পাশে লেখতে হবে , যেমন

<!DOCTYPE html>
<head>
<title>website name here</title>
</head>
<h1>HELLO</h1>
<p>ami html pari , kono somossa ase , ki . ami aro shikhmu eitate ki kono smomssa ? naki , somossa thakle jaoga</p>
<img src="html.jpg"/> 
<a href="http://www.google.com"><img src="html.jpg"</a>
<body>
</body>
</html>
এখন হল না , ভাই মনে হয়তাছে একটু পরেই কারেন্ট যাবগা , তাই আজকে এই পরজন্তই , পরবর্তী tune এ অন্য tag(<br> ending </br>/<ul> ending </ul>/<li> ending </li>
) গুলা এবং একটা সাধারন ৩ পেজ এঁর ওয়েবসাইট বানিয়ে hosting এ upload দিব inshallah .
তাহলেই আমাদের html শেষ । ( আমি শুধু আপনাদের বেসিক টা শিখাইতাছি । )
, শরির টা খারাপ লাগতাছে , মনে হয় জ্বর উঠবে , দোয়া করবেন । আর সবাইকে

শবে বরাত

এর সুভেচ্ছা । সারা রাত জাগবেন আর আলাহের ইবাদত করবেন আশা করি , কারন এই দিনে সূর্য ডুবার সাথে সাথেই আল্লাহ প্রথম আকাশে নেমে আসেন , আর পরদিন সকাল পর্যন্ত বলতে থাকেন ,

তুমরা কে আছো , আমার কাছে চাও আমি দেব ,

এই দিনে আল্লাহ তালা নিজ হাতে আমাদের বরকত দান করবেন , আমি আশা করি আপনারা সবাই তৈরি , আল্লাহর নিয়ামত লাভের জন্য । । সবাই ভাল থাকবেন । আগামি পরবে ইনশাল্লাহ আবার দেখা হবে । সবাইকে আসসালামুয়ালিকুম ।
কোন সমস্যা এবং মতামতের জন্য অবশ্যই comment এ জানাবেন ।

টিউমেন্ট ফলো জোসস

Level 0

আমি কে !!!

আমি আমি কে !!!। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 10 বছর 11 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 11 টি টিউন ও 97 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 0 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।