ਮੁੱਖ ਸਮੱਗਰੀ ਤੇ ਜਾਓ ਡੌਕਸ ਨੈਵੀਗੇਸ਼ਨ 'ਤੇ ਜਾਓ
in English

ਜਾਣ-ਪਛਾਣ

jsDelivr ਅਤੇ ਇੱਕ ਟੈਂਪਲੇਟ ਸਟਾਰਟਰ ਪੰਨੇ ਦੇ ਨਾਲ, ਜਵਾਬਦੇਹ, ਮੋਬਾਈਲ-ਪਹਿਲੀ ਸਾਈਟਾਂ ਬਣਾਉਣ ਲਈ ਦੁਨੀਆ ਦਾ ਸਭ ਤੋਂ ਪ੍ਰਸਿੱਧ ਫਰੇਮਵਰਕ, Bootstrap ਨਾਲ ਸ਼ੁਰੂਆਤ ਕਰੋ।

ਤੇਜ਼ ਸ਼ੁਰੂਆਤ

ਆਪਣੇ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ ਬੂਟਸਟਰੈਪ ਨੂੰ ਤੇਜ਼ੀ ਨਾਲ ਜੋੜਨਾ ਚਾਹੁੰਦੇ ਹੋ? jsDelivr ਦੀ ਵਰਤੋਂ ਕਰੋ, ਇੱਕ ਮੁਫਤ ਓਪਨ ਸੋਰਸ CDN। ਇੱਕ ਪੈਕੇਜ ਮੈਨੇਜਰ ਦੀ ਵਰਤੋਂ ਕਰ ਰਹੇ ਹੋ ਜਾਂ ਸਰੋਤ ਫਾਈਲਾਂ ਨੂੰ ਡਾਊਨਲੋਡ ਕਰਨ ਦੀ ਲੋੜ ਹੈ? ਡਾਉਨਲੋਡਸ ਪੰਨੇ 'ਤੇ ਜਾਓ

CSS

ਸਾਡੀ CSS ਨੂੰ ਲੋਡ ਕਰਨ ਲਈ ਹੋਰ ਸਾਰੀਆਂ ਸਟਾਈਲਸ਼ੀਟਾਂ ਤੋਂ ਪਹਿਲਾਂ ਸਟਾਈਲਸ਼ੀਟ <link>ਨੂੰ ਕਾਪੀ-ਪੇਸਟ ਕਰੋ ।<head>

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

ਜੇ.ਐਸ

ਸਾਡੇ ਬਹੁਤ ਸਾਰੇ ਹਿੱਸਿਆਂ ਨੂੰ ਕੰਮ ਕਰਨ ਲਈ JavaScript ਦੀ ਵਰਤੋਂ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ। ਖਾਸ ਤੌਰ 'ਤੇ, ਉਹਨਾਂ ਨੂੰ ਸਾਡੇ ਆਪਣੇ JavaScript ਪਲੱਗਇਨ ਅਤੇ ਪੌਪਰ ਦੀ ਲੋੜ ਹੁੰਦੀ ਹੈ । ਇਹਨਾਂ ਵਿੱਚੋਂ ਇੱਕ ਨੂੰ<script> ਆਪਣੇ ਪੰਨਿਆਂ ਦੇ ਅੰਤ ਦੇ ਨੇੜੇ, ਬੰਦ ਕਰਨ ਵਾਲੇ ਟੈਗ ਤੋਂ ਠੀਕ ਪਹਿਲਾਂ ,</body> ਉਹਨਾਂ ਨੂੰ ਸਮਰੱਥ ਕਰਨ ਲਈ ਰੱਖੋ ।

ਬੰਡਲ

ਸਾਡੇ ਦੋ ਬੰਡਲਾਂ ਵਿੱਚੋਂ ਇੱਕ ਨਾਲ ਹਰੇਕ ਬੂਟਸਟਰੈਪ JavaScript ਪਲੱਗਇਨ ਅਤੇ ਨਿਰਭਰਤਾ ਸ਼ਾਮਲ ਕਰੋ। ਦੋਵੇਂ bootstrap.bundle.jsਅਤੇ ਸਾਡੇ ਟੂਲਟਿਪਸ ਅਤੇ ਪੋਪੋਵਰਾਂ ਲਈ ਪੋਪਰbootstrap.bundle.min.js ਸ਼ਾਮਲ ਕਰਦੇ ਹਨ। ਬੂਟਸਟਰੈਪ ਵਿੱਚ ਕੀ ਸ਼ਾਮਲ ਹੈ ਇਸ ਬਾਰੇ ਹੋਰ ਜਾਣਕਾਰੀ ਲਈ, ਕਿਰਪਾ ਕਰਕੇ ਸਾਡਾ ਸਮੱਗਰੀ ਭਾਗ ਵੇਖੋ।

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

