መቶኛ በስፋት የሚሰራ ድር ጣቢያ ውስጥ ስፋቱ ስሌት እንዴት እንደሚሰራ

መቶኛ ዋጋዎችን ተጠቅመው የድር አሳሾች እንዴት ማሳያውን እንደሚወስዱ ይወቁ

በርካታ ምላሽ ሰጪ የድር ዲዛይን ተማሪዎች ለትልቅ እሴቶች መቶኛ በመጠቀም በመጠቀም አስቸጋሪ ጊዜ አላቸው. በተለይም, አሳሹ እነዚህን መቶኛዎች እንዴት አድርጎ እንደሚያሰምር ግራ መጋባት አለ. ከታች ደግሞ መቶኛ እንዴት በመጠኑ ድር ጣቢያ ውስጥ ለስፋት ስሌት እንዴት እንደሚሰሩ ማብራሪያ ይሰጣል.

ለስፋት እሴት የፒክስሎች መለኪያ በመጠቀም

ፒክስሎችን እንደ ስፋት እሴት ሲጠቀሙ ውጤቶቹ በጣም ቀጥታ ናቸው. በሰነድ አርዕስት ውስጥ የአንድ ኤ.ዲ. ስፋር እሴት በ 100 ፒክሰሎች ስፋት ለማዘጋጀት CSS የሚጠቀሙ ከሆነ, በድር ጣቢያው ይዘት ወይም ግርጌ ወይም ሌሎች የየክፍሉ ዘርፎች የ 100 ፒክሰል ርዝመት ጋር ተመሳሳይ ነው. ገጽ. ፒክስሎች ፍጹም እሴት ናቸው, ስለዚህ 100 ፒክስሎች 100 ፔክሶች በየትኛውም ሰነድ ውስጥ በየትኛው አካል ውስጥ እንደሚታይ. የአጋጣሚ ነገር ሆኖ የፒክሴል ዋጋዎች ለመረዳት ቀላል ናቸው, ምላሽ ሰጪ በሆኑ ድር ጣቢያዎች ውስጥ በደንብ አይሰሩም.

ኢታ ማርዴቲ "ምላሽ ሰጪ የድር ዲዛይን" የሚለውን ቃል አዘጋጀ, ይህም ሶስት ቁልፍ ኃላፊዎችን የያዘ መሆኑን ያብራራል.

  1. ፈሳሽ ፍርግርግ
  2. የፍሉ ሚዲያ
  3. የሚዲያ መጠይቆች

እነዚህ የመጀመሪያ ሁለት ነጥቦች, ፈሳሽ ፍርግርግ እና ፈሳሽ ሚዲያዎች በፒክሴሎች ምትክ, በመጠን መለኪያዎችን በመጠቀም በመቶኛ በመጠቀም ውጤት ያገኛሉ.

ስፋት ያላቸውን እሴቶች በመቶኛ ይጠቀሙ

ለአንድ አባል ስፋቶችን ለመሥራት መቶኛዎችን ሲጠቀሙ, ይህ አካል የሚያሳየው ትክክለኛ መጠን በሰነዱ ውስጥ ካለው ቦታ ይለያያል. መቶኛዎች አንጻራዊ እሴት ናቸው, ይህም በምስልዎ ውስጥ የተቀመጠው መጠን ከሌሎች መረጃዎችዎ ጋር ይመሳሰላል ማለት ነው.

ለምሳሌ, የአንድ ምስል ስፋትን ወደ 50% ካስቀመጡት ምስሉ በግማሽ መደበኛ መጠን ያሳያል ማለት አይደለም. ይህ የተሳሳተ ግንዛቤ ነው.

ምስሉ በትክክል 600 ፒክስል ስፋት ከሆነ, በ 50% ለማሳየት የሲሲኤስ ዋጋን በመጠቀም በድር አሳሽ 300 ፒክሰሎች ርዝመት አለው ማለት አይደለም. ይህ መቶኛ እሴት በምስሉ ትክክለኛውን አምሳያ ሳይሆን ፎቶው ባለው ኤለመንት ላይ ተመስርቶ ይሰላል. መያዢያው (ክፍፍል ሊሆን ወይም ሌላ የኤችኤምኤል ክፍል ሊሆን ይችላል) 1000 ፒክስል ስፋት ከሆነ ምስሉ በ 500 ፒክሰሎች ላይ ይታያል ምክንያቱም እሴቱ ከመስተፊያው ስፋት 50% ነው. የሚያካትት ክፍል 400 ፒክሰል ስፋት ከሆነ ምስሉ በ 200 ፒክሰሎች ብቻ ነው የሚከፈተው, ምክንያቱም እሴቱ ከመካነዱ 50% ነው. በጥያቄ ውስጥ ያለው ምስል 50% መጠን ያለው ሲሆን በውስጡ የያዘውን ሙሉ በሙሉ ይወሰናል.

ያስታውሱ, ምላሽ ሰጭ ንድፍ ፈሳሽ ነው. የማያው መጠን / መሳሪያው ሲቀየር የአቀማመጥ እና መጠኖች ይቀየራሉ. ስሇዚህ በአካላዊ (አካሊዊ) እና (ላልች) ቃሊቶች ሊይ ካሰብክ, የማሸጊያ ቁሳቁሶችን እየተሞሇህ ካሇው ካርቶን ሳጥን ጋር ተመሳሳይ ነው. ሳጥኑ በዚህ ሳጥን ውስጥ ግማሽ በሆነ ሁኔታ እንዲሞላ ከተጠየቁ, የሚፈልጉት ማሸግያው መጠን እንደ ሳጥኑ መጠን ይለያያል. በድር ዲዛይን ውስጥ ላሊ መቶኛ ስፋት ተመሳሳይ ነው.

በሌሎች መቶኛዎችን መሰረት ያደረገ መቶኛ

በምስል / በመያዣው ውስጥ, ምላሽ ሰጪው ምስል እንዴት እንደሚታይ ለማሳየት ለተያዘው አካል የፒክሴል እሴቶችን እጠቀም ነበር. በተጨባጭ ግን በውስጡ የያዘው አካል ወደ መቶኛ እና ደግሞ ምስሉ ወይም ሌሎች ነገሮች በውስጣቸው በእቃው ውስጥ በመቶኛ ላይ ተመስርቶ የእነሱን ዋጋዎች ያገኛል.

ይህንን በተግባር የሚያሳይ ሌላ ምሳሌ ይኸውልዎት.

መላው መገልገያ በ "እቃ መያዢያ" (የጋራ የድረ-ገጽ ንድፍ ልምምድ) ውስጥ በመደበኛ ክፍል ውስጥ የተካተተ ድር ጣቢያ እንዳለህ ይነግሩሃል. በዛ ክፍሉ ውስጥ ሶስት ሌሎች ክፍሎች ያሉት እና በመጨረሻም እንደ 3 ቋሚ አምዶች ለማሳየት ማሳየት ያለብዎት. ያ የኤችቲኤምኤል እንዲህ ይመስላል

አሁን ያንን "የመኪና" መለኪያ መጠን 90% ለማለት የሲኤስኤልን መጠቀም ይችላሉ. በዚህ ምሳሌ, የእቃ መቆጣጠሪያው ወደ አንድ የተወሰነ እሴት እንዳላስቀመጥነው ከአካላችን ውጪ ሌላ አካል የለውም. በነባሪ, ሰውነት እንደ አሳሽ መስኮት 100% ይታያል. ስለዚህ "የመኪና" ክፍፍል መቶኛ በአሳሽ መስኮቱ መጠን ላይ የተመረኮዘ ይሆናል. ይህ የአሳሽ መስኮት በሚፈለገው መጠን ይቀየራል, ስለዚህ የዚህ "መያዣ" መጠን. ስለዚህ የአሳሽ መስኮቱ 2000 ፒክስል ስፋት ከሆነ ይህ ክፍፍል በ 1800 ፒክስሎች ውስጥ ይታያል. ይህ እንደ የ 90% (2000 x .90 = 1800) ነው የሚሰላው, ይህም የአሳሽ መጠን ነው.

