CSS ఆర్డర్ అట్రిబ్యూట్

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

order అంశం ఫ్లెక్సిబిలిటీ అంశాలకు ఒకే కంటైనర్ లోని ఇతర ఫ్లెక్సిబిలిటీ అంశాలకు వ్యతిరేకంగా క్రమాన్ని నిర్ణయిస్తుంది.

ప్రత్యామ్నాయ వివరణ:ఫ్లెక్సిబిలిటీ అంశం కాదు ఉన్న ఎల్లా అంశాలకు క్రమ అంశం చెల్లని ఉంటుంది.

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

CSS పరిశీలన హాండ్బుక్:flex అంశం

CSS పరిశీలన హాండ్బుక్:flex-basis అంశం

CSS పరిశీలన హాండ్బుక్:flex-direction అంశం

CSS పరిశీలన హాండ్బుక్:flex-flow అంశం

CSS పరిశీలన హాండ్బుక్:flex-grow అంశం

CSS పరిశీలన హాండ్బుక్:flex-shrink అంశం

CSS పరిశీలన హాండ్బుక్:flex-wrap అంశం

CSS పరిశీలన హాండ్బుక్:align-content అంశం

CSS పరిశీలన హాండ్బుక్:align-items అంశం

CSS పరిశీలన హాండ్బుక్:align-self అంశం

HTML DOM పరిశీలన హాండ్బుక్:order అంశం

ఉదాహరణ

ఫ్లెక్సిబిలిటీ అంశాల క్రమాన్ని సెట్ చేయండి:

div#myRedDIV {order: 2;}
div#myBlueDIV {order: 4;}
div#myGreenDIV {order: 3;}
div#myPinkDIV {order: 1;}

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

CSS సంకేతం

order: నంబర్|ఇనిశియల్|ఇన్హెరిట్;

అంశాల విలువ

విలువ వివరణ
నంబర్ మూల విలువ 0. ఫ్లెక్సిబిలిటీ అంశాల క్రమాన్ని నిర్ణయిస్తుంది.
ఇనిశియల్ ఈ అంశాన్ని మూల విలువకు సెట్ చేయండి. చూడండి: ఇనిశియల్.
ఇన్హెరిట్ ఈ అంశాన్ని తన పేర్పడిన ఎల్లా అంశాల నుండి పారంపర్యం చేసుకుంటుంది. చూడండి: ఇన్హెరిట్.

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

మూల విలువ 0
పారంపర్యం: నో
అనిమేషన్ తయారీ: మద్దతు ఉంది. ప్రత్యేక అంశాలను చూడండి. చూడండి:అనిమేషన్ సంబంధిత అంశాలు.
వెర్షన్: CSS3
జావాస్క్రిప్ట్ సంకేతం: object.style.order="2"

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

పట్టికలో ఉన్న సంఖ్యలు ఆ అంశాన్ని పూర్తిగా మద్దతు ఇస్తున్న మొదటి బ్రౌజర్ వెర్షన్ని పేర్కొంటాయి.

ముందుకు -webkit- లేదా -moz- సంఖ్యలను ముందుకు వాడండి ప్రత్యేకంగా ముందుకు వాడవలసిన మొదటి వెర్షన్ ఉంది.

క్రోమ్ IE / ఎంజెల్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
29.0
21.0 -webkit- 		11.0 28.0
18.0 -moz- 		9.0
6.1 -webkit- 		17.0