ሲ.ኤስ.ኤስ. የድረ-ገጾችን ገፅታ ለመግለጽ ቋንቋ የሆነ የካስካዲንግ የቅጥ ሉህ ነው ፡፡ ከሲ.ኤስ.ኤስ.ኤ ዋና ዋና ጥቅሞች አንዱ የጠረጴዛን አቀማመጥ በብሎክ አቀማመጥ የመተካት ችሎታ ነው ፡፡
አስፈላጊ ነው
የኤችቲኤምኤል ኮድ አርታዒ
መመሪያዎች
ደረጃ 1
የመጀመሪያውን ማገጃ ይፍጠሩ. በኤችቲኤምኤል ቅፅ ፣ ከ ‹መታወቂያ‹ block01 ›ጋር የዲቪ መለያ መስጠት ይመስላል ፡፡ እዚህ ፣ የብሎክ 01 መለያው በሲ.ኤስ.ኤስ መግለጫው ውስጥ የዚህ ብሎክ ሁሉም ባህሪዎች ለ # ብሎክ 01 መራጩ እንደተገለጹ ያሳያል ፡፡
ደረጃ 2
እገዳውን በሲ.ኤስ.ኤስ ውስጥ ይግለጹ ፡፡ በ CSS ቅጦች ውስጥ የመታወቂያውን ስም ይግለጹ (# block01) እና በመጠምዘዣ ማሰሪያዎች ውስጥ የእሱን መለኪያዎች - ስፋት ፣ አቀማመጥ ፣ ማካካሻ ፣ የጀርባ ቀለም ፣ ወዘተ ይግለጹ ፡፡ ለምሳሌ ፣ እንደዚህ ሊመስል ይችላል # block01 {width: 150px; ቁመት: 150px; አቀማመጥ: ፍጹም; ከላይ 0px; ግራ 0px; የጀርባ-ቀለም-ሮዝ}. ይህ መግለጫ ሳጥኑ 150 ፒክሰሎች ርዝመትና 150 ፒክስል ስፋት እንደሚሆን ያስባል ፣ በሰነዱ የላይኛው ግራ ጥግ ላይ በጥብቅ ይቀመጣል ፣ ዳራውም ሀምራዊ ቀለም ይኖረዋል ፡፡
ደረጃ 3
ማገጃውን አንፃራዊ አቀማመጥ ይስጡ። በ CSS መግለጫው ውስጥ ፍጹም ያልሆነን ፣ ግን አንጻራዊ አቀማመጥን የማይጠቀሙ ከሆነ ፣ ከዚያ እገዳዎችን ወደ መጋጠሚያዎች ፍርግርግ በጥብቅ ሳይሆን ፣ ከዚያ ቀደም ካሉ ነባር ብሎኮች አንጻር ብሎኮችን ማስቀመጥ ይችላሉ ፡፡ ይህንን ለማድረግ የኮዱን አቀማመጥ ይቀይሩ-ፍጹም; ከላይ 0px; በግራ 0px በአቀማመጥ አንፃራዊ; ከላይ: 200 ፒክስል; ግራ: 100 ፒክስል
ደረጃ 4
ማገጃውን አንድ ዙር ይስጡ ፡፡ በሲ.ኤስ.ኤስ ውስጥ የድንበር-ራዲየስ መግለጫ ለዚህ ተጠያቂ ነው ፡፡ የሚከተለውን ኮድ በቅጥ ሉህዎ ላይ ያክሉ ድንበር-ራዲየስ 8 ፒክስል። ማገጃው አሁን የተጠጋጋ ማዕዘኖች ይኖሩታል ፡፡ አንዳንድ ማዕዘኖችን ብቻ ማዞር ከፈለጉ ራዲየሱን ለእያንዳንዳቸው በተናጠል ይግለጹ-ድንበር-ራዲየስ 8px 8px 0px 0px.
ደረጃ 5
ማገጃውን ምት ይስጡ ፡፡ የአንድ ስስለት መስመርን በቀጭኑ መስመር ለማጉላት የሚከተለውን ኮድ ወደ ሲ.ኤስ.ኤስ መግለጫው ያክሉ-ድንበር-አናት-1 ፒክስል ጥቁር ቀለም ፡፡ ይህ መመሪያ የማገጃው ድንበር ጥቁር ይሆናል እና ውፍረት አንድ ፒክሰል ይሆናል ማለት ነው ፡፡ በዚህ ሁኔታ ፣ የቅርጽ መስመሩ ራሱ እንደ ተቆራረጠ መስመር (ሰረዝ - ባለ ነጠብጣብ መስመር ፣ የነጥብ - ነጥቦች ፣ ጠንካራ - ጠንካራ መስመር) ሆኖ ይታያል።
ደረጃ 6
የተቀሩትን የማገጃ ባህሪዎች ያዘጋጁ ፡፡ በ ‹ሲ.ኤስ.ኤስ.› መግለጫ ውስጥ በማገጃው ውስጥ ላሉት ጽሑፎች ምን ዓይነት ጽሑፍ ጥቅም ላይ መዋል እንዳለበት ፣ ከቅርፊቱ ጠርዝ ቅርጸ ቁምፊዎች ቅርጸ ቁምፊ መጠን ፣ አሰላለፍ እና መነሻ ምን መሆን አለበት ፡፡ እነዚህ ባህሪዎች ቅርጸ-ቁምፊ-ቤተሰብ ፣ ቅርጸ-ቁምፊ ፣ ጽሑፍ-አሰላለፍ እና ፓድንግ በሚሉት ትርጓሜዎች ተገልፀዋል ፡፡
ደረጃ 7
የአንዱን አግድ ፍሰት ከሌላው በላይ ለማበጀት ተንሳፋፊ ንብረቱን መጠቀም ይችላሉ ፡፡ ወደ “ግራ” ካዋቀሩት የተቀሩት ንጥረ ነገሮች በግራ በኩል ባለው ማገጃ ዙሪያ ይፈስሳሉ እና “በቀኝ” - በቀኝ በኩል። የተንሳፋፊ ዋጋውን እንደ “የለም” ካደረጉት የአግድ አሰላለፍ አይቀመጥም። በሲ.ኤስ.ኤስ ውስጥ ያለው ግልጽ ንብረት እገዳው ወደ ቀኝ ፣ ወደ ግራ ወይም ወደ ሁለቱም ወገኖች እንዳይፈስ ይከላከላል እና የተንሳፋፊውን መግለጫ ይሽራል።