ኤች ቲ ኤም ኤል ነኢስፔችን እንዴት ይፍጠሩ

በኤችቲኤምኤል በኤስኤምኤስ ውስጥ ክፍሎችን እና አካላዊ ክፍሎችን ይፍጠሩ

ክፍተቶችን ለመፈጠር እና በኤችቲኤም ውስጥ የአካል ክፍሎች መለየት ለመጀመሪያው የዌብ ዲዛይነር ለመረዳት አስቸጋሪ ሊሆን ይችላል. ይህ የሆነበት ምክንያት ኤችቲኤም "የንጹህ ገጽታ ጠብታ" በመባል የሚታወቀው ንብረት አለው. በኤችቲኤምኤል ኮድ ውስጥ አንድ ቦታ ወይም 100 ቢተይቡ, ድር አሳሽ እነዚህን ክፍሎችን በአንድ ቦታ ብቻ ወደ ታች ያጠፋቸዋል. ይህ እንደ ሰነዶች (ለምሳሌ የማይክሮሶፍት ወርድ) የተለየ ነው.

ይህ የድር ጣቢያ ንድፍ አዘራዘር እንዴት እንደሚሠራ አይደለም.

ስለዚህ በድረ-ገጹ ላይ የሚታዩ ነጠላ እጦችን በ HTML እንዴት ትጨምራለህ? ይህ ጽሑፍ የተወሰኑትን የተለያዩ መንገዶች ይመረምራል.

በ CSS በኤች ቲ ኤም ኤስ ውስጥ ክፍተቶች

በእርስዎ ኤች.ቲ.ኤም.ኤል ውስጥ ክፍሎችን ለማከል የሚመረጠው ዘዴ ካስረስት ስቴሽን ሉሆች (ሲኤስሲ) ጋር ነው . CSS አንድን የድረ-ገጽ እይታን ለመጨመር ጥቅም ላይ መዋል አለበት, እና ክፍሉ የገፅ ምስላዊ ንድፍ ገጽታዎች አካል ስለሆነ, ሲቀር CSS እንዲሰራበት በፈለጉበት ቦታ ነው.

በሲኤስኤል, በንጥሎች ዙሪያ ቦታ ለመጨመር ኅዳግ ወይም የጠለፋ ባህሪያትን መጠቀም ይችላሉ. በተጨማሪ, የጽሑፍ ግቤት መጨመር ባህሪያት ወደ ጽሁፉ የፊት ክፍል ላይ ተጨማሪ ቦታን ይጨምረዋል, ለምሳሌ ገጾችን ለመግባት.

በሁሉም አንቀጾችዎ ፊት ክፍተት ለማከል የሲ.ኤስ.ሲ እንዴት መጠቀም ይቻላል. የሚከተለው ሲኤስኤስ ወደ የውጫዊ ወይም ውስጣዊ ቅጥ ገጽዎ ውስጥ ያክሉ:

p {
ጽሑፍ-ገብ ገብስ: 3 ደ;
}

ክፍቶች በ HTML ውስጥ: ከውስጠ-ፅሁፍዎ ውስጥ

ተጨማሪ ጽሁፍን ወይም ሁለት ተጨማሪ ጽሁፎችን ለመጨመር ከፈለጉ, የማይበላሽ ቦታን መጠቀም ይችላሉ.

ይህ ቁምፊ ልክ እንደ መደበኛ የመፃፊያ ቁምፊ ነው የሚሰራው, ነገር ግን አሳሹ ውስጥ አይወርድም.

በአንድ የጽሑፍ መስመር ውስጥ አምስት ቦታዎች እንዴት እንደሚታከሉ የሚያሳይ ምሳሌ ይኸውና:

ይህ ጽሑፍ በውስጡ አምስት ተጨማሪ ክፍተቶች አሉት

ኤችቲኤምኤል ይጠቀማል:

ይህ ጽሑፍ & nbsp; & nbsp; & nbsp; & nbsp; & nbsp; በውስጡ አምስት ተጨማሪ ክፍተቶች

እንዲሁም ተጨማሪ ትርፍ መስመሮችን ለመጨመር የምርት መለያውን መጠቀም ይችላሉ.

ይህ ዓረፍተ ነገር መጨረሻ ላይ






ካለበት አምስት መስመር ጋር ይሰራል




