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

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

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

ሓሙሽተ ደረጃታት ሽቦ

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

.ኮል-4

.ኮል-ስም-4

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

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

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

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

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

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

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

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

.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

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

ሓሙሽተ ደረጃታት ሽቦ

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

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

ክልተ ዓምድታት

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

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

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

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

ኮንተይነራት

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