html লেবেলটি সহ পোস্টগুলি দেখানো হচ্ছে৷ সকল পোস্ট দেখান
html লেবেলটি সহ পোস্টগুলি দেখানো হচ্ছে৷ সকল পোস্ট দেখান

শনিবার, ২১ সেপ্টেম্বর, ২০১৯

java script HTML css slide show

java script HTML css slide show

1 / 4
Caption Text
2 / 3
Caption Two
3 / 3
Caption Three
4 /4
Caption four



<html>
<head>

<style>
* {box-sizing: border-box}
body {font-family: Verdana, sans-serif; margin:0}
.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/4 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}
</style>
</head>
<body>

<div class="slideshow-container">

<div class="mySlides fade">
  <div class="numbertext">
1 / 4</div>
<img src="img_nature_wide.jpg" style="width: 100%;" />
  <div class="text">
Caption Text</div>
</div>
<div class="mySlides fade">
  <div class="numbertext">
2 / 3</div>
<img src="img_snow_wide.jpg" style="width: 100%;" />
  <div class="text">
Caption Two</div>
</div>
<div class="mySlides fade">
  <div class="numbertext">
3 / 3</div>
<img src="img_mountains_wide.jpg" style="width: 100%;" />
  <div class="text">
Caption Three</div>
</div>
<div class="mySlides fade">
  <div class="numbertext">
4 /4</div>
<img src="img_kaman_wide.GIF" style="width: 800px;" />
  <div class="text">
Caption four</div>
</div>
<a class="prev" href="https://www.blogger.com/null" onclick="plusSlides(-1)">❮</a>
<a class="next" href="https://www.blogger.com/null" onclick="plusSlides(1)">❯</a>

</div>
<br />

<div style="text-align: center;">
  <span class="dot" onclick="currentSlide(1)"></span>
  <span class="dot" onclick="currentSlide(2)"></span>
  <span class="dot" onclick="currentSlide(3)"></span>
  <span class="dot" onclick="currentSlide(4)"></span>
</div>
<script>
var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
  showSlides(slideIndex += n);
}

function currentSlide(n) {
  showSlides(slideIndex = n);
}
function currentSlide(n) {
  showSlides(slideIndex =n);
}

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}   
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none"; 
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block"; 
  dots[slideIndex-1].className += " active";
}
</script>

</body>
</html>

মঙ্গলবার, ১৭ সেপ্টেম্বর, ২০১৯

 Java Script ব্যবহার করে  কিভাবেব্রাউজারে ভিডিও রান করা যায়।

Java Script ব্যবহার করে কিভাবেব্রাউজারে ভিডিও রান করা যায়।

 

 <!DOCTYPE html>
 <html> <title> Java Script </title>
 <h1> কিভাবে Java Script ব্যবহার করে ব্রাউজারে ভিডিও রান করা যায়।</h1>
 <p>প্রথমে নোটপ্যাড ওপেন করুন,তারপর একটা ফোল্ডার তৈরি করুন ।</br>
 যে ভিডিও টি রান করবেন সেই ভিডিও টি ফোল্ডার রাখুন ।</br>
 নোটপ্যাডে চিত্রের মতো সব কিছু লিখুন ।</br>
 source src ভিডিওটির নাম লিখুন,</br> তারপর সেব করুন
 এইবার রান করে দেখুন ।  </br>
<p><video width="320" height="240" controls>
  <source src="Thunkable.mp4" type="video/mp4">
  <source src="Thunkable.ogg" type="video/ogg">
</video>
 </html>
 কিভাবে Java Script ব্যবহার করে ব্রাউজারে  অডিও মিউজিক  রান করা যায়।

কিভাবে Java Script ব্যবহার করে ব্রাউজারে অডিও মিউজিক রান করা যায়।



 <!DOCTYPE html>
