สิ่งตีพิมพ์ในหัวข้อ 'flexbox'
ท้าทาย 009–ส่วนประกอบรหัส QR🚀
โฮลา…โฮลา… ยินดีต้อนรับกลับมา!!
สมมติว่าคุณเป็นผู้เยี่ยมชมครั้งแรก ยินดีต้อนรับ! 🤩 ก่อนอื่นมาเริ่มกันด้วยการแนะนำบทความของวันนี้กันก่อน👇
ดังที่บางท่านอาจทราบ ฉันมุ่งเน้นไปที่การพัฒนา UI เมื่อสองสามสัปดาห์ก่อน และเริ่มทำสิ่งที่ท้าทายโดยใช้ HTML และ CSS จากนั้น ฉันได้ทำการท้าทายสี่ครั้ง โดยใช้ Flexbox ( Challenge 01 , Challenge 02 , Challenge 03 & Challenge 04 ) หลังจากนั้น ฉันได้ทำอีกสามความท้าทาย โดยใช้ CSS Grid( Challenge 05 , Challenge 06 & Challenge 0 7 )..
คำถามในหัวข้อ 'flexbox'
การกำหนดสไตล์ modal-title ใน bootstrap v4
ฉันกำลังพยายามจัดสไตล์เนื้อหาของชื่อกิริยา โดยจะมีรูปภาพตรงกลาง และคอลัมน์เล็กๆ สองคอลัมน์ที่มีปุ่ม/รูปภาพ 1 หรือ 2 ปุ่ม ฉันต้องการให้ทุกอย่างจัดเรียงในแนวตั้งและแนวนอน ขนาดของภาพตรงกลางจะแตกต่างกันไป ดูเหมือนว่าจะเป็นงานของ flexbox...
887 มุมมอง
schedule
17.12.2023
เมนู Flexbox ไม่ทำงานบน Safari 8 [ซ้ำกัน]
ฉันใช้ธีม WordPress พร้อมเมนูส่วนหัวที่สร้างโดยใช้ flexbox มันทำงานได้ดีบนเบราว์เซอร์รุ่นใหม่ แต่ใน Safari 8 เมนูจะหายไป
ฉันลองใช้ทางเลือกสำรองแล้ว (เช่น ตาราง css) แต่ก็ยังไม่มีอะไรเลย คุณรู้หรือไม่ว่าฉันจะแก้ไขปัญหานี้ได้อย่างไร?...
2080 มุมมอง
schedule
19.11.2023
วิธีเปลี่ยนลำดับบรรพบุรุษขององค์ประกอบลูกดิ้น
ฉันกำลังทำงานกับหน้าผลิตภัณฑ์( https://codepen.io/oleksiukmary/pen/qPLPMb?editors=1100 ) และมี 2 คอนเทนเนอร์ - เนื้อหาและรูปภาพภายในคอนเทนเนอร์ Flex สำหรับอุปกรณ์มือถือ (‹768px) ฉันต้องเปลี่ยนลำดับของบล็อกรูปภาพ (เสร็จสิ้น):
@media only screen...
94 มุมมอง
schedule
13.01.2024
วิธีห่อรายการดิ้นด้วยความกว้างคงที่
ฉันกำลังพยายามสร้างเลย์เอาต์โดยที่บล็อก div ของย่อหน้าตัดจากซ้ายไปขวา โดยแต่ละย่อหน้ามีความกว้างคงที่ บางอย่างเช่นนี้:
อย่างไรก็ตาม สิ่งที่ฉันได้รับคือ รายการดิ้นจะเรียงซ้อนกันทางด้านซ้าย:
ข้อมูลโค้ดที่นี่:
.things {...
1264 มุมมอง
schedule
21.01.2024
ปัญหาเกี่ยวกับ Flex/Flex-Flow ในเดสก์ท็อปและมือถือ
พบพฤติกรรมแปลกๆ หลังจากทดสอบเว็บไซต์แบบตอบสนองบนมือถือและหวังว่าฉันจะได้รับข้อมูลเชิงลึกเกี่ยวกับสิ่งที่เกิดขึ้น โดยพื้นฐานแล้ว ฉันมีแถวบูตสแตรปแถวเดียวที่มีรูปภาพ 23 รูป ในความละเอียด iPhone ของฉัน (375 x 667)...
500 มุมมอง
schedule
19.11.2023
ฉันจะทำให้ flexbox นี้ขยายพร้อมกับรายการดิ้นได้อย่างไร [ทำซ้ำ]
ในโค้ดตัวอย่างของฉัน โปรดคลิกที่ปุ่มสร้างเนื้อหาเพื่อทำความเข้าใจปัญหา
เมื่อคุณคลิกที่ปุ่ม คุณจะเห็นรายการ Flex( .each-result ) ทั้งหมดที่สร้างขึ้น พวกมัน เกือบ ถูกล้อมด้วย div/flexbox ( .result-container ) โดยสมบูรณ์...
95 มุมมอง
schedule
10.11.2023
flexDirection: แถวไม่ทำงานแบบโต้ตอบ
ฉันกำลังพัฒนาแอปพลิเคชันแบบรีแอคทีฟ หน้าจอแอปใดหน้าจอหนึ่งมีรายการอัลบั้ม ฉันได้แบ่งแต่ละคอนเทนเนอร์อัลบั้มออกเป็นส่วนประกอบต่างๆ ได้แก่ Card และ CardSection
การ์ดสามารถประกอบด้วย CardSections ได้หลายส่วน CardSection จะมีรูปภาพและ 2 ชื่อข้อความ...
11320 มุมมอง
schedule
05.12.2023
ควบคุมการล้นของกล่องดิ้น
ฉันกำลังพยายามสร้างส่วนโปรไฟล์บนเว็บไซต์ของฉันที่มีกล่องโปรไฟล์ 4 ช่อง:
มันดูดีบนหน้าจอขนาดใหญ่ แต่ฉันกำลังพยายามควบคุมวิธีที่กล่องห่อด้วยขนาดหน้าจอที่เล็กลง ขณะนี้กล่องต่างๆ ล้อมรอบแถวถัดไปเมื่อถึงขอบหน้าจอ ดังนั้นฉันจึงได้ 3...
125 มุมมอง
schedule
26.12.2023
ฉันจะทำให้ Flexbox Item เป็นไฮเปอร์ลิงก์ได้อย่างไร
ฉันมี 3 รายการ (กล่อง) ภายใน flexbox ของฉันที่ฉันต้องการใช้เป็นไฮเปอร์ลิงก์ อย่างไรก็ตาม เมื่อฉันใส่แท็กเข้าไป จะทำให้เลย์เอาต์เสียหายโดยสิ้นเชิง ฉันจะตั้งค่าแต่ละรายการ (กล่อง)...
5026 มุมมอง
schedule
26.10.2023
ความสูงของเด็กแบบยืดหยุ่นไม่ยืดจนเต็มความสูงของผู้ปกครอง (ใช้การยืดแบบปรับแนวเอง)
.appShopSummaryContainer {
display: flex;
flex-flow: column wrap;
}
.appShopSummaryContainer .appShopSummaryProductWrap {
flex-basis: 100%;
background: pink;
height: 100%;
width: 100%;
display: flex;
flex-flow: row...
931 มุมมอง
schedule
19.11.2023
วาดวงแหวนรอบวงกลมใน Progress Tracker
ฉันจะวาดวงแหวนรอบวงกลมในตัวติดตามความคืบหน้าเหมือนในภาพ ส่งเสียงกริ่งเป็นวงกลม ตัวติดตามความคืบหน้าจะขึ้นอยู่กับ http://nigelotoole.github.io/progress-tracker/
นี่คือตัวอย่าง https://codepen.io/anon/pen/JewMeM
โดยมีแนวทางดังนี้:...
81 มุมมอง
schedule
12.11.2023
จอแสดงผล CSS: -webkit-box ไม่ทำงานใน Internet Explorer 11
คำถาม: มีองค์ประกอบ CSS ใดที่ทำเหมือนกับ display: -webkit-box; หรือไม่ ดูเหมือนว่า IE 11 ไม่รองรับองค์ประกอบนี้ กรุณาช่วยฉันออกไป!
2453 มุมมอง
schedule
03.11.2023
ตารางที่สมเหตุสมผลของ Flexbox
ฉันกำลังพยายามสร้างตารางชิดขอบพื้นฐานแบบเดียวกันกับเฟล็กบ็อกซ์ ถ้าฉันวางภาพบางส่วนแล้วใช้ flex wrap มันจะมีลักษณะดังนี้:
#wrap {
display: flex;
flex-wrap: wrap;
max-width: 800px;
}
.box {
margin: 1px;
position: relative;...
38 มุมมอง
schedule
20.12.2023
