Bootstrap - ምንድን ነው? Twitter Bootstrap - የድር ጣቢያ ዲዛይን እና ልማት

ዝርዝር ሁኔታ:

Bootstrap - ምንድን ነው? Twitter Bootstrap - የድር ጣቢያ ዲዛይን እና ልማት
Bootstrap - ምንድን ነው? Twitter Bootstrap - የድር ጣቢያ ዲዛይን እና ልማት
Anonim

ከድር ዲዛይን መስክ ጋር ቢያንስ የሚሰሩ እና ጣቢያዎችን የመፍጠር እና የመንደፍ ሂደትን የሚያውቁ፣ በቅርብ ጊዜ ይዘትዎን የማየት እድሉ ምን ያህል እንደደረሰ ያውቃሉ። ለሲኤስኤስ፣ ጃቫ ስክሪፕት እና ፍላሽ ቴክኖሎጂዎች ምስጋና ይግባውና አንድ ላይ ተጣምረው ማንኛውም ጣቢያ ወደ እውነተኛ ድንቅ ስራ፣ የዘመናዊ ጥበብ ስራ አይነት ሊቀየር ይችላል። እና በእርግጥ ፣ ብዙ ንድፍ አውጪዎች ይህንን እያደረጉ ነው ፣ እና ብዙ ቁጥር ያላቸው ኩባንያዎች በሚያስደንቅ ግራፊክስ የፖርታሎች ልማትን በልግስና ይሰጣሉ። ከዚህም በላይ የገጹ "ዋው-ውጤት" በተለያዩ ተፅዕኖዎች ስብስብ ብቻ ሳይሆን በቀላል ግን በሚያምር ሽግግሮች፣ በመረጃዎች፣ በሊንኮች እና በሌሎችም እገዛ ማግኘት ይቻላል።

bootstrap ምንድን ነው
bootstrap ምንድን ነው

እውነት ነው፣ ማንኛውም ዲዛይነር እና የአቀማመጥ ዲዛይነር ማንኛውንም ሃብት በሚለማበት ጊዜ ጊዜን ለመቆጠብ የተወሰነ መሰረት፣ አብነት ሊኖርዎት እንደሚገባ ያውቃል በዚህም መሰረት የመጨረሻውን "ዋና ስራ" መፍጠር ይችላሉ። Bootstrap የተፈጠረው ለዚህ ነው፡ ዛሬ ጊዜን ለመቆጠብ እና ነገሮችን በሺዎች ለሚቆጠሩ የድር ዲዛይነሮች ቀላል ለማድረግ ይረዳል።

Bootstrap - ምንድን ነው?

ስለዚህ የምርቱ መግለጫ ከአጠቃላይ ባህሪያቱ መጀመር አለበት። ስለዚህ, Bootstrap በአንድ ስብስብ ውስጥ የተገለጸ መድረክ መሆኑን እናስተውላለንለጣቢያው የመጀመሪያ አብነቶች. እያንዳንዱ ግራፊክስ፣ ሲኤስኤስ እና በእርግጥ HTML ያካትታል።

የትዊተር ቡትስስትራፕ
የትዊተር ቡትስስትራፕ

ሙሉው ስብስብ በአንድ ማህደር ውስጥ ነው የሚመጣው፣ይህም ከመድረክ ኦፊሴላዊ ገፅ በነፃ ማውረድ ይችላል። ስለዚህ ማንኛውም ሰው ጣቢያቸውን ማልማት የሚፈልግ ይህንን ስብስብ ሊጠቀም ይችላል እና እያንዳንዱን ገጽ ከባዶ መጻፍ አያስፈልገውም, መሰረታዊ ድርጊቶችን ያደርጋል: ጣቢያውን ምልክት ማድረግ, ብሎኮችን መስበር, ለመሠረታዊ አዶዎች ግራፊክስ መምረጥ, ወዘተ. በተመሳሳይ ጊዜ፣ እያንዳንዱ የTwitter Bootstrap ስብስብ በጣም ግላዊ ነው። እኛ ከለመድናቸው አብነቶች በተለየ በውስጡ መወገድ ወይም መተካት የሚያስፈልገው ምንም ያልተለመደ ነገር የለም። ንድፍ አውጪው በBootstrap ላይ በቀጥታ የልጁን ልጅ መፍጠር ይችላል።

ድር ጣቢያ መገንባት እንዴት ይጀምራል?

ስለዚህ፣ ከመድረክ ራሱ ጋር ቀደም ብለን እናውቀዋለን፣ አሁን የእርስዎን ልዩ ድረ-ገጽ እንዴት ማዳበር እንደሚችሉ ወደ እንቀጥል። ለመጀመር በእርግጥ ማህደሩን በTwitter Bootstrap አብነት ማውረድ ያስፈልግዎታል። በጣም ትንሽ ቦታ ይወስዳል፣ እና በGetBootstrap ገጽ ላይ ሊያገኙት ይችላሉ። እዚያም ለጣቢያው የሚያስፈልጉትን የብሎኮች አቀማመጥ መምረጥ ይችላሉ. ለምሳሌ፣ በአንድ ስእል፣ ተንሸራታች፣ በርካታ አርእስቶች፣ ቅድመ-ቅምጥ ውጤቶች፣ ወዘተ ያሉት በማረፊያ-ገጽ መልክ ገፆች አሉ። ምርጫ ማድረግ እና በ Bootstrap መሰረት የተፈጠረውን ለጣቢያዎ ተስማሚ የሆነውን ማህደር ማውረድ ብቻ ያስፈልግዎታል። ይህ ስብስብ ምንድነው፣ ከወረዱ በኋላ ወዲያውኑ ያያሉ።