<html>
<body> <html> <title> Java Script </title>
 <h1> কিভাবে Java Script ব্যবহার করে ব্রাউজারে </br> অডিও মিউজিক  রান করা যায়।</h1>
 <p>প্রথমে নোটপ্যাড ওপেন করুন,তারপর একটা ফোল্ডার তৈরি করুন ।</br>
 যে অডিও মিউজিকটি রান করবেন সেই  অডিও মিউজিকটি ফোল্ডার রাখুন ।</br>
 নোটপ্যাডে চিত্রের মতো সব কিছু লিখুন ।</br>
 source src=" অডিও মিউজিকটির নাম লিখুন,</br> তারপর সেব করুন
 এইবার রান করে দেখুন ।  </br>
</P>
<audio controls>
  <source src="  দাও গাঁয়ে হলুদ পায়ে আলতা হাতে মেহেদী.ogg" type="audio/ogg">
  <source src="দাও গাঁয়ে হলুদ পায়ে আলতা হাতে মেহেদী.mp3" type="audio/mpeg">
Your browser  not  support the audio element.
</audio>

</body>
</html>
 Java Script   কিভাবে ওয়েব সাইটে অটোমেটিক  তারিখ ও ঘডি দেখা যায়

Java Script কিভাবে ওয়েব সাইটে অটোমেটিক তারিখ ও ঘডি দেখা যায়

আমি মোঃ ওমর ফারুক আমরা অনেকে হয়তো জানি না,
কিভাবে ওয়েব সাইটে তারিখ দেখানো যায় ।
কোড়টি কপিআপনার সাইটে বসিয়ে দিন ।

 <html>
 <h1> কিভাবে ওয়েব সাইটে অটোমেটিক </br>
 তারিখ ও ঘডি দেখা যায় ।</h1>
<font color=blue>  <p id ="demo"></p>

 <script> document.getElementById("demo").innerHTML = Date(); </script>
</font>
<style>   body{
margin:10px;
font-size:40px;
padding:25px;
width:auto;
height:auto;
 }
</style>
<html>

বৃহস্পতিবার, ২ মে, ২০১৯

কিভাবে html এর মাধ্যমে ওয়েব লিংক তৈরী করা যায় ?

কিভাবে html এর মাধ্যমে ওয়েব লিংক তৈরী করা যায় ?


html>
<title>কিভাবে html এর মাধ্যমে ওয়েব লিংক তৈরী করবেন   ? </title>
<head> <h1>ওমর ফারুক</h1>
<link rel="stylesheet"href="style.css">
 </head>
<body> <p> প্রথমে লিংক তৈরীর আগে <ul>দিতে হবে ।
<a href="http://www.fstarbd.com">www.fstarbd.com</a>
 মাঝ খানে  এই ভাবে লেখে
লেখাকে সেব দিতে হবে ।
এবং শেষে </ul>দিতে হবে
</p>
</html>
কিভাবে html এর মাধ্যমে লেখাকে সাজাবেন  ?

কিভাবে html এর মাধ্যমে লেখাকে সাজাবেন ?


html>
<title>কিভাবে html এর মাধ্যমে লেখাকে সাজাবেন  ? </title>
<head> <h1>ওমর ফারুক</h1>
<link rel="stylesheet"href="style.css">
 </head>
<body> <p> শুরু <b> কিভাবে বোল্ড করা যায় </b>শেষ
শুরু<i>কিভাবে লেখাকে বাকা করা যায় শে</i>
শুরু <u>কিভাবে লেখাকে আন্ডার লাইন করা যায় ।</u> শেষ  </p>
</html>

মঙ্গলবার, ৩০ এপ্রিল, ২০১৯

কিভাবে html এর মাধ্যমে কালার পরিবর্তন করা যায়

কিভাবে html এর মাধ্যমে কালার পরিবর্তন করা যায়


<html>
<title>কিভাবে html এর মাধ্যমে কালার পরিবর্তন করা যায়  ? </title>
<head> <h1>ওমর ফারুক</h1>
<link rel="stylesheet"href="style.css">
 </head>
