এইচটিএমএল(৪) থেকে এইচটিএমএল(৫) এ রূপান্তর
এই পরিচ্ছেদে আমরা একটি পেজকে এইচটিএমএল(৪) থেকে এইচটিএমএল(৫) এ কিভাবে রুপান্তর করা যায় তা দেখবোঃ
| এইচটিএমএল(৪) | এইচটিএমএল(৫) |
|---|---|
< div id="header" > | < header > |
< div id="menu" > | < nav > |
< div id="content" > | < section > |
< div id="post" > | < article > |
< div id="footer" > | < footer > |
এইচটিএমএল(৪) পেজের একটি উদাহরণ
kt_satt_skill_example_id=1784
এইচটিএমএল(৫) doctype ডিক্লেয়ার
এইচটিএমএল(৪) doctype ডিক্লেয়ারঃ
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">এইচটিএমএল(৫) doctype ডিক্লেয়ারঃ
kt_satt_skill_example_id=1785
এইচটিএমএল(৫) এনকোডিং
এইচটিএমএল(৪) এনকোডিংঃ
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">এইচটিএমএল(৫) এনকোডিংঃ
kt_satt_skill_example_id=1786
Shiv সংস্করণ
ইন্টারনেট এক্সপ্লোরারে এইচটিএমএল(৫) এর সিমেন্টিক এলিমেন্টগুলো সাপোর্ট করানোর জন্য আপনাকে shiv ব্যবহার করতে হবেঃ
kt_satt_skill_example_id=1788
এইচটিএমএল(৫) সিমেন্টিক এলিমেন্টের সিএসএস
এইচটিএমএল(৪) এর সিএসএস স্টাইলঃ
div#header,div#footer,div#content,div#post {
border:1px solid grey;
margin:5px;
margin-bottom:15px;
padding:8px;
background-color:white;
}
div#header,div#footer {
color:white;
background-color:#444;
margin-bottom:5px;
}
div#content {
background-color:#ddd;
}
div#menu ul {
margin:0;
padding:0;
}
div#menu ul li {
display:inline;
margin:5px;
}এইচটিএমএল(৫) এর সিমেন্টিক এলিমেন্টের সিএসএস স্টাইলঃ
kt_satt_skill_example_id=1789
এইচটিএমএল(৫) <header> এবং <footer> এর ব্যবহার
id="header" এবং id="footer" এর সাহায্যে <div> এলিমেন্টকে পরিবর্তনঃ
<div id="header">
<h1>এইচটিএমএল টিউটোরিয়াল</h1>
</div>
.
.
.
<div id="footer">
<p>© স্যাট একাডেমী ২০১৬</p>
</div>এইচটিএমএল(৫) এর সিমেন্টিক <header> এবং <footer> এর সাহায্যেঃ
kt_satt_skill_example_id=1796
এইচটিএমএল(৫) <nav> এলিমেন্ট
id="menu" এর সাহায্যে <div> এলিমেন্ট পরিবর্তনঃ
<div id="menu">
<ul>
<li>খবর</li>
<li>খেলাধুলা</li>
<li>আবহাওয়া</li>
</ul>
</div>এইচটিএমএল(৫) সিমেন্টিক <nav> এলিমেন্টঃ
kt_satt_skill_example_id=1797
এইচটিএমএল(৫) এর <section> এলিমেন্ট
id="content" এর সাহায্যে <div> এলিমেন্ট পরিবর্তনঃ
<div id="content">
.
.
.
</div>এইচটিএমএল(৫) সিমেন্টিক <section> এলিমেন্টঃ
kt_satt_skill_example_id=1799
এইচটিএমএল(৫) এ <article> এলিমেন্ট
class="post" এর সাহায্যে সকল <div> এলিমেন্ট পরিবর্তনঃ
<div class="post">
<h2>খেলার পাতা</h2>
<p>আজকের খবর আজকের খবর আজকের খবর আজকের খবর আজকের খবর আজকের খবর
আজকের খবর আজকের খবর আজকের খবর আজকের খবর আজকের খবর আজকের খবর।</p>
</div>এইচটিএমএল(৫) সিমেন্টিক <article> এলিমেন্টঃ
kt_satt_skill_example_id=1800
<style> এলিমেন্টে সিলেক্টরের অতিরিক্ত অংশ লেখার প্রয়োজন নেইঃ
kt_satt_skill_example_id=1803
একটি সাধারণ এইচটিএমএল(৫) পেজ
kt_satt_skill_example_id=1805
< article >, < section > এবং < div > এর ব্যবহার
এখানে কিছু ভিন্ন ভিন্ন উদাহরণ দেওয়া হলোঃ
kt_satt_skill_example_id=1806
< article > এর মধ্যে < div >
kt_satt_skill_example_id=1808
< article > এর মধ্যে < section > এর মধ্যে < div >
kt_satt_skill_example_id=1810
Read more