የቡት ማሰሻ ምናሌ
የቡት ማሰሻ ምናሌ

ጭብጡን ማበጀት

እያንዳንዱ ርዕስ እራሱን እንደማንኛውም ጣቢያ ይወክላል፣የኤችቲኤምኤል, የሲኤስኤስ እና የግራፊክስ ፋይሎች ስብስብ. የመድረክ አዘጋጆች የንድፍ ደንቦቹን ወደ ተመሳሳይ ደረጃዎች ለማምጣት ጥረት አድርገዋል፣ ጭብጥዎን ለማበጀት ከፍተኛውን እድል እየሰጡ። ስለዚህ, ጣቢያዎን ልዩ ለማድረግ, የመድረኩን መዋቅር, በእሱ ላይ ያለውን የጣቢያው አርክቴክቸር እና የእያንዳንዱ አብነት ኮድ እንዴት እንደሚጻፍ መረዳት ያስፈልግዎታል. ይህንን አንድ ጊዜ ማድረግ ያስፈልግዎታል, ከዚያ በኋላ Bootstrapን በመጠቀም ፕሮጀክቶችዎን መፍጠር ቀላል ይሆናል. CSS እና ግራፊክስ በሁሉም ጭብጦች ላይ አንድ አይነት ናቸው። ይህ የዚህ አቀራረብ ተጨማሪ ነው።

የምንፈልገው የጭብጡ ስም ያለው የሲኤስኤስ ፋይል ብቻ ነው (በ"css" አቃፊ ውስጥ ተቀምጧል ከሱ በተጨማሪ የመድረክ መሰረታዊ መቼቶች ሁለት ተጨማሪ ፋይሎችን ያገኛሉ ። ብቻቸውን ሊተዋቸው ይችላሉ); እንዲሁም ዋናው ገጽ ምልክት የሆነው "index.html" ነው. ከዚህ መጀመር አለብህ, እና ሌሎች የተወሰኑ ተጨማሪዎች በተንሸራታቾች መልክ, አንዳንድ የጃቫስክሪፕት ውጤቶች አንድ የተወሰነ ጣቢያ ለመፍጠር በእርስዎ ተግባር አስቀድመው ይወሰናሉ. ለምሳሌ፣ በመደበኛው የቡትስትራፕ አብነት ውስጥ፣ ምናሌው በደበዘዘ ግራጫ ቀለም ሊዘጋጅ ይችላል። ለጣቢያዎ, በእርግጥ, በትክክለኛው ቀለም እና በሁሉም ተፈላጊ ውጤቶች እንዲሰራ ይለውጡታል. ይህ በጣም ማበጀት ነው፣ ነገር ግን ቡትስትራፕ ስላለ፣ ጊዜን የሚቆጥብ ምናሌ መፍጠር አያስፈልግም።

ቡትስትራፕ css
ቡትስትራፕ css

እድሎች ለዲዛይነሮች

በእውነቱ፣ አሁን የBootstrap መድረክ ስለሚሰጣቸው እድሎች። እነዚህ ተስፋዎች ምንድን ናቸው - ከእንደዚህ ዓይነት ማህደሮች ጋር ለመስራት? የሚመስለው ለምንድነው በጣም አስደናቂ የሆኑት?

ፖእንደ እውነቱ ከሆነ, ከትዊተር በገንቢ መድረክ ውስጥ እንደዚህ ያለ ነገር የለም. ሀሳቡ እጅግ በጣም ቀላል ነው, ልክ እንደ አተገባበሩ. አሁን ግን ዲዛይነር የጣቢያ ገጽን ከባዶ መፍጠር የለበትም, ከዚያም የሚፈለገውን መልክ ለመስጠት. የለም, አሁን ልዩ ባለሙያተኛ ከቅርፊቱ, ከጣቢያው ንድፍ, እንደ ዋናው ማርክ የመሳሰሉ መሰረታዊ ነገሮች ሳይረበሹ በቀጥታ ሊጀምር ይችላል. ይህ ውጤታማ እና ቀልጣፋ የጊዜ አጠቃቀም ምሳሌ አይደለም?

በተጨማሪም የBootstrap ሌላ ጥቅም አልተገለጸም - ይህ ከፍተኛ ደረጃ የሲኤስኤስ ማርክ ችሎታ የሌላቸው ሰዎች የራሳቸውን ሙያዊ ንድፍ እንዲፈጥሩ የሚረዳበት መንገድ ነው ምክንያቱም የአቀማመጥ ዲዛይነር ሊሆኑ የሚችሉ ሁሉም መሳሪያዎች በጥያቄ ውስጥ ባሉ አብነቶች ውስጥ ፍላጎት ቀድሞውኑ አለ። ስለ ድረ-ገጾች ግንባታ የሚያውቅ ሰው ብዙ ተጨማሪ ችሎታ አለው. እና ይሄ ቀድሞውኑ ለBootstrap ሞገስ ትልቅ ጠቀሜታ ነው።

አሁን ፕሮጀክቱ በ2011 ቢጀመርም እና ከዚያን ጊዜ ጀምሮ በሺህ የሚቆጠሩ ሰዎች በመስራት ላይ ይገኛሉ። ገንቢዎች የድር ዲዛይን ቀላል ማድረጋቸውን እንደሚቀጥሉ እና ሰዎች አዲስ፣ ግላዊ እና ለአለም ጠቃሚ የሆነ ነገር እንዲፈጥሩ እንደሚረዳቸው ተስፋ እናድርግ።

የሚመከር: