বিস্ময় অ্যানসারস এ আপনাকে সুস্বাগতম। এখানে আপনি প্রশ্ন করতে পারবেন এবং বিস্ময় পরিবারের অন্যান্য সদস্যদের নিকট থেকে উত্তর পেতে পারবেন। বিস্তারিত জানতে এখানে ক্লিক করুন...
104 জন দেখেছেন
"এইচটিএমএল" বিভাগে করেছেন (39 পয়েন্ট)

w3 school  এর নেভিগশন বার এর Html code কি হবে,,

পুরোপুরি এটার মতোই কাজ করবে, সাইট এর Link ta দিয়ে দিলাম।

বোঝার সুবিধার্থে নিচে স্কিনশট দিলাম

image

1 উত্তর

0 টি পছন্দ
করেছেন (1,345 পয়েন্ট)

প্রথমে আপনি বুটস্ট্র্যাপ থেকে তাদের css ফাইলটি আপনার মূল html ফাইলের সাথে যোগ করে নিবেন এভাবে। 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">


এটা আপনার html ফাইলের head সেকশনে লিখে দিবেন।

তারপর এই জাভাস্ক্রিপ্ট গুলো এড করে নিবেন আপনার html ফাইলে। 

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>



এরপর আপনি যেখানে নেভিগেশন বারটি চান সেখানে এই কোড গুলো এড করে নিবেন। আর ফাইলটি লোড করার সময় ইন্টারনেট কানেকশন অবশ্যয় রাখবেন। 

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">Navbar</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
      </li>
      <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Dropdown
        </a>
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
          <a class="dropdown-item" href="#">Action</a>
          <a class="dropdown-item" href="#">Another action</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="#">Something else here</a>
        </div>
      </li>
      <li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
      </li>
    </ul>
    <form class="form-inline my-2 my-lg-0">
      <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
    </form>
  </div>
</nav>

আশা করি কাজ করবে। 

ধন্যবাদ

করেছেন (6,552 পয়েন্ট)
সিএসএস ও এইচটিএমএল শেখা হইয়েগেছে পিএইচপি শিখছি

সম্পর্কিত প্রশ্নগুচ্ছ

0 টি উত্তর
17 জুলাই "এইচটিএমএল" বিভাগে জিজ্ঞাসা করেছেন অজ্ঞাতকুলশীল
1 উত্তর
14 জুলাই "এইচটিএমএল" বিভাগে জিজ্ঞাসা করেছেন অজ্ঞাতকুলশীল
0 টি উত্তর
31 মার্চ "এইচটিএমএল" বিভাগে জিজ্ঞাসা করেছেন অজ্ঞাতকুলশীল
1 উত্তর
1 উত্তর
26 জুলাই 2018 "এইচটিএমএল" বিভাগে জিজ্ঞাসা করেছেন A.Ripon (245 পয়েন্ট)

322,037 টি প্রশ্ন

412,376 টি উত্তর

127,692 টি মন্তব্য

177,423 জন নিবন্ধিত সদস্য

বিস্ময় বাংলা ভাষায় সমস্যা সমাধানের একটি নির্ভরযোগ্য মাধ্যম। এখানে আপনি আপনার প্রশ্ন করার পাশাপাশি অন্যদের প্রশ্নে উত্তর প্রদান করে অবদান রাখতে পারেন অনলাইনে বিভিন্ন সমস্যার সমাধানের জন্য সবথেকে বড় এবং উন্মুক্ত তথ্যভাণ্ডার গড়ে তোলার কাজে।
...