ਵੱਖਰਾ

ਜੇਕਰ ਤੁਸੀਂ ਵੱਖਰੇ ਸਕ੍ਰਿਪਟਾਂ ਦੇ ਹੱਲ ਨਾਲ ਜਾਣ ਦਾ ਫੈਸਲਾ ਕਰਦੇ ਹੋ, ਤਾਂ ਪੌਪਰ ਪਹਿਲਾਂ ਆਉਣਾ ਚਾਹੀਦਾ ਹੈ (ਜੇ ਤੁਸੀਂ ਟੂਲਟਿਪਸ ਜਾਂ ਪੌਪਓਵਰ ਵਰਤ ਰਹੇ ਹੋ), ਅਤੇ ਫਿਰ ਸਾਡੇ JavaScript ਪਲੱਗਇਨ।

<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>

ਮੋਡੀਊਲ

ਜੇਕਰ ਤੁਸੀਂ ਵਰਤਦੇ ਹੋ <script type="module">, ਤਾਂ ਕਿਰਪਾ ਕਰਕੇ ਸਾਡੇ ਬੂਟਸਟਰੈਪ ਨੂੰ ਇੱਕ ਮੋਡੀਊਲ ਸੈਕਸ਼ਨ ਵਜੋਂ ਵਰਤਣਾ ਵੇਖੋ।

ਕੰਪੋਨੈਂਟਸ

ਉਤਸੁਕ ਹੈ ਕਿ ਕਿਹੜੇ ਭਾਗਾਂ ਨੂੰ ਸਪੱਸ਼ਟ ਤੌਰ 'ਤੇ ਸਾਡੀ JavaScript ਅਤੇ ਪੌਪਰ ਦੀ ਲੋੜ ਹੈ? ਹੇਠਾਂ ਸ਼ੋਅ ਕੰਪੋਨੈਂਟ ਲਿੰਕ 'ਤੇ ਕਲਿੱਕ ਕਰੋ। ਜੇ ਤੁਸੀਂ ਆਮ ਪੰਨੇ ਦੀ ਬਣਤਰ ਬਾਰੇ ਪੂਰੀ ਤਰ੍ਹਾਂ ਅਨਿਸ਼ਚਿਤ ਹੋ, ਤਾਂ ਇੱਕ ਉਦਾਹਰਨ ਪੰਨਾ ਟੈਮਪਲੇਟ ਲਈ ਪੜ੍ਹਨਾ ਜਾਰੀ ਰੱਖੋ।

JavaScript ਦੀ ਲੋੜ ਵਾਲੇ ਭਾਗ ਦਿਖਾਓ
  • ਖਾਰਜ ਕਰਨ ਲਈ ਚੇਤਾਵਨੀਆਂ
  • ਟੌਗਲ ਕਰਨ ਵਾਲੀਆਂ ਸਥਿਤੀਆਂ ਅਤੇ ਚੈਕਬਾਕਸ/ਰੇਡੀਓ ਕਾਰਜਕੁਸ਼ਲਤਾ ਲਈ ਬਟਨ
  • ਸਾਰੇ ਸਲਾਈਡ ਵਿਹਾਰਾਂ, ਨਿਯੰਤਰਣਾਂ ਅਤੇ ਸੂਚਕਾਂ ਲਈ ਕੈਰੋਜ਼ਲ
  • ਸਮੱਗਰੀ ਦੀ ਦਿੱਖ ਨੂੰ ਟੌਗਲ ਕਰਨ ਲਈ ਸਮੇਟੋ
  • ਡਿਸਪਲੇਅ ਅਤੇ ਪੋਜੀਸ਼ਨਿ���ਗ ਲਈ ਡ੍ਰੌਪਡਾਉਨ ( ਪੋਪਰ ਦੀ ਵੀ ਲੋੜ ਹੈ )
  • ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ, ਸਥਿਤੀ, ਅਤੇ ਸਕ੍ਰੌਲ ਵਿਵਹਾਰ ਲਈ ਮਾਡਲ
  • ਜਵਾਬਦੇਹ ਵਿਵਹਾਰ ਨੂੰ ਲਾਗੂ ਕਰਨ ਲਈ ਸਾਡੇ ਸੰਕੁਚਿਤ ਪਲੱਗਇਨ ਨੂੰ ਵਧਾਉਣ ਲਈ ਨਵਬਾਰ
  • ਡਿਸਪਲੇ, ਪੋਜੀਸ਼ਨਿੰਗ, ਅਤੇ ਸਕ੍ਰੌਲ ਵਿਵਹਾਰ ਲਈ ਆਫਕੈਨਵੇਸ
  • ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ ਅਤੇ ਖਾਰਜ ਕਰਨ ਲਈ ਟੋਸਟ
  • ਡਿਸਪਲੇਅ ਅਤੇ ਪੋਜੀਸ਼ਨਿੰਗ ਲਈ ਟੂਲਟਿਪਸ ਅਤੇ ਪੋਪੋਵਰ ( ਪੋਪਰ ਦੀ ਵੀ ਲੋੜ ਹੈ )
  • ਸਕ੍ਰੌਲ ਵਿਹਾਰ ਅਤੇ ਨੈਵੀਗੇਸ਼ਨ ਅੱਪਡੇਟ ਲਈ Scrollspy

ਸਟਾਰਟਰ ਟੈਮਪਲੇਟ

ਆਪਣੇ ਪੰਨਿਆਂ ਨੂੰ ਨਵੀਨਤਮ ਡਿਜ਼ਾਈਨ ਅਤੇ ਵਿਕਾਸ ਮਾਪਦੰਡਾਂ ਨਾਲ ਸਥਾਪਤ ਕਰਨਾ ਯਕੀਨੀ ਬਣਾਓ। ਇਸਦਾ ਮਤਲਬ ਹੈ ਕਿ ਇੱਕ HTML5 ਡਾਕਟਾਈਪ ਦੀ ਵਰਤੋਂ ਕਰਨਾ ਅਤੇ ਸਹੀ ਜਵਾਬਦੇਹ ਵਿਵਹਾਰਾਂ ਲਈ ਇੱਕ ਵਿਊਪੋਰਟ ਮੈਟਾ ਟੈਗ ਸ਼ਾਮਲ ਕਰਨਾ। ਇਹ ਸਭ ਇਕੱਠੇ ਰੱਖੋ ਅਤੇ ਤੁਹਾਡੇ ਪੰਨਿਆਂ ਨੂੰ ਇਸ ਤਰ੍ਹਾਂ ਦਿਖਣਾ ਚਾਹੀਦਾ ਹੈ:

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>

    <!-- Option 2: Separate Popper and Bootstrap JS -->
    <!--
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
    -->
  </body>
</html>

ਅਗਲੇ ਕਦਮਾਂ ਲਈ, ਆਪਣੀ ਸਾਈਟ ਦੀ ਸਮੱਗਰੀ ਅਤੇ ਭਾਗਾਂ ਨੂੰ ਲੇਆਉਟ ਕਰਨਾ ਸ਼ੁਰੂ ਕਰਨ ਲਈ ਲੇਆਉਟ ਦਸਤਾਵੇਜ਼ਾਂ ਜਾਂ ਸਾਡੇ ਅਧਿਕਾਰਤ ਉਦਾਹਰਨਾਂ 'ਤੇ ਜਾਓ।

ਮਹੱਤਵਪੂਰਨ ਗਲੋਬਲ

ਬੂਟਸਟਰੈਪ ਮੁੱਠੀ ਭਰ ਮਹੱਤਵਪੂਰਨ ਗਲੋਬਲ ਸਟਾਈਲਾਂ ਅਤੇ ਸੈਟਿੰਗਾਂ ਨੂੰ ਨਿਯੁਕਤ ਕਰਦਾ ਹੈ ਜਿਨ੍ਹਾਂ ਬਾਰੇ ਤੁਹਾਨੂੰ ਇਸਦੀ ਵਰਤੋਂ ਕਰਦੇ ਸਮੇਂ ਸੁਚੇਤ ਹੋਣ ਦੀ ਜ਼ਰੂਰਤ ਹੋਏਗੀ, ਇਹ ਸਾਰੀਆਂ ਲਗਭਗ ਵਿਸ਼ੇਸ਼ ਤੌਰ 'ਤੇ ਕ੍ਰਾਸ ਬ੍ਰਾਊਜ਼ਰ ਸਟਾਈਲ ਦੇ ਸਧਾਰਣਕਰਨ ਲਈ ਤਿਆਰ ਹਨ। ਆਓ ਅੰਦਰ ਡੁਬਕੀ ਕਰੀਏ।