<body> <p> উত্তর ঃ - html এর মাধ্যমে দুইভাবে কালার পরিবর্তন করা যায় ।
সরাসরি কালারের নাম লেখে ,কালার কোডের মাধ্যমে ।
 শুরু <font color=blue> টাইম ঠিক রখার জন্য 3.বোল্টের একটা ব্যাটারি থাকে । 
মূলত সেই ব্যাটারির চ্যার্জ শেষ হওয়ার কারনে টাইম ঠিক থাকে না । 
যে কোন ঘডির দোকানে যাবেন , </font> শেষ
শুরু <font color="#9400D3">
20 গুন 32 সাইজের একটা ব্যাটারি কিনবেন ।
তারপর মাদার বোড খুলে দেখন ঘডির ব্যাটারির মতো একটা
ব্যাটারি দেখা যাচ্ছে, সেটা খুলে নতুন ব্যাটারি লাগিয়ে দিন ।
এরপর কম্পউটার থেকে টাইম তারিখ ঠিক করে দিন । </font> শেষ
 </p>
</html>

শুক্রবার, ২৩ নভেম্বর, ২০১৮

কিভাবে থিম কালার পরিবর্তন করবেন !

কিভাবে থিম কালার পরিবর্তন করবেন !





প্রথমে আপনার ব্লগ অ্যাকাউন্ট লগইন করুন ।
ড্যাশবোর্ড থেকে Template এ ক্লিক করুন ।
এবার Customize এ ক্লিক করে Advanced সিলেক্ট করুন ।
এবার আপনার পছন্দের কালার ব্যবহার করুন ।
কালার পরিবর্তন এর কাজ হয়েগেলে Apply to Blog এ ক্লিক করুন ।



সোশ্যাল মিডিয়া এডিট করবেন যেভাবে !

প্রথমে আপনার ব্লগ লগইন করুন ।
ড্যাশবোর্ড থেকে Template তারপর Edit HTML এ ক্লিক করুন ।
এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের কোড গুল সার্চ করুন ।

<li class='facebook'>
<a href='http://www.facebook.com/' rel='nofollow' target='_blank' title='facebook'>
</a></li>
<li class='googleplus'>
<a href='https://plus.google.com/' rel='nofollow' target='_blank' title='googleplus'>
</a></li>
<li class='pinterest'>
<a href='http://pinterest.com/' rel='nofollow' target='_blank' title='pinterest'>
</a></li>
<li class='twitter'>
<a href='http://twitter.com/' rel='nofollow' target='_blank' title='twitter'>
</a></li>
<li class='rss'>
<a href='http://feedburner.com/' rel='nofollow' target='_blank' title='rss'>
</a></li>
<li class='skype'>
<a href='http://www.skype.com/' rel='nofollow' target='_blank' title='Skype'>
</a></li>
<li class='vimeo'>
<a href='http://www.vimeo.com/' rel='nofollow' target='_blank' title='vimeo'>
</a></li>
<li class='flickr'>
<a href='http://www.flickr.com/' rel='nofollow' target='_blank' title='flickr'>
</a></li>
<li class='linkedin'>
<a href='http://www.linkedin.com/' rel='nofollow' target='_blank' title='linkedin'>
</a></li>
<li class='youtube'>
<a href='http://www.youtube.com/' rel='nofollow' target='_blank' title='youtube'>



উপরের কোড খুজে পেলে সেখান থেকে নীল রঙের Url মুছে সেখানে আপনার দরকারি সব Url যুক্ত করুন । আশাকরি বুঝতে কোন সমস্যা হল না ।



মেন মেনু কিভাবে এডিট করবেন !

প্রথমে আপনার ব্লগ লগইন করুন ।
ড্যাশবোর্ড থেকে Template তারপর Edit HTML এ ক্লিক করুন ।
এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের কোড গুল সার্চ করুন ।

