ኣብነታት ሽቦ ቡትስትራፕ

መሰረታዊ ኣቀማምጣ ሽቦ ኣብ ውሽጢ ስርዓት ሽቦ ቡትስትራፕ ምስ ህንጸት ንኽትላለ።

ኣብዞም ኣብነታት .themed-grid-colገለ ቴማ ንምውሳኽ እቲ ክፍሊ ኣብ ዓምድታት ይውሰኽ። እዚ ብነባሪ ኣብ Bootstrap ዝርከብ ክፍሊ ኣይኮነን።

ሓሙሽተ ደረጃታት ሽቦ

ን Bootstrap grid system ሓሙሽተ ደረጃታት ኣለዉ፣ ንነፍሲ ወከፍ እንድግፎም ደረጃ መሳርሒታት ሓደ። ነፍሲ ወከፍ ደረጃ ካብ ዝተሓተ መጠን ቪውፖርት ይጅምርን እንተዘይተገሊፉ ብኣውቶማቲክ ኣብቶም ዓበይቲ መሳርሒታት ይምልከት።

.ኮል-4

.ኮል-ስም-4

.col-md-4 ዝብል ጽሑፍ ኣሎ።

.col-lg-4 ዝብል ጽሑፍ ኣሎ።

.col-xl-4 ዝብል ጽሑፍ ኣሎ።

.col-xxl-4 ዝብል ጽሑፍ ኣሎ።

ሰለስተ ማዕረ ዓምድታት

ካብ ዴስክቶፕ ጀሚርካ ናብ ዓበይቲ ዴስክቶፕ ዝዓቢ ሰለስተ ማዕረ ስፍሓት ዘለዎም ዓምድታት ርኸብ ። ኣብ ሞባይል መሳርሒታት፡ ጣብላታትን ትሕቲኡን፡ እቶም ዓምድታት ብኣውቶማቲክ ክድምር እዮም።

.col-md-4 ዝብል ጽሑፍ ኣሎ።

ሰለስተ ማዕረ ዓምድታት ኣማራጺ

ነቶም ክፍልታት ብምጥቃም .row-cols-*ብቐሊሉ ማዕረ ዓምድታት ዘለዎ ሽቦ ክትፈጥር ትኽእል።

.colውላድ ናይ... .row-cols-md-3

ሰለስተ ዘይምዕሩይ ዓምድታት

ካብ ዴስክቶፕ ጀሚርካ ናብ ዝተፈላለየ ስፍሓት ዘለዎም ዓበይቲ ዴስክቶፕ ምዕባይን ሰለስተ ዓምድታት ርኸብ ። ዓምድታት ሽቦ ንሓደ ልኡም ብሎክ ክሳብ ዓሰርተ ክልተ ክድመር ከምዘለዎም ኣይትረስዕ። ካብኡ ንላዕሊ ድማ፡ ዓምድታት ድማ ቪውፖርት ብዘየገድስ ክድምር ይጅምሩ።

.col-md-3 ዝብል ጽሑፍ ኣሎ።

.col-md-6 ዝብል ጽሑፍ ኣሎ።

.col-md-3 ዝብል ጽሑፍ ኣሎ።

ክልተ ዓምድታት

ካብ ዴስክቶፕ ጀሚርካ ናብ ዓበይቲ ዴስክቶፕ ምዕባይ ክልተ ዓምድታት ረኸብ ።

.col-md-8 ዝብል ጽሑፍ ኣሎ።

.col-md-4 ዝብል ጽሑፍ ኣሎ።

ምሉእ ስፍሓት፣ ንጽል ዓምዲ

ንሙሉእ ስፍሓት ዘለዎም ባእታታት ዝኾነ ዓይነት ናይ ሽቦ ክፍሊ ኣየድልን።

ክልተ ዓምድታት ምስ ክልተ ዝተሰፈሩ ዓምድታት

ብመሰረት ሰነድ፡ ምድቃል ቀሊል እዩ-ኣብ ውሽጢ ሓደ ዝጸንሐ ዓምዲ መስርዕ ዓምድታት ጥራይ ኣቐምጥ። እዚ ካብ ዴስክቶፕ ጀሚርካ ናብ ዓበይቲ ዴስክቶፕ ዝዓቢ ክልተ ዓምድታት ይህበካ ፣ ምስ ካልኦት ክልተ (ማዕረ ስፍሓት) ኣብ ውሽጢ እቲ ዝዓበየ ዓምዲ።