HTML5 doctype

ਬੂਟਸਟਰੈਪ ਨੂੰ HTML5 doctype ਦੀ ਵਰਤੋਂ ਦੀ ਲੋੜ ਹੈ। ਇਸ ਤੋਂ ਬਿਨਾਂ, ਤੁਸੀਂ ਕੁਝ ਮਜ਼ੇਦਾਰ ਅਧੂਰੀ ਸਟਾਈਲਿੰਗ ਦੇਖੋਗੇ, ਪਰ ਇਸ ਨੂੰ ਸ਼ਾਮਲ ਕਰਨ ਨਾਲ ਕੋਈ ਬਹੁਤੀ ਹਿਚਕੀ ਨਹੀਂ ਹੋਣੀ ਚਾਹੀਦੀ।

<!doctype html>
<html lang="en">
  ...
</html>

ਜਵਾਬਦੇਹ ਮੈਟਾ ਟੈਗ

ਬੂਟਸਟਰੈਪ ਨੂੰ ਮੋਬਾਈਲ ਪਹਿਲਾਂ ਵਿਕਸਤ ਕੀਤਾ ਗਿਆ ਹੈ , ਇੱਕ ਰਣਨੀਤੀ ਜਿਸ ਵਿੱਚ ਅਸੀਂ ਪਹਿਲਾਂ ਮੋਬਾਈਲ ਡਿਵਾਈਸਾਂ ਲਈ ਕੋਡ ਨੂੰ ਅਨੁਕੂਲਿਤ ਕਰਦੇ ਹਾਂ ਅਤੇ ਫਿਰ CSS ਮੀਡੀਆ ਸਵਾਲਾਂ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਲੋੜ ਅਨੁਸਾਰ ਭਾਗਾਂ ਨੂੰ ਸਕੇਲ ਕਰਦੇ ਹਾਂ। ਸਾਰੀਆਂ ਡਿਵਾਈਸਾਂ ਲਈ ਸਹੀ ਰੈਂਡਰਿੰਗ ਅਤੇ ਟਚ ਜ਼ੂਮਿੰਗ ਨੂੰ ਯਕੀਨੀ ਬਣਾਉਣ ਲਈ, ਆਪਣੇ ਵਿੱਚ ਜਵਾਬਦੇਹ ਵਿਊਪੋਰਟ ਮੈਟਾ ਟੈਗ ਸ਼ਾਮਲ ਕਰੋ <head>

<meta name="viewport" content="width=device-width, initial-scale=1">

ਤੁਸੀਂ ਸਟਾਰਟਰ ਟੈਂਪਲੇਟ ਵਿੱਚ ਇਸਦੀ ਇੱਕ ਉਦਾਹਰਨ ਦੇਖ ਸਕਦੇ ਹੋ ।

ਬਾਕਸ-ਆਕਾਰ

CSS ਵਿੱਚ ਵਧੇਰੇ ਸਿੱਧੇ ਆਕਾਰ ਲਈ, ਅਸੀਂ ਗਲੋਬਲ box-sizingਮੁੱਲ ਨੂੰ ਤੋਂ content-boxਵਿੱਚ ਬਦਲਦੇ ਹਾਂ border-box। ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦਾ paddingਹੈ ਕਿ ਕਿਸੇ ਤੱਤ ਦੀ ਅੰਤਿਮ ਗਣਨਾ ਕੀਤੀ ਚੌੜਾਈ ਨੂੰ ਪ੍ਰਭਾਵਤ ਨਹੀਂ ਕਰਦਾ ਹੈ, ਪਰ ਇਹ Google ਨਕਸ਼ੇ ਅਤੇ Google ਕਸਟਮ ਖੋਜ ਇੰਜਣ ਵਰਗੇ ਕੁਝ ਤੀਜੀ-ਧਿਰ ਸੌਫਟਵੇਅਰ ਨਾਲ ਸਮੱਸਿਆਵਾਂ ਪੈਦਾ ਕਰ ਸਕਦਾ ਹੈ।

ਦੁਰਲੱਭ ਮੌਕੇ 'ਤੇ ਤੁਹਾਨੂੰ ਇਸ ਨੂੰ ਓਵਰਰਾਈਡ ਕਰਨ ਦੀ ਲੋੜ ਹੈ, ਹੇਠ ਲਿਖੀਆਂ ਚੀਜ਼ਾਂ ਦੀ ਵਰਤੋਂ ਕਰੋ:

.selector-for-some-widget {
  box-sizing: content-box;
}