<li> <a href='#'>Menu 1</a></li>
        <li><a href='#'>Menu 2</a></li>
        <li><a href='#'>Menu 3</a></li>
        <li><a class='prett' href='#'>Drop Menu 1</a>
          <ul class='menus'>
            <li><a href='#'>Drop Menu 1</a></li>
            <li><a href='#'>Drop Menu 2</a></li>
            <li><a href='#'>Drop Menu 3</a></li>
          </ul>
        </li>
        <li><a href='#'>Menu 4</a></li>
        <li><a href='#'>Menu 5</a></li>
        <li><a href='#'>Menu 6</a></li>
        <li><a class='prett' href='#'>Drop Menu 2</a>
          <ul class='menus'>
            <li><a href='#'>Drop Menu 1</a></li>
            <li><a href='#'>Drop Menu 2</a></li>
            <li><a href='#'>Drop Menu 3</a></li>
          </ul>
        </li>
      <li><a href='#'>Menu 7</a></li>
       <li><a href='#'>Menu 8</a></li>
      <li><a href='#'>Menu 9</a></li>
       <li><a href='#'>Menu 10</a></li>



উপরের কোড থেকে নীল রঙের # মুছে আপনার দরকারি লিঙ্ক দিন এবং লালা রঙের লিখে মুছে আপনার
 লিখা দিন ।



NEWS TICKER কিভাবে এডিট করবেন !

প্রথমে আপনার ব্লগ লগইন করুন ।
ড্যাশবোর্ড থেকে Template তারপর Edit HTML এ ক্লিক করুন ।
এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের কোড গুল সার্চ করুন ।


var url_blog = 'http://banglapress-bsdesign.blogspot.com/',

উপরের কোড থেকে নীল রঙের Url মুছে সেখানে আপনার ব্লগ Url বাসান ।
এবার Save Template এ ক্লিক করে সেভ করে নিন ।




কিভাবে সার্চ বক্স এডিট করবেন !

প্রথমে আপনার ব্লগ লগইন করুন ।
ড্যাশবোর্ড থেকে Template তারপর Edit HTML এ ক্লিক করুন ।
এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের কোড গুল সার্চ করুন ।

url: "http://banglapress-bsdesign.blogspot.com/", // URL Blog


উপরের কোড থেকে নীল রঙের Url মুছে সেখানে আপনার ব্লগ Url বাসান ।
এবার Save Template এ ক্লিক করে সেভ করে নিন ।


PAGE NAVIGATION কিভাবে এডিট করবেন !

প্রথমে আপনার ব্লগ লগইন করুন ।
ড্যাশবোর্ড থেকে Template তারপর Edit HTML এ ক্লিক করুন ।
এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের কোড গুল সার্চ করুন ।


var postperpage=4; var numshowpage=2;


উপরের কোড থেকে 4 এবং ২ মুছে সেখানে আপনার দরকার মত সংখ্যা দিন ।



FLICKER ফটো গ্যালারী এডিট !

প্রথমে আপনার ব্লগ লগইন করুন ।
ড্যাশবোর্ড থেকে Template তারপর Edit HTML এ ক্লিক করুন ।
এবার কীবোর্ড এর CTRL+F প্রেস করে নিচের কোড গুল সার্চ করুন ।

<div class="flickr_plugin"><script src="http://www.flickr.com/badge_code_v2.gne?count=8&display=latest&size=s&layout=x&source=user&user=52617155@N08" type="text/javascript"></script></div>


এবার 52617155@N08 মুছে সেখানে আপনার ID বসিয়ে দিন ।
Save Template এ ক্লিক করে সেভ করে বেরিয়ে আসুন ।


আশাকরি থিমটি এডিট করতে আপনি সফল হয়েছেন !


তাহলে আজকের মত এই পর্যন্ত কোন

বুধবার, ২১ নভেম্বর, ২০১৮

HTML, bold under line line break

HTML, bold under line line break

