ምናሌው በጣቢያው ላይ ባሉት ክፍሎች ውስጥ የተጠቃሚን አሰሳ ለማመቻቸት ያገለግላል ፡፡ የጎብorዎችን ትኩረት ለመሳብ ምናሌው ተግባራዊ ፣ ለአጠቃቀም ቀላል እና በተመሳሳይ ጊዜ ከጠቅላላው ሀብቱ ዲዛይን ጋር ተጣምሮ መሆን አለበት ፡፡
መመሪያዎች
ደረጃ 1
ምናሌ ከመፍጠርዎ በፊት በአይነቱ ላይ ይወስኑ ፡፡ ተጠቃሚው በመዳፊት ጠቋሚው በላዩ ላይ ሲያንዣብብ ለተጠቃሚው የሚታየውን የተቆልቋይ አግድም ወይም ቀጥ ያለ ሳጥን መፍጠር ይችላሉ ፡፡ አንድ የተወሰነ ምናሌን በሚመርጡበት ጊዜ ጎብኝዎች እሱን ለመጠቀም ምን ያህል ምቹ እንደሚሆን እና ከዲዛይን ጋር እንዴት እንደሚጣመር ሊመሩ ይችላሉ ፡፡
ደረጃ 2
የምናሌ አይነት ከመረጡ በኋላ ኤችቲኤምኤልን ለማርትዕ የሚጠቀሙትን ማንኛውንም የጽሑፍ አርታኢ በመጠቀም የገጽዎን ፋይል ይክፈቱ። የበይነገጽዎን አካል ለማስገባት ወደሚፈልጉት የኮድ ክፍል ይሂዱ ፡፡
ደረጃ 3
ከዚያ በኋላ አንድ ብሎክ በመፍጠር እና በተመደበለት መታወቂያ ቁጥር ያለው ዝርዝር በመያዝ የአማራጮች ዝርዝር ያዘጋጁ ፡፡ ለምሳሌ:
- አገናኝ 1
- አገናኝ 2
- አገናኝ 3
በዚህ ምሳሌ ውስጥ የሶስት አካላት ነጥበ ምልክት ዝርዝር ፈጠርኩ እና በመታወቂያ ፓነል መታወቂያ በዲቪ ንብርብር ውስጥ አስቀመጥኩ ፡፡
ደረጃ 4
ወደ ገጽዎ ክፍል ክፍል ይሂዱ እና ተገቢውን የ cascading የቅጥ ሉህ ምናሌ ይፍጠሩ። አግድም ምናሌ ለመፍጠር ከፈለጉ ለተገኘው ዝርዝር የውስጠ-መስመር ባህሪን ማካተት ይችላሉ-
#panel ul li {ማሳያ: በመስመር ላይ; }
ደረጃ 5
በመላው የገጹ ርዝመት አግድም መስመር ለመፍጠር የሚከተሉትን ኮድ መጠቀም ይችላሉ-
#panel ul {margin-left: 0; መቅዘፊያ: 2px 0; }
ደረጃ 6
ከዚያ የእይታ ክፍፍልን ወደ አራት ማዕዘኖች ማድረግ ይችላሉ-
#panel ul li a {ህዳግ-ግራ: 3 ፒክስል; ወሰን: 1 ፒክስል; መቅዘፊያ: 2px 3px; ዳራ: ሰማያዊ; }
ይህ ኮድ ከጠረፍ አካላት የጽሑፍ ይዘቶችን በኅዳግ ግራ እና በመታጠቢያ ባሕሪዎች በኩል ያዘጋጃል ፣ እንዲሁም ለእያንዳንዱ የዝርዝር ዕቃዎች የጀርባ ቀለም ያዘጋጃል። በዚህ ምሳሌ ውስጥ ቀለሙ ሰማያዊ ነው ፣ ግን በራስዎ ውሳኔ ሊለውጡት ይችላሉ።
ደረጃ 7
በትሩ ውስጥ ለተመረጠው አሁን ባለው ገጽ ላይ ያለውን ንጥል ለማመልከት ተገቢውን መለኪያዎች ለተከፈተው ክፍል ያዘጋጁ ፡፡
# menu ul li a # ክፍት {ዳራ: ቀይ; ድንበር-ታች 1 ፒክስል; }
በፓነሉ ውስጥ የተመረጠው የአሁኑ ገጽ አሁን በቀይ ይታያል።
ደረጃ 8
ለውጦቹን በፋይሉ ላይ ያስቀምጡ እና ገጽዎን በአሳሽ በኩል በመክፈት የተፃፈውን ኮድ ተግባራዊነት ያረጋግጡ። ተጨማሪ የማሳያ አማራጮችን ለማዘጋጀት የነገሩን ገጽታ ከፍ ለማድረግ ሁልጊዜ CSS ወይም HTML ን ማከል ይችላሉ።
