সহজ ভাষায় Html টিউটোরিয়াল পর্ব (৬)



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


ফরম তৈরী

প্রথমে পিসিতে নোডপেড অপেন করুন নিচের কোডটি কপি করুন তারপর নোডপেডে পেস্ট করুন   তারপর এটাতে anyname.html নামে সেভ করুন


<html>
<body>
<form>
<table width="50" border="0">
<tr>
<td width="50">Name:</td>
<td width="50"><input type="text" name="name2"></td>
</tr>
<tr>
<td width="50">Password:</td>
<td width="50"><input type=”password” name="password"></td>
</tr>
<tr>
<td width="50">Email:</td>
<td width="50"><input type=”text” name="email"></td>
</tr>
<tr>
<td width="50">Gender:</td>
<td width="50"><input type="radio" name="sex" value="male">male<input type="radio" name="sex" value="female">female</td>
</tr>
<tr>
<td width="100">What do you want to larn</td>
<td width="100"><input type="checkbox" name="Html" value="html">html<input type="checkbox" name="php" value="php">php
<input type="checkbox" name="Photoshop" value="photoshop">photoshpo</td>
</tr>
<td width="50"></td>
<td width="50"><input type="submit" name="submit" value="Register"/></td>
</tr>
</table>
</form>
</body>
</html>





এর পর চলুন দেখি সুপার স্ক্রিপট ও সাবস্ক্রিপট কিভাবে করতে হয় সেটা দেখব:
সুপার স্ক্রিপট ও সাবস্ক্রিপট করা একেবারে সহজ কিভাবে বললাম দেখুন আপনি যেই লেখাটির পর সুপার স্ক্রিপট বা সাবস্ক্রিপট করবেন সেই লেখাটির পর এই কোডটি বসিয়ে দিবেন <sup>5</sup> অর্থাৎ এইখানে ৫ কে সুপার স্ক্রিপট করা হয়েছে এর পরের কোডটি সাব স্ক্রিপট করা হয়েছে<sub>5</sub>

নরমাল Scroll Box

নিচের কোডটি পূর্বে যেই নোডপেড খুলেছেন তাতে পেস্ট করুন এবং সেভ করুন এবং দেখুন কেমন হল..
<div style="height:120px;width:120px;border:1px solid #ccc;font:16px/26px Georgia, Garamond, Serif;overflow:auto;">
As you can see, once there's enough text in this box, the box will grow scroll bars... that's why we call it a scroll box! You could also place an image into the scroll box.
</div>

বেকগ্রাউন্ড কালার Scroll Box

 আবার একিভাবে নিচের কোডটি পূর্বে যেই নোডপেড খুলেছেন তাতে পেস্ট করুন এবং সেভ করুন এবং দেখুন কেমন হল...
<div style="height:90px;width:150px;overflow:scroll;background-color:#67F152;">We have added a background color to this HTML scroll box. This is done using the CSS 'background-color' property.</div>

আনুভূমিক Scroll Box

নিচের কোডটি পূর্বে যেই নোডপেড খুলেছেন তাতে পেস্ট করুন এবং সেভ করুন এবং দেখুন কেমন হল.
<div style="border:1px solid black;width:150px;height:100px;overflow-y:hidden;overflow-x:scroll;">
<p style="width:250%;">
By using overflow-x, we can create scroll bars when the contents of this div are wider than the container. By setting this paragraph to 250 percent, it is 250 percent wider than the parent container - forcing an overflow.
</p>
</div>


অতিরিক্ত কিছু ..এই গুলো উপরের গুলো সাথে ফ্রি…..

বিভিন্ন প্রতীক সমূহের কোড ও নাম দিলাম আপনার কাঙ্কিত সিম্বল পাওয়ার জন্য এই  Html number এবং  Html Name   দুইটি ব্যবহার করতে পারবেন এইগুলো অনেকের অনেক সময় প্রয়োজন হতে পারে তাই দিলাম..


Symbol        Html Number           Html Name
µ                    &#181;                       &micro;

¼                   &#188;                        &frac14; (একি ভাবে ¾ দিতে চাইলে &frac34;   লিখতে হবে

                  &#8482;

©                    &#169;                        &copy;

®                    &#174;                          &reg;

²                      &#178;                         &sup2; (এটা হল সুপার স্ক্রিপট sup এর ইচ্ছামতন সংখ্যা বসান)

³                      &#179;                         &sup3;



আজ এইটুকুতেই থাক পরের পর্বে আবার দেখা হচ্ছে নতুন পোস্ট নিয়ে সেই পর্যন্ত সবাই ভাল থাকুন সুস্থ থাকুন ধন্যবাদ........

Safiul Hasan Rejvi

আমি একজন সাধারণ মানুষ ...সাধারণ মানুষ হিসেবে থাকতে চাই সব সময়........

Post a Comment

Previous Post Next Post