<html>
<h1>ওমর ফারুক</h1>
<tittle>সৎ মা 
</Tittle>
<body>
</body>
<p>

<br>সৎ মানে ভালো যদি ,</br>line break সৎ মা কেন খারাপ ?
তার শাসনে মা-হীন শিশুর হ্নদয়ে কাপ !
<u>কোন সে লোভের বশে ,
সৎ মা হয় বর্বর ?</u>under line
কথায় কথায় অগ্নি শর্মা ,
বলে আছে খবর !
<b>মা-হীন শিশুর নতুন মায়ের ,
আঁচল ধরার সময় !
অন্ন কেডে ,ছিন্ন বস্ত্র থাকে সদায় ভয় ,</b>Bold 
প্রথম প্রথম আদর করে,
<i>পরে বানায় দাসী !
তাহার আচরণে গলায় পরে ফাঁসি !
বাবা আমার নেয় না খবর ,
রাখে না কোন দাবী ।
মায়ের সাথে তাল মিলিয়ে ,
দিন করিয়াছে পার !</I>itallic 
রাজার মেয়ে রাণী আমি ,
নামটা ভীষণ মিষ্টি ।
</p>
</html>

সোমবার, ১৯ নভেম্বর, ২০১৮

যেভাবে সৌসাল মিডিয়ার লিংক তৈরী করবেন

যেভাবে সৌসাল মিডিয়ার লিংক তৈরী করবেন


<p style="
    margin-bottom: 10px;
">Over 600,000+ Readers Get fresh content from FastBlog</p>
 <ul class="social-icons icon-circle list-unstyled list-inline">
   
     
     
       <li> <a href="#"><i class="fa fa-dribbble"></i></a></li>
       <li> <a href="#"><i class="fa fa-dropbox"></i></a></li>
       <li> <a href="https://web.facebook.com/Mohammedomorfaruk.bd/"><i class="fa fa-facebook"></i></a></li>
     
       <li> <a href="#"><i class="fa fa-flickr"></i></a></li>
     
       <li> <a href="#"><i class="fa fa-github"></i></a></li>
   
       <li> <a href="#"><i class="fa fa-google-plus"></i></a></li>
     
       <li> <a href="#"><i class="fa fa-instagram"></i></a></li>
       <li> <a href="#"><i class="fa fa-linkedin"></i></a></li>
     
       <li> <a href="#"><i class="fa fa-pinterest"></i></a></li>
     
       <li> <a href="#"><i class="fa fa-skype"></i></a></li>

       <li> <a href="#"><i class="fa fa-tumblr"></i></a></li>
   
       <li> <a href="https://twitter.com/FStarMedia2"><i class="fa fa-twitter"></i></a></li>
       <li> <a href="#"><i class="fa fa-vimeo-square"></i></a></li>
       <li> <a href="#"><i class="fa fa-vk"></i></a></li>
       <li> <a href="https://www.youtube.com/channel/UC8KYXfHpgYlKW_qJ_Mgnx_g"><i class="fa fa-youtube-play"></i></a></li>
    </ul>
<style>
.list-unstyled {
 padding-left: 0;
 list-style: none;
}
.list-inline li {
     display: inline-block;
    padding-right: 1px;
    padding-left: 1px;
    margin-bottom: 5px;
}
/*---- Genral classes end -------*/

/*Change icons size here*/
.social-icons .fa {
 font-size: 1.8em;
}
/*Change icons circle size and color here*/
.social-icons .fa {
 width: 50px;
 height: 50px;
 line-height: 50px;
 text-align: center;
 color: #FFF;
 color: rgba(255, 255, 255, 0.8);
 -webkit-transition: all 0.3s ease-in-out;
 -moz-transition: all 0.3s ease-in-out;
 -ms-transition: all 0.3s ease-in-out;
 -o-transition: all 0.3s ease-in-out;
 transition: all 0.3s ease-in-out;
}

