የቡትስትራፕ ካርዴን እንዴት ማእከል አደርጋለሁ?

2024 ደራሲ ደራሲ: Lynn Donovan | [email protected]. ለመጨረሻ ጊዜ የተሻሻለው: 2023-12-15 23:42

ተጨማሪ CSS አያስፈልግም፣ እና በ Bootstrap 4 ውስጥ በርካታ የመሃል ዘዴዎች አሉ፡

1. ጽሑፍ - መሃል ለ መሃል ማሳያ: የመስመር ውስጥ ክፍሎች.
2. mx-auto ለ መሃል ላይ ማድረግ ማሳያ፡በማሳያ ውስጥ ያሉትን ንጥረ ነገሮች አግድ፡flex (d-flex)
3. ማካካሻ-* ወይም mx-auto ጥቅም ላይ ሊውል ይችላል። መሃል ፍርግርግ አምዶች.
4. ወይም ማጽደቅ-ይዘት- መሃል በመደዳ ላይ ወደ መሃል ፍርግርግ አምዶች.

በዚህ መንገድ፣ በቡትስትራፕ ውስጥ ኤለመንቶችን እንዴት ማዕከል ያደርጋሉ?

1. አግድም አሰላለፍ. የማስነሻ ማእከል (አግድም አሰላለፍ)
2. የመሃል ጽሑፍ። ክፍሉን ብቻ ይጨምሩ.
3. የመሃል ምስል። ን በማከል ምስሉን መሃል ማድረግም ይችላሉ።
4. የመሃል ቁልፍ። ከላይ ካለው ጋር ተመሳሳይ ነው, በቀላሉ ያክሉት.
5. የመሃል አምድ። ፍሌክስቦክስን በመጠቀም የፍርግርግውን ዓምድ በሙሉ መሃል ማድረግ ይችላሉ።
6. ይዘትን አረጋግጥ።

በቡትስትራፕ 4 ውስጥ ያለውን ቁልፍ እንዴት መሃል ማድረግ እችላለሁ? ከ አጠቃቀም ጋር ቦት ማንጠልጠያ 4 በአግድም ማድረግ የምትችላቸው መገልገያዎች መሃል አግድም ህዳጎችን ወደ 'ራስ-ሰር' በማዘጋጀት ኤለመንት ራሱ። አግድም ህዳጎችን በራስ-ሰር ለማዘጋጀት mx-auto ን መጠቀም ይችላሉ። m የሚያመለክተው ህዳግ ሲሆን x የ x-ዘንግ (ግራ+ቀኝ) እና አውቶማቲክ ቅንብሩን ያመለክታል።

በዚህ መንገድ፣ ካርድን በCSS ውስጥ እንዴት ያማክራሉ?

በሲኤስኤስ ደረጃ 3 ላይ በአቀባዊ በመሃል ላይ

1. መያዣውን በአንፃራዊነት እንዲቀመጥ ያድርጉት፣ ይህም ሙሉ ለሙሉ ለተቀመጡ ንጥረ ነገሮች መያዣ መሆኑን ያስታውቃል።
2. ኤለመንቱ ራሱ ሙሉ በሙሉ እንዲቀመጥ ያድርጉት።
3. ከመያዣው ውስጥ በግማሽ መንገድ 'ከላይ: 50%' ጋር ያስቀምጡት.
4. ኤለመንቱን በራሱ ቁመት በግማሽ ለማንቀሳቀስ ትርጉም ይጠቀሙ።

ዲቪን እንዴት ማዕከል አደርጋለሁ?

ጽሑፍ-አሰላለፍ ዘዴ

1. ከወላጅ ኤለመንት (በተለምዶ መጠቅለያ ወይም መያዣ በመባል የሚታወቀው) ሊያማክሩት የሚፈልጉትን ዳይቭ ያዙሩት
2. «ጽሑፍ-አሰላለፍ፡ መሃል»ን ወደ ወላጅ አካል አዘጋጅ።
3. ከዚያ የውስጥ ዲቪውን ወደ “ማሳያ፡ መስመር ውስጥ-ብሎክ” ያቀናብሩት።