??? ?? ??? ?? ??? ?? ??? ???????. ??? ??? ????. 1. ?? ???? ???? ?? ? CSS ???? ??????. 2. ?? ??? ????? JavaScript? ???? ?? ?? ??? ???? ?????. 3. ??? Mixin? ???? ??? ???????.

??

? ???? ???? ?? ???? ?? ? ???? ?? ???? ?????? ???? ?????. ?? ?? ?????? ???? ???? ???? ??? ?? ?? ??? ?? ??????. ??? ?? ???? ?? ???? ???? ??? ???? ???? ???? ???? ???? ????. ???? ?? ??? ??? ????? ??? ? ???? ??? ?? ? ? ????? ? ??? ?? ??? ?? ??? ??? ??? ?? ?? ? ? ???? ??? ??? ????? ?????.

? ??? ??? ?? ???? ???? ???? ?? ???? ?? ?? ? ??? ?????? ??? ??? ????. ??? ?? CSS ??? ??? ???? ?? ??? JavaScript ?? ?? ?? ? BootStrap? ?? ??? ???? ??? ??? ?? ? ?? ??? ???? ??? ????? ???? ????.

?? ?? ??

Bootstrap? HTML, CSS ? JavaScript? ???? ? ??? ?? ??? ?????. ??, ??, ????? ? ?? ?? ??? ?? ?? ? ??? ? ?? ??? ?????. ??? ?? ??? ??? ??? ??? ????? ?????? ??? ?? ?? ??? ?? ??? ?? ??? ???????.

?? ??? ?? ??? ??? ???? ?? CSS? ?? ??? ???? ?? ??????. CSS? ?? ???, ?? ? ?? ?? ? ??? ???? ?? ? ? ????. Bootstrap? Less ? Sass? ?? ? ???? ???? ??? ??? ???? ??? ????? ???? ????.

?? ?? ?? ?? ??

?? ??? ?? ??? ??? ???? ??? ??

?? ??? ?? ??? ??? ???? ??? ???? ???? ??? ?? ???? ?? ?? ??? ??? ???? ??? ???? ????. ?? ???? ?? ??? ????? ?? ??? ??? ??? ???? ??? CSS ???? ?????.

?? ?? ??? ??? ????? ?? ???? ?? ??? ???? ???? ?? ? CSS ??? ?? ? ? ????.

 .btn-custom {
  ??? : #FF6347;
  ?? ?? : #FF6347;
  ?? : ??;
}

.btn-custom : ?? {
  ??? : #FF4500;
  ?? ? : #FF4500;
}

?? ?? HTML ??? ??? ???? ??????.

 <button class = "btn btn-custom"> ??? ?? ?? </button>

?? ??

Bootstrap? ???? ??? ??? ?? (CSS)? ?? ?????. ? ?? ???? ?? ??? ?? ???? ???? ?? ? CSS ???? ????. ??? CSS ??? ???? CSS? "Post-Defined Rules First"? ??? ??? Bootstrap? ?? ???? ?????.

??? ?? ???? ??? ??? ?? ???? ?? ???? ?? ???? ????? ??? ? ??? ???? ??????? ???????. ?? ?? ???? ?? ? ???? ??? ???? ?? ?????. ?? ?? ??? ???? ??? ??? ??? ?????.

??? ?

?? ??

??? ???? ?? ?? ??? ??? CSS ???? ???? ?? ??? ???? ???? ????. ?? ??, ????? ?? ???? ????? ??? ?? ? ? ????.

 .navbar-custom {
  ??? : #333;
}

.navbar-custom .navbar-nav .nav-link {
  ?? : #ffff;
}

.navbar-custom .navbar-nav .nav-link : hover {
  ?? : #ddd;
}

?? ?? html ?? ???? ??????.

 <nav class = "Navbar Navbar-Expand-Lg Navbar-Custom">
  <!-????? ? ???->
</nav>

?? ??

?? ??? ??? ??? ???? ?? ???? ?? ??? ????? JavaScript? ???? ?? ??? ??? ???? ???? ? ?? ????. ?? ??, ??? ?? ?? ??? ???? ??? ?? ? ? ????.

 $ (document) .ready (function () {
  $ ( '. custom-collapse'). on ( 'click', function () {
    $ (this) .next ( '. Collapse'). Collapse ( 'Toggle');
  });
});

 <button class = "BTN BTN-PRIMARY CUSTIM-COLLAPSE"> ?? ?? </button>
<div class = "??">
  <!-?? ??->
</div>

???? ?? ? ??? ?

?? ??? ?? ??? ??? ?? ? ? ???? ???? ??? ? ??? ???? ???? ??? ?? ???? ???? ??? JavaScript ??? ??? ??? ???? ????? ?? ?? ??? ?????.

??? ??? ??? ? ? ????? ??? ??? ???? ?? ? ??? ??? ???? ??? ? ????. Bootstrap ??? ?? ??? ?? ?????????? ?????, ?? ???? !important (??? ?? ??? ????).

?? ??? ? ?? ??

?? ??? ?? ??? ??? ?? ? ? ?? ???? ??? ?? ?????. ?? ?? ??? ?? ???? ?? ?????? ??? ?? ? ? ???? ??? ?? ? ?? ?? ??? ??? ??????.

?? ??? ?? ???? ???? ????? ?? ???? ?? ? ??? ?? ?? ???? ???? ??? ???? ????. ??? ??? ?? ?? ???? ????? ?????.

?? Bootstrap? ?? ? ??? ??? ???? ?? ???? ??? ??? ? ?? ? ? ????. ??? ??? ???? ??? ?? ??? ?? ?? ???? ?? ? ? ????.

???? ?????? ?? ? ????? ??? ???? ?? Bootstrap? ????? ?? ?? ?? ??? ?? ???? ??? ?????. ??? ? ???? ???? ??? JavaScript? ?? ??? ???? ??????. ? ???? ??? ???? ?????? ????? ??? ???? ??? ?? ???? ??? ??????.

? ??, ?? ?? ??? ?? ??? ???????? ?? ??? ? ?? ?? ? ??? ?? ??? ??? ??? ????? ?? ?? ??????. ?? ??? ??? ??? ????? ?? ???? ???? ??????? ???????.

???, ?? ??? ?? ??? ??? ??? ???? ??? ???? ?????. ? ??? ??? ?? ??? ??? ????? ?? ? ???? ?? ? ??? ????.

? ??? ?? ??? ?? ?? ?? : ?? ? ??? ??? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!