Style flex గుణం

నిర్వచనం మరియు వినియోగం

flex గుణం అనునది అంశం నిర్ణయించునది. అది అదే కంటైనర్ లోని ఇతర లోపలి అంశాల వంటి పొడవును ప్రతిబింబిస్తుంది.

flex గుణం అనునది flexGrow, flexShrink మరియు flexBasis గుణాల కుదించిన గుణం.

ప్రత్యామ్నాయం:ఇది లోపలి అంశం కాది అయితే flex గుణం చెల్లనిది.

మరింత చూడండి:

CSS పరిశీలన పాఠకం:flex అనునది గుణం

HTML DOM STYLE పరిశీలన పాఠకం:flexBasis గుణం

HTML DOM STYLE పరిశీలన పాఠకం:flexDirection గుణం

HTML DOM STYLE పరిశీలన పాఠకం:flexFlow గుణం

HTML DOM STYLE పరిశీలన పాఠకం:flexGrow గుణం

HTML DOM STYLE పరిశీలన పాఠకం:flexShrink గుణం

HTML DOM STYLE పరిశీలన పాఠకం:flexWrap గుణం

ఉదాహరణ

అన్ని లోపలి అంశాల పొడవును సమానంగా చేయండి, అన్ని విషయాలను కనిపించనివి అయినప్పటికీ:

for (i = 0; i < y.length; i++) {
  y[i].style.flex = "1";
}

స్వయంగా ప్రయోగించండి

సంకేతం

flex గుణాన్ని పునఃవాస్తవీకరించునది:

object.style.flex

flex గుణాన్ని నిర్ణయించునది:

object.style.flex = "flex-grow flex-shrink flex-basis|auto|initial|inherit"

గుణాన్ని విధానం

విధానం వివరణ
flex-grow సంఖ్య, అంటే అంశం ఇతర లోపలి సహకారి అంశాల వంటి పొడవు పెంచునది.
flex-shrink సంఖ్య, అంటే అంశం ఇతర లోపలి సహకారి అంశాల వంటి పొడవు నియంత్రణను నిర్ణయించునది.
flex-basis

అంశం పొడవు

ప్రమాణిక విధానం: "auto", "inherit", లేదా "%", "px", "em" కొరకు యూనిట్లు లేదా మరే ఇతర పొడవు యూనిట్లు.
auto అనునది 1 1 auto.
initial అనునది 0 1 auto. అప్రమేయ విధానానికి చూడండి.
none అనునది 0 0 auto.
inherit తన పూర్వీక అంశం నుండి ఈ గుణాన్ని పాటించునది. చూడండి: inherit.

సాంకేతిక వివరాలు

అప్రమేయ విధానం: 0 1 auto
పునఃవాస్తవీకరణ విధానం: పదం అనునది అంటే కెముక అంశం యొక్క flex అనునది గుణం.
CSS సంస్కరణలు: CSS3

బ్రౌజర్ మద్దతు

క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
క్రోమ్ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఆపెరా
మద్దతు 11.0 మద్దతు 9.0 మద్దతు