በእያንዳንዱ "ኮንቴይነር" ውስጥ የተገኙት እያንዳንዳቸው በ 30% መጠን የተቀመጡ ቢሆኑ በዚህ ምሳሌ ውስጥ እያንዳንዱ 540 ፒክሰል ስፋት ይሆናል. ይህም የተገነባው 1800 ፒክሰሎች 30% (1800 x 30/540) ነው. የዚያን መያዢያኑን ብናካንነው እነዚህ ውስጣዊ ክፍፍሎች በዛው ክፍል ላይ ጥገኛ በመሆኑ ምክንያት በሚሰጡት መጠን ይለወጡ ይሆናል.

የአሳሽ መስኮቶች በ 2000 ፒክሰሎች ስፋት እንዳሉ እንገምት, ነገር ግን የመንደሩን መቶኛ በ 90% ምትክ ወደ 80% እንለውጣለን. ያም ማለት አሁን በ 1600 ፒክሰሎች ስፋት (2000 x .80 = 1600) ይሰጣል ማለት ነው. ምንም እንኳን በ 3 "ኮሎን" ክፍሎቻችን የ CSS ሲቀይርም እንኳን, እና በ 30% መተው ብንለያቸውም እንኳ, በቁጥቋቸው ውስጥ ያለው አውድ የሚለካቸው ንጥረ ነገሩ ተለውጧል ምክንያቱም አሁን በተለዋጭ መልክ ነው. እነኚህ 3 ክፍሎች አሁን እያንዳንዳቸው 480 ፒክሰሎች ርዝመታቸው, ይህም ከ 1600% 30% ወይም የመያዣው መጠን (1600 x 3030 = 480) ነው.

ይሄን የበለጠ እየወሰደ, ከእነዚህ "ኮል" ክፍሎች ውስጥ አንድ ምስል ካለ እና ምስሉ መቶኛ በመጠቀም ምስሉ መጠኑ ቢኖረው, ለሽፍሉ አውዱ ግን "ኮል" እራሱ ነው. የ "ኮላ" ክፍፍል በመጠን እንደቀየረው, በውስጡ ያለው ምስል እንዲሁ. ስለዚህ የአሳሽ መጠኑ ወይም "መያዣው" ቢቀየር በሶስት "ኮል" ክፋዮች ላይ ተጽዕኖ ይኖረዋል, ይህም በ "ኮላ" ውስጥ ያለውን የምስሉን መጠን ይቀይራል. እርስዎ እንዳዩት, ሁሉም እነዚህ ሲገናኙ ሁሉም ለትዕዛዝ-ተኮር የመጠን እሴት ይመጣል.

በድረ-ገጾች ውስጥ አንድ መቶኛ ዋጋ ስፋት ጥቅም ላይ ሲውል እንዴት አንድ ድረ-ገጽ በውስጡ ምን እንደሚሰራ ሲመለከቱ, ያ አባሉ በገጹ ማርክ ውስጥ የሚኖረውን ዐውደ-ጽሑፍ መረዳት ያስፈልገዎታል.

በማጠቃለያው

ተለዋዋጭ ድር ጣቢያዎች አቀማመጥን በመፍጠር ወሳኝ ሚና ወሳኝ ሚና ይጫወታሉ. የምስል መጠኖቹ እርስ በርስ የተዛመዱ እውነተኛ ፍሰትን ፍርግም ለመፍጠር ምስሎችን እየሰነዱ ወይም መቶኛ ስፋቶችን ተጠቅመው እየሰጡት ይሁን, እነዚህን ቅጦች እርስዎ የሚፈልጉትን መልክ ለማሳካት አስፈላጊ ይሆናል.