ඇතුළත් කර ඇති මෝස්තර සහ සංරචක මෙන්ම අඩු විචල්යයන් සහ මිශ්රණයන්ගෙන් ප්රයෝජන ගැනීමට Bootstrap දිගු කරන්න.
Bootstrap සෑදී ඇත්තේ එහි හරය අඩුවෙන්, අපගේ හොඳ මිතුරා වන Alexis Sellier විසින් නිර්මාණය කරන ලද ගතික මෝස්තර පත්ර භාෂාවකි . එය පද්ධති මත පදනම් වූ CSS සංවර්ධනය වේගවත්, පහසු සහ වඩාත් විනෝදජනක කරයි.
Bootstrap හි නිර්මාපකයෙකු මේ ගැන ඉක්මන් බ්ලොග් සටහනක් ලිවීය , මෙහි සාරාංශගත කර ඇත:
CSS හි දිගුවක් ලෙස, LESS හි විචල්යයන්, නැවත භාවිත කළ හැකි කේත කොටස් සඳහා මිශ්රණයන්, සරල ගණිතය සඳහා මෙහෙයුම්, කැදැල්ල සහ වර්ණ ශ්රිත පවා ඇතුළත් වේ.
වැඩිදුර දැන ගැනීමට http://lesscss.org/ හි නිල වෙබ් අඩවියට පිවිසෙන්න .
අපගේ CSS අඩුවෙන් ලියා ඇති අතර විචල්යයන් සහ මිශ්රණයන් භාවිතා කරන බැවින්, අවසාන නිෂ්පාදන ක්රියාත්මක කිරීම සඳහා එය සම්පාදනය කළ යුතුය. මෙන්න මෙහෙමයි.
විධාන රේඛාව හරහා සම්පාදනය කිරීම සඳහා GitHub හි ව්යාපෘති readme හි උපදෙස් අනුගමනය කරන්න .
නවතම Les.js බාගත කර එයට (සහ Bootstrap) මාර්ගය ඇතුළත් කරන්න <head>
.
<link rel = "stylesheet/less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>
.less ගොනු නැවත සම්පාදනය කිරීමට, ඒවා සුරකින්න සහ ඔබේ පිටුව නැවත පූරණය කරන්න. Less.js ඒවා සම්පාදනය කර දේශීය ගබඩාවේ ගබඩා කරයි.
නිල නොවන Mac යෙදුම .less ගොනු නාමාවලි නරඹන අතර නැරඹූ .less ගොනුවක සෑම සුරැකුමකින්ම පසුව දේශීය ගොනු වෙත කේතය සම්පාදනය කරයි. ඔබ කැමති නම්, ඔබට ස්වයංක්රීයව කුඩා කිරීම සඳහා යෙදුම තුළ මනාප ටොගල කළ හැකි අතර සම්පාදනය කරන ලද ගොනු අවසන් වන්නේ කුමන නාමාවලියෙහිද යන්න.
Crunch යනු Adobe Air මත ගොඩනගා ඇති විශිෂ්ට පෙනුමක් ඇති අඩු සංස්කාරකයක් සහ සම්පාදකයකි.
නිල නොවන Mac යෙදුම ලෙස එකම පුද්ගලයා විසින් නිර්මාණය කරන ලද, CodeKit යනු LESS, SASS, Stylus සහ CoffeeScript සම්පාදනය කරන Mac යෙදුමකි.
මැක්, ලිනක්ස්, සහ වින්ඩෝස් ඇප් එක අඩුවෙන් ගොනු සම්පාදනය කිරීම සඳහා. තවද, මූලාශ්ර කේතය GitHub මත ඇත.
සම්පාදනය කරන ලද හෝ කුඩා කළ CSS සහ JS තුළට දැමීමෙන් ඕනෑම වෙබ් ව්යාපෘතියක් ඉක්මනින් ආරම්භ කරන්න. පහසු වැඩිදියුණු කිරීම් සහ නඩත්තුව ඉදිරියට යාම සඳහා වෙන වෙනම අභිරුචි මෝස්තර මත ස්තරය කරන්න.
නවතම සම්පාදනය කරන ලද Bootstrap බාගත කර ඔබේ ව්යාපෘතියට ඇතුල් කරන්න. උදාහරණයක් ලෙස, ඔබට මෙවැනි දෙයක් තිබිය හැක:
යෙදුම/ පිරිසැලසුම්/ සැකිලි/ මහජන/ css/ bootstrap.min.css js/ bootstrap.min.js img/ glyphicons-halflings.png glyphicons-halflings-white.png
ආරම්භ කිරීමට පහත පාදක HTML පිටපත් කරන්න.
- <html>
- <හිස>
- <title> Bootstrap 101 සැකිල්ල </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- </head>
- <ශරීරය>
- <h1> ආයුබෝවන්, ලෝකය! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- </body>
- </html>
ඔබේ වෙනම CSS සහ JS ගොනු සමඟ Bootstrap ඔබේම කර ගැනීමට අවශ්ය පරිදි ඔබේ අභිරුචි CSS, JS සහ තවත් දේවල වැඩ කරන්න.
- <html>
- <හිස>
- <title> Bootstrap 101 සැකිල්ල </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- <!-- ව්යාපෘතිය -->
- <link href = "public/css/application.css" rel = "stylesheet" >
- </head>
- <ශරීරය>
- <h1> ආයුබෝවන්, ලෝකය! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- <!-- ව්යාපෘතිය -->
- <script src = "public/js/application.js" ></script>
- </body>
- </html>