ኤችቲኤምኤል ክፍተት ማስቀመጥ ለምን መጥፎ ሐሳብ ነው?

እነዚህ አማራጮች ሁለቱም የሚሰሩ ቢሆኑ - የማይሰራጭ ክፍሉ ክፍል በእውነትም ወደ ጽሁፍዎ አዘራዘር ያሰፋዋል እና የመስመሩ መግቻዎች ከላይ ከተጠቀሰው ከአድራሻ በላይ ክፍተት ያክልሉ - ይህ በድረ-ገጹ ውስጥ ክፍተት ለመፍጠር አይነተኛ መንገድ አይደለም. እነዚህን ኤለመንቶች ወደ ኤችቲኤምኤልዎ መጨመር የገጽን (የኤች ቲ ኤም ኤል) ቅርጸት ከዕይታ ቅጦች (ሲኤስሲ) ይልቅ የ "ምስልን" ይጨምራል. ምርጥ ልምዶች, ለወደፊቱ የተለያዩ መሆን አለባቸው, ለወደፊቱ ለማሻሻል እና አጠቃላይ የፋይል መጠን እና የገፅ አፈፃፀምን ጨምሮ.

ሁሉንም ቅጦችዎን እና አዘራዘርዎን ለመገመት የውጫዊ ቅጥ ሉህ ከተጠቀሙ ከዚያ ሙሉውን የጣቢያ ገጽ መጫን ካስፈለገዎት ሁሉንም ለቀጣይ ጣቢያዎቹ መለወጥ ቀላል ነው.

መጨረሻ ላይ ያለውን የዓረፍተ ነገሩ ምሳሌ ከሶስቱ የ «መለያ» ምልክቶች ጋር በማነጻጸር መጨረሻ ላይ. በእያንዳንዱ አንቀጽ ግርጌ ላይ እንዲህ ያለ ክፍተት እንዲኖርዎት ከፈለጉ, የጠቅላላውን የኤች.ቲ.ኤም.ኤል. ኮድ በጠቅላላው ጣቢያዎ ላይ ለእያንዳንዱ አንቀጽ ማከል ያስፈልግዎታል. ይህ ያንተን ገጾች እንዲሞሉ የሚያደርግ ተጨማሪ ትርፍ ተጨማሪ እሴት ነው.

በተጨማሪም, ይህ ክፍተት በጣም ብዙ ወይም በጣም ትንሽ መሆኑን ለመወሰን ከወሰኑ እና ትንሽ ጊዜውን መቀየር ከፈለጉ, በመላው ድህረ ገፃችሁ ላይ እያንዳንዱን አንቀጽ ማረም ያስፈልግዎታል. አይ አመሰግናለሁ!

እነዚህን የተራራ ክፍሎችን ወደ ኮድዎ ከማከል ይልቅ CSS ን ይጠቀሙ.

p {
ድብዳብ-ታች: 20px;
}

ያኛው የሲኤስኤል መስመር በገጽዎ አንቀጾች ስር ተጨማሪ ክፍተት ያክልልዎታል. ወደፊት ያንን ርዝማኔ መለወጥ ከፈለጉ, ይሄንን አንድ መስመር ማርትዕ (ሙሉውን የጣቢያዎ ኮድ ይልቅ) እና እርስዎ መሄድ ይችላሉ!

አሁን, በአንድ የድር ጣቢያዎ ክፍል ውስጥ አንድ ቦታን በአንድ ቦታ ላይ ማከል ከፈለጉ የ
መለያ በመጠቀም ወይም አንድ ወጥ የሆነ ሰባሪ ቦታ የአለም መጨረሻ አይደለም, ነገር ግን ይጠንቀቁ.

እነዚህን በመስመር ውስጥ የኤችቲኤም አዘራዘር አማራጮች ተንሸራታፊ ቀዳዳዎች ሊሆኑ ይችላሉ. አንድ ወይም ሁለት ጣቢያዎን ሊጎዱ በማይችሉበት ጊዜ, ያንን መንገድ ቢቀጥሉ, በገጾችዎ ውስጥ ችግሮችን ያስተዋውቁዎታል. በመጨረሻም ወደ ኤች.ኤስ.ኤስ. የኤች.ኤስ.ኤል ክፍተት እና ወደ ሌሎች ኤች.ኤስ.