CSS فلیکس فلو کی خاصیت

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ

flex-flow ਗੁਣ ਹੇਠ ਲਿਖੇ ਗੁਣਾਂ ਦਾ ਸ਼ਾਬਦਿਕ ਸਾਰ ਹੈ:

ਟਿੱਪਣੀ:ਜੇਕਰ ਇਲੈਕਟ੍ਰੌਨਿਕ ਬਾਕਸ ਫਲੈਕਸਬਾਕਸ ਨਹੀਂ ਹੈ ਤਾਂ flex ਗੁਣ ਬੇਕਾਰ ਹੈ。

ਇਹ ਵੀ ਦੇਖੋ:

CSS ਸਿੱਖਿਆ:CSS ਫਲੈਕਸ ਬਾਕਸ

CSS ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flex ਗੁਣ

CSS ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flex-direction ਗੁਣ

CSS ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flex-basis ਗੁਣ

CSS ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flex-grow ਗੁਣ

CSS ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flex-shrink ਗੁਣ

CSS ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flex-wrap ਗੁਣ

HTML DOM ਸਲਾਹਕਾਰ ਮੁੱਲਾਂਕਣ:flexFlow ਗੁਣ

ਉਦਾਹਰਣ

ਫਲੈਕਸਬਾਕਸ ਅਂਤਰਿਕਸ਼ ਨੂੰ ਉਲਟੀ ਦਿਸ਼ਾ ਵਿੱਚ ਦਿਸਾਈ ਅਤੇ ਜ਼ਰੂਰਤ ਹੋਏ ਸਮੇਂ ਵਿੱਚ ਵੱਖ ਵੱਖ ਪਾਠੀਆਂ ਵਿੱਚ ਰੱਖੋ:

div {
  display: flex;
  flex-flow: row-reverse wrap;
}

ਸਵੈ ਮੋਹਰਾ ਕਰੋ

CSS ਗਰੇਫਟਾਂ

flex-flow: flex-direction flex-wrap|initial|inherit;

ਗੁਣ ਕੀਮਤ

ਕੀਮਤ ਵਰਣਨ
flex-direction

ਸੰਭਵ ਕੀਮਤਾਂ:

  • row
  • row-reverse
  • column
  • column-reverse
  • initial
  • inherit

ਮੂਲਤਵੀ ਕੀਮਤ "row" ਹੈ。

ਫਲੈਕਸਬਾਕਸ ਅਂਤਰਿਕਸ਼ ਦੀ ਦਿਸ਼ਾ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰੋ。
flex-wrap

ਸੰਭਵ ਕੀਮਤਾਂ:

  • nowrap
  • wrap
  • wrap-reverse
  • initial
  • inherit

ਮੂਲਤਵੀ ਕੀਮਤ "nowrap" ਹੈ。

ਫਲੈਕਸਬਾਕਸ ਅਂਤਰਿਕਸ਼ ਨੂੰ ਵੱਖ ਵੱਖ ਪਾਠੀਆਂ ਵਿੱਚ ਰੱਖਣ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰੋ。
initial ਇਸ ਗੁਣ ਨੂੰ ਉਸ ਦੀ ਮੂਲ ਕੀਮਤ ਨੂੰ ਸੈਟ ਕਰੋ। ਦੇਖੋ: initial.
inherit ਇਸ ਗੁਣ ਨੂੰ ਉਸ ਦੇ ਮਾਪੇ ਤੋਂ ਵਿਰਾਸਤ ਕਰੋ। ਦੇਖੋ: inherit.

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲਤਵੀ ਕੀਮਤ: row nowrap
ਵਿਰਾਸਤੀ ਹੈ: ਨਹੀਂ
ਐਨੀਮੇਸ਼ਨ ਬਣਾਉਣਾ: ਸਮਰਥਨ ਨਹੀਂ ਹੈ। ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧੀ ਗੁਣ.
ਵਰਜਨ: CSS3
JavaScript ਗਰੇਫਟਾਂ: object.style.flexFlow="column nowrap"

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਤਾਲਿਕਾ ਵਿੱਚ ਦਿੱਤੇ ਅੰਕ ਇਸ ਗੁਣ ਦੇ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਵਾਲੇ ਪਹਿਲੇ ਬਰਾਉਜ਼ਰ ਵਰਜਨ ਦਿਸਾਈ ਹਨ。

ਤਰਜਮਾ -webkit-、-ms- ਜਾਂ -moz- ਦੇ ਅੰਕ ਦੇ ਪਹਿਲੇ ਸਫੇਤ ਦੇ ਪ੍ਰਿਫਿਕਸ ਦੀ ਵਰਤੋਂ ਨੂੰ ਸਵੀਕਾਰ ਕਰੋ。

Chrome IE / Edge Firefox Safari Opera
29.0
21.0 -webkit-		 11.0 28.0
18.0 -moz-		 9.0
6.1 -webkit-		 17.0