.social-icons.icon-circle .fa{
 border-radius: 50%;
}
.social-icons.icon-rounded .fa{
 border-radius:5px;
}
.social-icons.icon-flat .fa{
 border-radius: 0;
}

.social-icons .fa:hover, .social-icons .fa:active {
 color: #FFF;
 -webkit-box-shadow: 1px 1px 3px #333;
 -moz-box-shadow: 1px 1px 3px #333;
 box-shadow: 1px 1px 3px #333;
}


.social-icons .fa-adn{background-color:#504e54;}
.social-icons .fa-apple{background-color:#aeb5c5;}
.social-icons .fa-android{background-color:#A5C63B;}
.social-icons .fa-bitbucket,.social-icons .fa-bitbucket-square{background-color:#003366;}
.social-icons .fa-bitcoin,.social-icons .fa-btc{background-color:#F7931A;}
.social-icons .fa-css3{background-color:#1572B7;}
.social-icons .fa-dribbble{background-color:#F46899;}
.social-icons .fa-dropbox{background-color:#018BD3;}
.social-icons .fa-facebook,.social-icons .fa-facebook-square{background-color:#3C599F;}
.social-icons .fa-flickr{background-color:#FF0084;}
.social-icons .fa-foursquare{background-color:#0086BE;}
.social-icons .fa-github,.social-icons .fa-github-alt,.social-icons .fa-github-square{background-color:#070709;}
.social-icons .fa-google-plus,.social-icons .fa-google-plus-square{background-color:#CF3D2E;}
.social-icons .fa-html5{background-color:#E54D26;}
.social-icons .fa-instagram{background-color:#A1755C;}
.social-icons .fa-linkedin,.social-icons .fa-linkedin-square{background-color:#0085AE;}
.social-icons .fa-linux{background-color:#FBC002;color:#333;}
.social-icons .fa-maxcdn{background-color:#F6AE1C;}
.social-icons .fa-pagelines{background-color:#241E20;color:#3984EA;}
.social-icons .fa-pinterest,.social-icons .fa-pinterest-square{background-color:#CC2127;}
.social-icons .fa-renren{background-color:#025DAC;}
.social-icons .fa-skype{background-color:#01AEF2;}
.social-icons .fa-stack-exchange{background-color:#245590;}
.social-icons .fa-stack-overflow{background-color:#FF7300;}
.social-icons .fa-trello{background-color:#265A7F;}
.social-icons .fa-tumblr,.social-icons .fa-tumblr-square{background-color:#314E6C;}
.social-icons .fa-twitter,.social-icons .fa-twitter-square{background-color:#32CCFE;}
.social-icons .fa-vimeo-square{background-color:#229ACC;}
.social-icons .fa-vk{background-color:#375474;}
.social-icons .fa-weibo{background-color:#D72B2B;}
.social-icons .fa-windows{background-color:#12B6F3;}
.social-icons .fa-xing,.social-icons .fa-xing-square{background-color:#00555C;}
.social-icons .fa-youtube,.social-icons .fa-youtube-play,.social-icons .fa-youtube-square{background-color:#C52F30;}
</style>
what is HTML

what is HTML

What is HTML ? Ans :-Hyper Text Markup Language .


HTML কেন ব্যবহার করা হয় । উত্তর বিভিন্ন প্রোগরাম তৈরীর কাজে ।
এইচ টি এম এল দুটি ট্যাগের মাধ্যেমে শেষ করতে হয় ,
<অপেনিং ট্যাগ> </ ক্লোজিং ট্যাগ>
<html>
এই দুই ট্যাগের মাঝ খানে, আপনাকে সব কিছু লিখতে হবে ।
<head>

আমার সোনার বাংলা 

</head>
<Tittle>

আমার সোনার বাংলা 

</Tittle>
<body> </body>
<p>

আমার সোনার বাংলা আমি তোমায় ভালবাসি যা মন চায় লিখেন ।

</p>
 </html>