ፍፁም በተቃራኒው አንጻራዊ - የሲኤስት አቀማመጥ ማብራራት

የሲኤስኤስ አቀማመጥ ከኤክስ ሃይድ (Y) እና (Y) መጋጠሚያዎች የበለጠ ነው

የሲኤስኤስ አቀማመጥን የድር ጣቢያ አቀማመጦችን ለመፍጠር ወሳኝ አካል ሆኖ ቆይቷል. እንደ Flexbox እና CSS Grid የመሳሰሉ አዲሱ የሲ.ኤ.ሲ. የቅርጸ-ቁምፊ አቀማመጥም ቢሆን እንኳን, በየትኛውም የድረ ገፅ ንድፍ አውጪ የሽያጭ አሰራር ውስጥ በጣም ጠቃሚ ቦታ አለው.

የሲ ኤስ ኤስ አቀማመጥን በሚጠቀሙበት ጊዜ ማድረግ ያለብዎት የመጀመሪያ ነገር ማድረግ ለተጠቀሰው አንድ አባል ፍፁምነት ወይም አንጻራዊ አቀማመጥ ለመጠቀም ከፈለጉ የአሳሹን (የሲሲኤስ) ንብረቱን በቦታው ለማቅረብ ነው. በእነዚህ ሁለቱ አቀማመጥ ባህሪያት መካከል ያለውን ልዩነት በሚገባ መረዳት ይኖርብዎታል.

ፍጹም እና አንጻራዊ በሆነ መልኩ በድር ዲዛይን ላይ አብዛኛውን ጊዜ ጥቅም ላይ የሚውሉ ሁለት የሲ.ኤ.ሲ.ኤን አቋም ባህሪያት ቢሆኑም አራት ቦታዎችን ወደ ቦታ ሁኔታ ይመለካሉ.

ስቴቲክ በድር ገጽ ላይ ላለ ማንኛውም አባል ነባሪ ቦታ ነው. የአንድን አባል አቀማመጥ ካልገለፁ የማይናወጥ ይሆናል. ይህም ማለት በኤችቲኤምኤል ሰነድ ውስጥ እና በመደበኛ ሰነድ ውስጥ ምን እንደሚመስል ላይ ተመስርቶ ማያ ገጹ ላይ ይታያል ማለት ነው.

እንደ ቋሚ / የቦታ አቀማመጥ ያሉ የቦታ አቀማመጥ ደንቦችን ከተጠቀሙ, ደንቦች ችላ ይባላሉ, እና በመደበኛ የሂደቶች ፍሰት ውስጥ የሚገኘው ኤለመንት ይቆያል. እንደ እውነቱ ከሆነ, ነባሩ እሴት ስለሆነ በሲኤስ ውስጥ ባለ ቋሚ አቋም ውስጥ አንድ አባል ማዘጋጀት አይፈቀድልዎትም.

Absolute የሲ.ኤስ. አቀማመጥ

ፍፁም አቀማመጥ ለመረዳት ቀላል የሆነ የሲሲኤስ አቀማመጥ ሊሆን ይችላል. በዚህ የሲሲኤስ ቋሚ ንብረቶች ይጀምራሉ:

አቀማመጥ: ፍጹም;

ይህ እሴት አሳሽው የሚቀመጥበት ማንኛውም ነገር ከመደበኛው ሰነድ ሰነድ እንዲወገድ እና በምትኩ በትክክለኛው ቦታ ላይ እንዲቀመጥ ይደረጋል. ይህ በቀድሞው ህያው ቅርበት ያለው ቅድመ አያት ቅድመ-ይሁንታ ላይ ተመስርቶ ይሰላል.

ምክንያቱም በቋሚነት የተቀመጠው ዓረፍተ ነገር ከሰነድ የመውጣት ፍሰት ስለሚወሰድ ከኤፍ ፒው በፊት ወይም ከዚያ በኋላ በእሱ ላይ ያሉ አባሎቻቸው በድረ ገፁ ላይ እንዴት እንደሚገኙ አይወስድም.

ለምሳሌ - አንጻራዊ ዋጋን በመጠቀም ቦታ የተቀመጠ ክፍፍል ቢኖራችሁ (ይህን እሴት በቅርብ ጊዜ እንመለከታለን), እና በክፍሉ ውስጥ በክፍሉ አናት 50 ፒክሰሎች ማስቀመጥ ፈልገዋል. በ "ከላይ" ንብረት ላይ ከ 50 ፒክሰል ጋር ያለውን የ "ማለቂያ" እሴት አገባብ እሴት ይጨምራሉ, እንደዚህ.

አቀማመጥ: ፍጹም; ከፍተኛ: 50 ፒክስል;

ይህ በቋሚ ቦታ የተቀመጠው ክፍል ሁልጊዜም ከሚነካካው ክፍፍል አናት በላይ 50 ፒክሰሎች ያሳያል - በመደበኛ ፍሰት ውስጥ ምንም የሚያሳየው ምንም ይሁን. የእርስዎ "ሙሉ" አቀማመጥ ያለው አቀማመጥ በአንጻራዊነት አንድውን ቦታ እንደ አውድ እና የሚጠቀሙት የመጠን እሴት አንጻራዊ ነው.

ሊጠቀሙበት የሚችሉ አራት የአቋራጭ ባህሪያት እነዚህ ናቸው:

ከላይ ወይም ከታችን መጠቀም ይችላሉ (አንድ ንጥል በእነዚህ ሁለቱም እሴቶች መሰረት መቀመጥ አይችልም) እና ወደቀኝ ወይም ወደ ግራ.

አንድ ኤለመንት ፍጹም ወደሚሆን ቦታ ከተቀመጠ ግን በዚያ ቋሚ ቅርጽ የሌላቸው ቅድመ አያቶች የላቸውም, ከዚያም ከገጹ ከፍተኛው አካል ማለትም ከሥጋዊ አካል ጋር የሚዛመድ ይሆናል.

አንጻራዊ አቀማመጥ

አንጻራዊ አቀማመጥን ቀደም ብለን ጠቅሰናል, ስለዚህ አሁን ያንን ንብረት እንመልከት.

አንጻራዊ አቀማመጥ ተመሳሳይ አራት የአቋም ደረጃዎችን እንደ ፍጹም አቀማመጥ ይጠቀማል, ነገር ግን የአንድን አባል አቀማመጥ በአቅራቢያው ቅርጽ በማይመሠክር ቅድመ-ቅፅል ቅርፅ ያለው ቅድመ-ቅምጥል (ቅርጽ) ላይ ከመቀመጥ ፈንታ ዓውዱ በመደበኛ ፍሰት ውስጥ ከሆነ የሚጀምርበት ይጀምራል.

ለምሳሌ, በድረ-ገጽዎ ላይ ሶስት አንቀጾች ካለዎት እና ሶስተኛው የ "አቀማመጥ: አንጻራዊ" ቅደም ተከተል አለው, የአሁኑ ስፍራ አሁን ባለው ቦታ ላይ ተመስርቶ የሚስተካከል ይሆናል.

አንቀፅ 1.

ምእራፍ 2

አንቀጽ 3.

ከላይ ባለው ምሳሌ, ሦስተኛው አንቀጽ ከመጠምያው አካል በስተግራ በኩል 2 ይቀመጣል, ነገር ግን ከመጀመሪያዎቹ ሁለት አንቀጾች በታች ይኖራል. በመደበኛው የሰነድ ፍሰት ውስጥ ይቀመጣል, እና በትንሹ እንዲስተካከል ይደረጋል. ወደ አቀማመጥ ካስተካከልከው; ፍጹም; ከዚያ በኋላ የሚደርሰው ማንኛውም ነገር ከዚያ በላይ ይሆናል, ምክንያቱም በመደበኛው የሰነድ ፍሰት ውስጥ አይሆንም.

በድረ-ገጾች ላይ ያሉ ንጥረ ነገሮች ብዙውን ጊዜ የቦታ ዋጋን ለማቀናጀት ጥቅም ላይ ይውላሉ: ያልተስተካከለ የንፅፅር እሴት አንጻር, ይህም ማለት በተለመደው ፍሰት የሚታይበት ሁኔታ በትክክል መቆየት ማለት ነው. ይህም የሚደረገው ያንን ክፍል እንደ ሌላ ዐውደ-ጽሑፍ ነው. ለምሳሌ, በጠቅላላ ድህረ-ገፅ (ኮንቴይተር) ("በ" (በ "ዌስተር ዲዛይን" በጣም የተለመደው) የክፍል ውስጥ እሴትን ("ኮንቴይነር") የመደብ ልዩነት ካለዎት, ክፍሉ በውስጡ ያለው ማንኛውም ነገር ጥቅም ላይ ሊውል ይችላል እሱ እንደ ቦታ አቀማመጥ ነው.

ስለ ቋሚ አቀማመጥ ምን ለማለት ይቻላል?

ቋሚ አቀማመጥ ልክ እንደ ሙሉ አቀማመጥ ነው. የአዕምሩት አቀማመጥ በተቃራኒው ሞዴል ሲሰላ ተቆጥሯል, ነገር ግን ቋሚ ክፍሎች አሁንም በዚያ ቦታ ላይ ይሰየማሉ - ልክ እንደ መውጫ ምልክት ነው . ከገጹ ላይ ሌላኛው ነገር ከዚያ ያንን ያስወጣዋል.

የዚህን ንብረት ዋጋ ለመጠቀም, እርስዎ ያዘጋጁት:

አቀማመጥ: ቋሚ

ልብ ይበሉ, በጣቢያዎ ላይ አንድ አካል ሲሰቅሉ, ድረ ገጽዎ ሲታተም በዚያ ሥፍራ ላይ ይታተማል. ለምሳሌ, የእርስዎ ገጽ ላይኛው ክፍል ላይ ተስተካክሎ ከሆነ, በሁሉም የታተመ ገፅ ላይኛው ክፍል ላይ ይታያል - ምክንያቱም ከገጹ አናት ላይ ተስተካክሏል. የታተሙ ገጾችን እንዴት ቋሚ አካላትን ማሳየት እንደሚችሉ ለመለወጥ የሚድያ ዓይነቶችን መጠቀም ይችላሉ:

@media screen {h1 # የመጀመሪያ {አቀማመጥ: ቋሚ }} @media ህትመት {h1 # የመጀመሪያ {አቀማመጥ: ያልተለመደው; }}

የመጀመሪያ ጽሑፍ በጄኒፈር ክርኒን. በጄረሚ ጊራርድ የተስተካከለው በ 1/7/16.