ಪರಿಚಯ
JsDelivr ಮತ್ತು ಟೆಂಪ್ಲೇಟ್ ಸ್ಟಾರ್ಟರ್ ಪುಟದೊಂದಿಗೆ ಸ್ಪಂದಿಸುವ, ಮೊಬೈಲ್-ಮೊದಲ ಸೈಟ್ಗಳನ್ನು ನಿರ್ಮಿಸಲು ವಿಶ್ವದ ಅತ್ಯಂತ ಜನಪ್ರಿಯ ಚೌಕಟ್ಟಾದ ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ನೊಂದಿಗೆ ಪ್ರಾರಂಭಿಸಿ.
ತ್ವರಿತ ಆರಂಭ
ನಿಮ್ಮ ಯೋಜನೆಗೆ ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ ಅನ್ನು ತ್ವರಿತವಾಗಿ ಸೇರಿಸಲು ನೋಡುತ್ತಿರುವಿರಾ? jsDelivr ಅನ್ನು ಬಳಸಿ, ಒಂದು ಉಚಿತ ತೆರೆದ ಮೂಲ CDN. ಪ್ಯಾಕೇಜ್ ಮ್ಯಾನೇಜರ್ ಅನ್ನು ಬಳಸುತ್ತಿರುವಿರಾ ಅಥವಾ ಮೂಲ ಫೈಲ್ಗಳನ್ನು ಡೌನ್ಲೋಡ್ ಮಾಡಬೇಕೆ? ಡೌನ್ಲೋಡ್ಗಳ ಪುಟಕ್ಕೆ ಹೋಗಿ .
CSS
ನಮ್ಮ CSS ಅನ್ನು ಲೋಡ್ ಮಾಡಲು ಎಲ್ಲಾ ಇತರ ಸ್ಟೈಲ್ಶೀಟ್ಗಳ ಮೊದಲು <link>
ನಿಮ್ಮ ಸ್ಟೈಲ್ಶೀಟ್ ಅನ್ನು ನಕಲಿಸಿ-ಅಂಟಿಸಿ .<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
JS
ನಮ್ಮ ಅನೇಕ ಘಟಕಗಳು ಕಾರ್ಯನಿರ್ವಹಿಸಲು ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಅನ್ನು ಬಳಸಬೇಕಾಗುತ್ತದೆ. ನಿರ್ದಿಷ್ಟವಾಗಿ, ಅವರಿಗೆ jQuery , ಪಾಪ್ಪರ್ ಮತ್ತು ನಮ್ಮದೇ ಆದ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಪ್ಲಗಿನ್ಗಳ ಅಗತ್ಯವಿರುತ್ತದೆ. ನಾವು jQuery ನ ಸ್ಲಿಮ್ ಬಿಲ್ಡ್ ಅನ್ನು ಬಳಸುತ್ತೇವೆ , ಆದರೆ ಪೂರ್ಣ ಆವೃತ್ತಿಯನ್ನು ಸಹ ಬೆಂಬಲಿಸಲಾಗುತ್ತದೆ.
ಅವುಗಳನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಲು, ಮುಚ್ಚುವ ಟ್ಯಾಗ್ನ ಮೊದಲು ನಿಮ್ಮ ಪುಟಗಳ ಕೊನೆಯಲ್ಲಿ ಈ ಕೆಳಗಿನವುಗಳಲ್ಲಿ ಒಂದನ್ನು<script>
ಇರಿಸಿ . </body>
jQuery ಮೊದಲು ಬರಬೇಕು, ನಂತರ ಪಾಪ್ಪರ್, ಮತ್ತು ನಂತರ ನಮ್ಮ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಪ್ಲಗಿನ್ಗಳು.
ಬಂಡಲ್
ಪ್ರತಿ ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಪ್ಲಗಿನ್ ಅನ್ನು ನಮ್ಮ ಎರಡು ಬಂಡಲ್ಗಳಲ್ಲಿ ಒಂದನ್ನು ಸೇರಿಸಿ. ಎರಡೂ bootstrap.bundle.js
ಮತ್ತು ನಮ್ಮ ಟೂಲ್ಟಿಪ್ಗಳು ಮತ್ತು bootstrap.bundle.min.js
ಪಾಪೋವರ್ಗಳಿಗಾಗಿ ಪಾಪ್ಪರ್ ಅನ್ನು ಸೇರಿಸಿ, ಆದರೆ jQuery ಅಲ್ಲ . ಮೊದಲು jQuery, ನಂತರ ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಬಂಡಲ್ ಅನ್ನು ಸೇರಿಸಿ. ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ನಲ್ಲಿ ಏನನ್ನು ಸೇರಿಸಲಾಗಿದೆ ಎಂಬುದರ ಕುರಿತು ಹೆಚ್ಚಿನ ಮಾಹಿತಿಗಾಗಿ, ದಯವಿಟ್ಟು ನಮ್ಮ ವಿಷಯಗಳ ವಿಭಾಗವನ್ನು ನೋಡಿ.
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
ಪ್ರತ್ಯೇಕಿಸಿ
ಪ್ರತ್ಯೇಕ ಸ್ಕ್ರಿಪ್ಟ್ ಪರಿಹಾರದೊಂದಿಗೆ ಹೋಗಲು ನೀವು ನಿರ್ಧರಿಸಿದರೆ, ಪಾಪ್ಪರ್ ಮೊದಲು ಬರಬೇಕು (ನೀವು ಟೂಲ್ಟಿಪ್ಗಳು ಅಥವಾ ಪಾಪೋವರ್ಗಳನ್ನು ಬಳಸುತ್ತಿದ್ದರೆ), ಮತ್ತು ನಂತರ ನಮ್ಮ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಪ್ಲಗಿನ್ಗಳು.
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>
ಘಟಕಗಳು
ಯಾವ ಘಟಕಗಳಿಗೆ ಸ್ಪಷ್ಟವಾಗಿ jQuery, ನಮ್ಮ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಮತ್ತು ಪಾಪ್ಪರ್ ಅಗತ್ಯವಿರುತ್ತದೆ ಎಂಬ ಕುತೂಹಲವಿದೆಯೇ? ಕೆಳಗಿನ ಶೋ ಕಾಂಪೊನೆಂಟ್ಸ್ ಲಿಂಕ್ ಅನ್ನು ಕ್ಲಿಕ್ ಮಾಡಿ. ಪುಟ ರಚನೆಯ ಬಗ್ಗೆ ನಿಮಗೆ ಖಚಿತವಿಲ್ಲದಿದ್ದರೆ, ಉದಾಹರಣೆ ಪುಟ ಟೆಂಪ್ಲೇಟ್ಗಾಗಿ ಓದುವುದನ್ನು ಮುಂದುವರಿಸಿ.
JavaScript ಅಗತ್ಯವಿರುವ ಘಟಕಗಳನ್ನು ತೋರಿಸಿ
- ವಜಾಗೊಳಿಸುವುದಕ್ಕಾಗಿ ಎಚ್ಚರಿಕೆಗಳು
- ಟಾಗಲ್ ಸ್ಟೇಟ್ಸ್ ಮತ್ತು ಚೆಕ್ಬಾಕ್ಸ್/ರೇಡಿಯೋ ಕಾರ್ಯನಿರ್ವಹಣೆಗಾಗಿ ಬಟನ್ಗಳು
- ಎಲ್ಲಾ ಸ್ಲೈಡ್ ನಡವಳಿಕೆಗಳು, ನಿಯಂತ್ರಣಗಳು ಮತ್ತು ಸೂಚಕಗಳಿಗೆ ಏರಿಳಿಕೆ
- ವಿಷಯದ ಗೋಚರತೆಯನ್ನು ಟಾಗಲ್ ಮಾಡಲು ಸಂಕುಚಿಸಿ
- ಪ್ರದರ್ಶನ ಮತ್ತು ಸ್ಥಾನೀಕರಣಕ್ಕಾಗಿ ಡ್ರಾಪ್ಡೌನ್ಗಳು ( ಪಾಪ್ಪರ್ ಸಹ ಅಗತ್ಯವಿದೆ )
- ಪ್ರದರ್ಶನ, ಸ್ಥಾನೀಕರಣ ಮತ್ತು ಸ್ಕ್ರಾಲ್ ನಡವಳಿಕೆಗಾಗಿ ಮಾದರಿಗಳು
- ಸ್ಪಂದಿಸುವ ನಡವಳಿಕೆಯನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸಲು ನಮ್ಮ ಸಂಕುಚಿಸಿ ಪ್ಲಗಿನ್ ಅನ್ನು ವಿಸ್ತರಿಸಲು Navbar
- ಸ್ಕ್ರಾಲ್ ನಡವಳಿಕೆ ಮತ್ತು ನ್ಯಾವಿಗೇಷನ್ ನವೀಕರಣಗಳಿಗಾಗಿ 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, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
<title>Hello, world!</title>
</head>
<body>
<h1>Hello, world!</h1>
<!-- Optional JavaScript; choose one of the two! -->
<!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-+sLIOodYLS7CIrQpBjl+C7nPvqq+FbNUBDunl/OZv93DB7Ln/533i8e/mZXLi/P+" crossorigin="anonymous"></script>
-->
</body>
</html>
ಒಟ್ಟಾರೆ ಪುಟದ ಅವಶ್ಯಕತೆಗಳಿಗಾಗಿ ನಿಮಗೆ ಬೇಕಾಗಿರುವುದು ಅಷ್ಟೆ. ನಿಮ್ಮ ಸೈಟ್ನ ವಿಷಯ ಮತ್ತು ಘಟಕಗಳನ್ನು ಲೇಔಟ್ ಮಾಡಲು ಪ್ರಾರಂಭಿಸಲು ಲೇಔಟ್ ಡಾಕ್ಸ್ ಅಥವಾ ನಮ್ಮ ಅಧಿಕೃತ ಉದಾಹರಣೆಗಳನ್ನು ಭೇಟಿ ಮಾಡಿ .
ಪ್ರಮುಖ ಜಾಗತಿಕಗಳು
ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ ಬೆರಳೆಣಿಕೆಯಷ್ಟು ಪ್ರಮುಖ ಜಾಗತಿಕ ಶೈಲಿಗಳು ಮತ್ತು ಸೆಟ್ಟಿಂಗ್ಗಳನ್ನು ಬಳಸಿಕೊಳ್ಳುತ್ತದೆ, ಅದನ್ನು ಬಳಸುವಾಗ ನೀವು ತಿಳಿದಿರಲೇಬೇಕು, ಇವೆಲ್ಲವೂ ಬಹುತೇಕ ಪ್ರತ್ಯೇಕವಾಗಿ ಕ್ರಾಸ್ ಬ್ರೌಸರ್ ಶೈಲಿಗಳ ಸಾಮಾನ್ಯೀಕರಣಕ್ಕೆ ಸಜ್ಜಾಗಿದೆ. ಒಳಗೆ ಧುಮುಕೋಣ.
HTML5 ಡಾಕ್ಟಿಪ್
ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ಗೆ HTML5 ಡಾಕ್ಟೈಪ್ನ ಬಳಕೆಯ ಅಗತ್ಯವಿದೆ. ಇದು ಇಲ್ಲದೆ, ನೀವು ಕೆಲವು ಮೋಜಿನ ಅಪೂರ್ಣ ಶೈಲಿಯನ್ನು ನೋಡುತ್ತೀರಿ, ಆದರೆ ಅದು ಸೇರಿದಂತೆ ಯಾವುದೇ ಗಮನಾರ್ಹವಾದ ಬಿಕ್ಕಳಿಕೆಗಳನ್ನು ಉಂಟುಮಾಡಬಾರದು.
<!doctype html>
<html lang="en">
...
</html>
ರೆಸ್ಪಾನ್ಸಿವ್ ಮೆಟಾ ಟ್ಯಾಗ್
ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ ಅನ್ನು ಮೊದಲು ಮೊಬೈಲ್ ಅನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸಲಾಗಿದೆ , ಇದರಲ್ಲಿ ನಾವು ಮೊದಲು ಮೊಬೈಲ್ ಸಾಧನಗಳಿಗೆ ಕೋಡ್ ಅನ್ನು ಆಪ್ಟಿಮೈಜ್ ಮಾಡುವ ತಂತ್ರವಾಗಿದೆ ಮತ್ತು ನಂತರ CSS ಮಾಧ್ಯಮ ಪ್ರಶ್ನೆಗಳನ್ನು ಬಳಸಿಕೊಂಡು ಅಗತ್ಯವಿರುವ ಘಟಕಗಳನ್ನು ಅಳೆಯುತ್ತೇವೆ. ಎಲ್ಲಾ ಸಾಧನಗಳಿಗೆ ಸರಿಯಾದ ರೆಂಡರಿಂಗ್ ಮತ್ತು ಟಚ್ ಝೂಮ್ ಅನ್ನು ಖಚಿತಪಡಿಸಿಕೊಳ್ಳಲು, ನಿಮ್ಮ ಗೆ ಸ್ಪಂದಿಸುವ ವ್ಯೂಪೋರ್ಟ್ ಮೆಟಾ ಟ್ಯಾಗ್ ಅನ್ನು ಸೇರಿಸಿ <head>
.
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
ಸ್ಟಾರ್ಟರ್ ಟೆಂಪ್ಲೇಟ್ನಲ್ಲಿ ನೀವು ಇದರ ಉದಾಹರಣೆಯನ್ನು ಕ್ರಿಯೆಯಲ್ಲಿ ನೋಡಬಹುದು .
ಬಾಕ್ಸ್ ಗಾತ್ರ
box-sizing
CSS ನಲ್ಲಿ ಹೆಚ್ಚು ನೇರವಾದ ಗಾತ್ರಕ್ಕಾಗಿ, ನಾವು ಜಾಗತಿಕ ಮೌಲ್ಯವನ್ನು 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-4
) ನಲ್ಲಿ ಕಾಣಬಹುದು. - ಗರಿಷ್ಠ ಅನ್ವೇಷಣೆಗಾಗಿ npm
bootstrap
ಅಥವಾ ಅಂತಹುದೇ ವಿತರಣಾ ಕಾರ್ಯವಿಧಾನಗಳ ಮೂಲಕ ವಿತರಿಸುವಾಗ ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ನ ಕಾರ್ಯವನ್ನು ಮಾರ್ಪಡಿಸುವ ಅಥವಾ ಸೇರಿಸುವ ಪ್ಯಾಕೇಜ್ಗಳಲ್ಲಿ ಡೆವಲಪರ್ಗಳು ಕೀವರ್ಡ್ ಅನ್ನು ಬಳಸಬೇಕು .
ನೀವು ಇತ್ತೀಚಿನ ಗಾಸಿಪ್ ಮತ್ತು ಅದ್ಭುತವಾದ ಸಂಗೀತ ವೀಡಿಯೊಗಳಿಗಾಗಿ Twitter ನಲ್ಲಿ @getbootstrap ಅನ್ನು ಸಹ ಅನುಸರಿಸಬಹುದು .
CSP ಗಳು ಮತ್ತು ಎಂಬೆಡೆಡ್ SVG ಗಳು
ಹಲವಾರು ಬೂಟ್ಸ್ಟ್ರ್ಯಾಪ್ ಘಟಕಗಳು ನಮ್ಮ CSS ನಲ್ಲಿ ಎಂಬೆಡೆಡ್ SVG ಗಳನ್ನು ಒಳಗೊಂಡಿದ್ದು, ಬ್ರೌಸರ್ಗಳು ಮತ್ತು ಸಾಧನಗಳಾದ್ಯಂತ ಘಟಕಗಳನ್ನು ಸ್ಥಿರವಾಗಿ ಮತ್ತು ಸುಲಭವಾಗಿ ವಿನ್ಯಾಸಗೊಳಿಸಲು. ಹೆಚ್ಚು ಕಟ್ಟುನಿಟ್ಟಾದ CSP ಕಾನ್ಫಿಗರೇಶನ್ಗಳನ್ನು ಹೊಂದಿರುವ ಸಂಸ್ಥೆಗಳಿಗಾಗಿ , ನಮ್ಮ ಎಂಬೆಡೆಡ್ SVG ಗಳ ಎಲ್ಲಾ ನಿದರ್ಶನಗಳನ್ನು ನಾವು ದಾಖಲಿಸಿದ್ದೇವೆ (ಇವುಗಳೆಲ್ಲವೂ ಮೂಲಕ ಅನ್ವಯಿಸಲಾಗಿದೆ background-image
) ಆದ್ದರಿಂದ ನೀವು ನಿಮ್ಮ ಆಯ್ಕೆಗಳನ್ನು ಹೆಚ್ಚು ಕೂಲಂಕಷವಾಗಿ ಪರಿಶೀಲಿಸಬಹುದು.
- ಮುಚ್ಚು ಬಟನ್ (ಎಚ್ಚರಿಕೆಗಳು ಮತ್ತು ಮಾದರಿಗಳಲ್ಲಿ ಬಳಸಲಾಗುತ್ತದೆ)
- ಕಸ್ಟಮ್ ಚೆಕ್ಬಾಕ್ಸ್ಗಳು ಮತ್ತು ರೇಡಿಯೋ ಬಟನ್ಗಳು
- ಫಾರ್ಮ್ ಸ್ವಿಚ್ಗಳು
- ಫಾರ್ಮ್ ಮೌಲ್ಯೀಕರಣ ಐಕಾನ್ಗಳು
- ಕಸ್ಟಮ್ ಆಯ್ಕೆ ಮೆನುಗಳು
- ಏರಿಳಿಕೆ ನಿಯಂತ್ರಣಗಳು
- Navbar ಟಾಗಲ್ ಬಟನ್ಗಳು
ಸಮುದಾಯ ಸಂಭಾಷಣೆಯ ಆಧಾರದ ಮೇಲೆ , ನಿಮ್ಮ ಸ್ವಂತ ಕೋಡ್ಬೇಸ್ನಲ್ಲಿ ಇದನ್ನು ಪರಿಹರಿಸಲು ಕೆಲವು ಆಯ್ಕೆಗಳು ಸ್ಥಳೀಯವಾಗಿ ಹೋಸ್ಟ್ ಮಾಡಿದ ಸ್ವತ್ತುಗಳೊಂದಿಗೆ URL ಗಳನ್ನು ಬದಲಾಯಿಸುವುದು, ಚಿತ್ರಗಳನ್ನು ತೆಗೆದುಹಾಕುವುದು ಮತ್ತು ಇನ್ಲೈನ್ ಚಿತ್ರಗಳನ್ನು ಬಳಸುವುದು (ಎಲ್ಲಾ ಘಟಕಗಳಲ್ಲಿ ಸಾಧ್ಯವಿಲ್ಲ) ಮತ್ತು ನಿಮ್ಮ CSP ಅನ್ನು ಮಾರ್ಪಡಿಸುವುದು. ನಿಮ್ಮ ಸ್ವಂತ ಭದ್ರತಾ ನೀತಿಗಳನ್ನು ಎಚ್ಚರಿಕೆಯಿಂದ ಪರಿಶೀಲಿಸುವುದು ಮತ್ತು ಅಗತ್ಯವಿದ್ದರೆ ಉತ್ತಮ ಮಾರ್ಗವನ್ನು ನಿರ್ಧರಿಸುವುದು ನಮ್ಮ ಶಿಫಾರಸು.