ኣብ ዓቐናት ሞባይል መሳርሒታት፡ ጣብላታትን ንታሕቲን፡ እዞም ዓምድታትን ዝተሰፍሩ ዓምድታቶምን ክድምር እዩ።

.col-md-8 ዝብል ጽሑፍ ኣሎ።

.col-md-6 ዝብል ጽሑፍ ኣሎ።

.col-md-4 ዝብል ጽሑፍ ኣሎ።

ዝተሓዋወሰ: ሞባይልን ዴስክቶፕን።

Bootstrap v4 grid system ሓሙሽተ ደረጃታት ክፍልታት ኣለዉዎ፡ xs (ተወሳኺ ንእሽቶ፡ እዚ class infix ኣብ ጥቕሚ ኣይውዕልን)፡ sm (ንእሽቶ)፡ md (ማእከላይ)፡ lg (ዓቢ)፡ ከምኡ’ውን xl (ተወሳኺ ዓቢ)። ዳርጋ ዝኾነ ውህደት ናይዞም ክፍልታት ተጠቒምካ ዝያዳ ዳይናሚክን ተዓጻጻፍን ኣቀማምጣ ክትፈጥር ትኽእል ኢኻ።

ነፍሲ ወከፍ ደረጃ ክፍልታት ይዓቢ፣ ማለት ንmd፣ lgን xlን ተመሳሳሊ ስፍሓት ክትሰርዕ እንተሓሲብካ፣ md ጥራይ ኢኻ ምግላጽ ዘድልየካ።

.col-md-8 ዝብል ጽሑፍ ኣሎ።

.ኮል-6 .ኮል-ምድ-4

.ኮል-6

ዝተሓዋወሰ: ሞባይል: ጣብላ: ከምኡውን ዴስክቶፕ

.ኮል-ስም-6 .ኮል-ልግ-8

.ኮል-6 .ኮል-ልግ-4

.ኮል-6 .ኮል-ስም-4

ጐዳጉዲ

ምስ .gx-*ክፍልታት፡ እቶም ኣግማድ ጐዳጉዲ ክስተኻኸሉ ይኽእሉ።

.colምስ .gx-4ጐዳጉዲ

ነቶም ክፍልታት ተጠቒምካ .gy-*ነቶም ቀጥ ዝበሉ ጐዳጉዲ ንምቁጽጻር።

.colምስ .gy-4ጐዳጉዲ

ምስ .g-*ክፍልታት፡ እቶም ብኽልቲኡ ኣንፈት ዘለዉ ጐዳጉዲ ክስተኻኸሉ ይኽእሉ።

.colምስ .g-3ጐዳጉዲ

ኮንተይነራት

ኣብ Bootstrap v4.4 ዝተወሰኹ ተወሳኺ ክፍልታት ክሳብ ሓደ ፍሉይ ነጥቢ ምብታኽ 100% ስፍሓት ዘለዎም ኮንተይነራት የኽእሉ። v5 ሓድሽ ናይ xxlምብታኽ ነጥቢ ይውስኽ።

.ኮንተይነር

.ኮንተይነር-ስም

.ኮንተይነር-md

.ኮንተይነር-lg

.ኮንተይነር-xl

.ኮንተይነር-xxl

.መትሓዚ-ፈሳሲ

ኣብነታት ሽቦ ቡትስትራፕ

ሓሙሽተ ደረጃታት ሽቦ

ሰለስተ ማዕረ ዓምድታት

ሰለስተ ማዕረ ዓምድታት ኣማራጺ

ሰለስተ ዘይምዕሩይ ዓምድታት

ክልተ ዓምድታት

ምሉእ ስፍሓት፣ ንጽል ዓምዲ

ክልተ ዓምድታት ምስ ክልተ ዝተሰፈሩ ዓምድታት

ዝተሓዋወሰ: ሞባይልን ዴስክቶፕን።

ዝተሓዋወሰ: ሞባይል: ​​ጣብላ: ከምኡውን ዴስክቶፕ

ጐዳጉዲ

ኮንተይነራት

ዝተሓዋወሰ: ሞባይል: ጣብላ: ከምኡውን ዴስክቶፕ