ਉਪਰੋਕਤ ਸਨਿੱਪਟ ਦੇ ਨਾਲ, ਨੇਸਟਡ ਐਲੀਮੈਂਟਸ — ਦੁਆਰਾ ਤਿਆਰ ਕੀਤੀ ਸਮਗਰੀ ਸਮੇਤ — ::beforeਅਤੇ —ਸਭ ਉਸ ਲਈ ::afterਨਿਸ਼ਚਿਤ ਨੂੰ ਪ੍ਰਾਪਤ ਕਰਨਗੇ ।box-sizing.selector-for-some-widget

CSS ਟ੍ਰਿਕਸ 'ਤੇ ਬਾਕਸ ਮਾਡਲ ਅਤੇ ਆਕਾਰ ਬਾਰੇ ਹੋਰ ਜਾਣੋ ।

ਮੁੜ - ਚਾਲੂ

ਸੁਧਾਰੀ ਹੋਈ ਕ੍ਰਾਸ-ਬ੍ਰਾਊਜ਼ਰ ਰੈਂਡਰਿੰਗ ਲਈ, ਅਸੀਂ ਆਮ HTML ਤੱਤਾਂ ਨੂੰ ਥੋੜ੍ਹੇ ਜ਼ਿਆਦਾ ਵਿਚਾਰ ਵਾਲੇ ਰੀਸੈੱਟ ਪ੍ਰਦਾਨ ਕਰਦੇ ਹੋਏ ਬ੍ਰਾਊਜ਼ਰਾਂ ਅਤੇ ਡਿਵਾਈਸਾਂ ਵਿੱਚ ਅਸੰਗਤਤਾਵਾਂ ਨੂੰ ਠੀਕ ਕਰਨ ਲਈ ਰੀਬੂਟ ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹਾਂ।

ਭਾਈਚਾਰਾ

ਬੂਟਸਟਰੈਪ ਦੇ ਵਿਕਾਸ 'ਤੇ ਅੱਪ ਟੂ ਡੇਟ ਰਹੋ ਅਤੇ ਇਹਨਾਂ ਮਦਦਗਾਰ ਸਰੋਤਾਂ ਨਾਲ ਭਾਈਚਾਰੇ ਤੱਕ ਪਹੁੰਚੋ।

  • ਅਧਿਕਾਰਤ ਬੂਟਸਟਰੈਪ ਬਲੌਗ ਨੂੰ ਪੜ੍ਹੋ ਅਤੇ ਗਾਹਕ ਬਣੋ ।
  • IRC ਵਿੱਚ ਸਾਥੀ ਬੂਟਸਟਰੈਪਰਾਂ ਨਾਲ ਗੱਲਬਾਤ ਕਰੋ। irc.libera.chatਸਰਵਰ ਉੱਤੇ, ਚੈਨਲ #bootstrapਵਿੱਚ।
  • ਸਟੈਕ ਓਵਰਫਲੋ (ਟੈਗ ਕੀਤੇ) 'ਤੇ ਲਾਗੂ ਕਰਨ ਵਿੱਚ ਮਦਦ ਮਿਲ ਸਕਦੀ ਹੈ bootstrap-5
  • ਡਿਵੈਲਪਰਾਂ ਨੂੰ ਪੈਕੇਜਾਂ 'ਤੇ ਕੀਵਰਡ ਦੀ ਵਰਤੋਂ ਕਰਨੀ ਚਾਹੀਦੀ ਹੈ ਜੋ ਵੱਧ ਤੋਂ ਵੱਧ ਖੋਜਯੋਗਤਾ ਲਈ npm ਜਾਂ ਸਮਾਨ ਡਿਲੀਵਰੀ ਵਿਧੀ bootstrapਰਾਹੀਂ ਵੰਡਣ ਵੇਲੇ ਬੂਟਸਟਰੈਪ ਦੀ ਕਾਰਜਕੁਸ਼ਲਤਾ ਨੂੰ ਸੰਸ਼ੋਧਿਤ ਜਾਂ ਜੋੜਦੇ ਹਨ ।

ਤੁਸੀਂ ਨਵੀਨਤਮ ਗੱਪਾਂ ਅਤੇ ਸ਼ਾਨਦਾਰ ਸੰਗੀਤ ਵੀਡੀਓਜ਼ ਲਈ ਟਵਿੱਟਰ 'ਤੇ @getbootstrap ਨੂੰ ਵੀ ਫਾਲੋ ਕਰ ਸਕਦੇ ਹੋ ।