Агуулгын хүснэгт:

Flexbox сав гэж юу вэ?
Flexbox сав гэж юу вэ?

Видео: Flexbox сав гэж юу вэ?

Видео: Flexbox сав гэж юу вэ?
Видео: 12 - Flexbox 2024, May
Anonim

А уян хатан сав Боломжтой сул зайг дүүргэхийн тулд зүйлсийг өргөтгөх эсвэл халихаас сэргийлэхийн тулд тэдгээрийг багасгадаг. Хамгийн гол нь flexbox Байрлал нь ердийн байрлалаас ялгаатай нь чиглэл-агностик юм (босоо дээр суурилсан блок, хэвтээ байрлалтай шугам).

Үүнтэй холбогдуулан та Flexbox-ыг хэрхэн ашигладаг вэ?

Дүгнэлт

  1. Дэлгэц ашиглах: flex; уян хатан савыг бий болгох.
  2. Зүйлүүдийн хэвтээ байрлалыг тодорхойлохын тулд justify-content ашиглана уу.
  3. Зүйлүүдийн босоо байрлалыг тодорхойлохын тулд align-items-ийг ашиглана уу.
  4. Хэрэв танд мөрийн оронд багана хэрэгтэй бол flex-direction ашиглана уу.
  5. Зүйлийн дарааллыг эргүүлэхийн тулд эгнээ-урвуу эсвэл баганын урвуу утгыг ашиглана уу.

Flex савыг яаж хийх вэ? Аль нэгийг нь хэрэглэхээс өмнө flexbox өмч, та тодорхойлох хэрэгтэй a уян хатан сав таны зохион байгуулалтанд. Та уян хатан савыг бий болгох элементийн дэлгэцийн шинж чанарыг аль нэгэнд нь тохируулснаар flexbox бүдүүвчийн утгууд: уян хатан эсвэл шугаман- уян хатан . Анхны утгаараа, уян хатан зүйлсийг зүүнээс баруун тийш үндсэн тэнхлэгт хэвтээ байдлаар байрлуулна.

Ийм байдлаар Flexbox юунд ашиглагддаг вэ?

Flexbox нь элементүүдийг зэрэгцүүлж, контейнер доторх зайг хуваарилах боломжийг олгодог зохион байгуулалтын загвар юм. Уян хатан өргөн ба өндрийг ашиглан элементүүдийг хооронд нь зайг дүүргэх эсвэл хооронд нь хуваарилахын тулд тэгшлэх боломжтой бөгөөд энэ нь үүнийг хийхэд тохиромжтой хэрэгсэл болгодог. нд хэрэглэх мэдрэмжтэй дизайны системүүд.

Flex контейнер доторх үндсэн чиг баримжаа нь юу вэ?

The анхдагч дэлгэцийг хэрэглэсний дараа зохицуулалт: уян хатан үндсэн тэнхлэгийн дагуу зүүнээс баруун тийш байрлуулах зүйлсэд зориулагдсан. Доорх хөдөлгөөнт дүрс нь хэзээ юу болохыг харуулж байна уян хатан - чиглэл : багана дээр нэмэгддэг сав бүрэлдэхүүн. Та бас чадна уян хатан тохируулах - чиглэл эгнээний урвуу ба баганын урвуу.

Зөвлөмж болгож буй: