ይህ wikiHow ለድር ገጽ ተቆልቋይ ሳጥን ለመፍጠር አዶቤ ድሪምቨርን እንዴት እንደሚጠቀሙ ያስተምርዎታል። ተቆልቋይ ሳጥኖች በድር ጣቢያዎ ላይ አንድ ንጥል ጠቅ ሲያደርግ በሂደቱ ውስጥ ተጨማሪ አማራጮችን ሲያቀርብ “ወደ ታች የሚጥሉ” ምናሌዎች ናቸው።
ደረጃዎች
ደረጃ 1. የ Dreamweaver ፕሮጀክት ይክፈቱ።
ይህንን ለማድረግ የፕሮጀክቱን ፋይል ሁለቴ ጠቅ ያድርጉ። አዲስ የ Dreamweaver ፕሮጀክት መፍጠር ከፈለጉ ፣ ይልቁንስ ድሪምቨርን ይከፍታሉ ፣ ጠቅ ያድርጉ ፋይል ፣ ጠቅ ያድርጉ አዲስ, እና ማንኛውንም የማያ ገጽ ላይ ጥያቄዎችን ይከተሉ።
ደረጃ 2. የታዘዘ ዝርዝር ይፍጠሩ።
ተቆልቋይ ምናሌን ለመፍጠር ፣ ቢያንስ አንድ ነጥበ-ነጥብ ንጥል ሊኖርዎት ይገባል። CSS ን በማጥፋት የጥይት ነጥብ መፍጠር ይችላሉ (ጠቅ ያድርጉ ይመልከቱ የምናሌ ንጥል ፣ ይምረጡ የቅጥ ማቅረቢያ, እና ጠቅ ያድርጉ የማሳያ ቅጦች ምልክት ከተደረገ) ፣ ነጥቡን ማከል የሚፈልጉትን ቦታ ጠቅ በማድረግ ፣ በመስኮቱ ግርጌ ያለውን የጥይት ነጥብ አዶ ጠቅ በማድረግ እና የነጥቡን ስም ይተይቡ። ከዚያ ከመቀጠልዎ በፊት ወደ CSS መመለስ አለብዎት።
- የነጥቡ ስም እዚህ እንደ ተቆልቋይ ምናሌዎ ገባሪ ሆኖ ያገለግላል (ለምሳሌ ፣ ተቆልቋይ ምናሌውን የሚከፍትበት ወይም የሚያንኳኳበት አዝራር)።
- ወደ ተቆልቋይ ምናሌ ለመለወጥ የሚፈልጉት የዝርዝር ንጥል ካለዎት ይህንን ደረጃ ይዝለሉ።
ደረጃ 3. የዝርዝርዎን ስም ይወስኑ።
ጠቅ ያድርጉ ኮድ ትር እና በ ላይ መሆንዎን ያረጋግጡ ምንጭ ኮድ ቅንብር ፣ ከዚያ ወደ የታዘዘ ዝርዝር ኮድዎ ወደ ታች ይሸብልሉ (በ “መካከል” መካከል ይሆናል)
"መለያ እና"
"መለያ) እና" "መለያውን ከላይ” ይፈልጉ
መለያ። በጥቅሶች ውስጥ ያለው ቃል የእርስዎ ዝርዝር ስም ነው።
-
ስም ካላዩ ፣ መለያውን (ስም የሚመርጠውን የዝርዝሩን ስም የሚያመለክትበትን) በቀጥታ ከላይ ያስገቡ
መለያ.
ደረጃ 4. የጥይት ነጥቡን (ቶች) ያስወግዱ።
ጠቅ በማድረግ በትክክለኛው ቦታ ላይ መሆንዎን ያረጋግጡ ንድፍ ትር እና ከዚያ ጠቅ ያድርጉ CSS ዲዛይነር በመስኮቱ በላይኛው ቀኝ ጥግ ላይ ትር ፣ ከዚያ የሚከተሉትን ያድርጉ
- ጠቅ ያድርጉ + ከ “መራጮች” ርዕስ በስተቀኝ በኩል።
- የእርስዎ ዝርዝር ስም “ስም” ባለበት #ስም ul ውስጥ ይተይቡ።
- ይጫኑ twice ሁለት ጊዜ ያስገቡ።
- ወደ ታች ይሸብልሉ እና ጠቅ ያድርጉ ዝርዝር-ቅጥ-ዓይነት ከግርጌው በታች ባለው ንጥል ውስጥ CSS ዲዛይነር ትር።
- ጠቅ ያድርጉ የለም በሚመጣው ብቅ-ባይ ምናሌ ውስጥ።
ደረጃ 5. በአግድም ለማሳየት የታዘዘውን ዝርዝርዎን ይለውጡ።
እንደዚህ ለማድረግ:
- ጠቅ ያድርጉ + ከ “መራጮች” ርዕስ በስተቀኝ በኩል።
- “ስም” ዝርዝርዎ ስም በሚሆንበት #ስም li ውስጥ ይተይቡ።
- በግርጌው ታችኛው ክፍል ላይ “ተንሳፋፊ” የሚለውን ርዕስ ይፈልጉ CSS ዲዛይነር ትር።
- ጠቅ ያድርጉ ግራ ከ “ተንሳፋፊው” ርዕስ በስተቀኝ በኩል ወዲያውኑ አዝራር።
ደረጃ 6. ለዝርዝርዎ ንቁ መለያ ያክሉ።
ጠቅ ያድርጉ + ከ “መራጮች” በስተቀኝ ያለው አዝራር ፣ ከዚያ በ #ስም ሀ (“ስም” ዝርዝርዎ የሚገኝበት ቦታ) ይተይቡ እና twice ሁለቴ ያስገቡ።
ደረጃ 7. የጀርባ ቀለም ያክሉ።
የሚለውን ይምረጡ #ስም ሀ አስፈላጊ ከሆነ ንጥል ፣ ከዚያ በሳጥኑ ቅርፅ ያለው “የጀርባ ቀለም” ትርን ከላይኛው ላይ ጠቅ ያድርጉ CSS ዲዛይነር ንጥል ፣ ይምረጡ ዳራ-ቀለም አማራጭ ፣ እና ለመጠቀም የጀርባ ቀለም ይምረጡ።
ተቆልቋይ ዝርዝርዎ ንጥሎች የሚጠቀሙበት ቀለም ይህ ነው።
ደረጃ 8. የዝርዝር ዕቃዎችዎ የ “ማገጃ” ቅርጸት እንዲጠቀሙ ያድርጉ።
ይህ ቅርጸት አንድ ሰው በዝርዝሩ ውስጥ አንድ ንጥል ጠቅ ለማድረግ ወይም መታ ለማድረግ ሲሄድ ጽሑፉን በትክክል ከመምረጥ ይልቅ ከላይ ወይም ከታች በትንሹ በመምረጥ ሊከፍቱት እንደሚችሉ ያረጋግጣል።
- የእርስዎን ያረጋግጡ #ስም ሀ ንጥል በ ውስጥ ተመርጧል CSS ዲዛይነር ትር።
- በማያ ገጹ ውስጥ ወደ “ማሳያ” ርዕስ ይሂዱ።
- በ “ማሳያ” አርዕስት በስተቀኝ በኩል ጠቅ ያድርጉ ፣ ከዚያ ጠቅ ያድርጉ አግድ በሚያስከትለው ምናሌ ውስጥ።
ደረጃ 9. አስፈላጊ ከሆነ ንጣፎችን ይጨምሩ።
የእርስዎ ዝርዝር ዕቃዎች እርስ በእርስ እንደተጨናነቁ ካስተዋሉ የሚከተሉትን በማድረግ በመካከላቸው የተወሰነ ቦታ ማስቀመጥ ይችላሉ-
- የእርስዎን ያረጋግጡ #ስም ሀ ንጥል በ ውስጥ ተመርጧል CSS ዲዛይነር ትር።
- በመያዣው ውስጥ ወደ “መለጠፊያ” ርዕስ ይሂዱ።
- ቢያንስ 5 ለማንበብ የላይ እና የታችኛውን “px” የጽሑፍ መስኮች ይለውጡ።
- ቢያንስ 10 ን ለማንበብ የግራ እና የቀኝ “px” የጽሑፍ መስኮችን ይለውጡ።
ደረጃ 10. የማንዣበብ ቀለም ይፍጠሩ።
በተቆልቋይ ምናሌው ውስጥ ባለው ንጥል ላይ የመዳፊት ጠቋሚዎን ሲያንዣብቡ ይህ የሚታየው ቀለም ነው-
- ጠቅ ያድርጉ + ከ “መራጮች” ርዕስ በስተቀኝ በኩል።
- #Nave a: hover (“ስም” የዝርዝሮችዎ ስም የሚገኝበት) ይተይቡ እና ↵ ሁለቴ ያስገቡ።
- “የጀርባ ቀለም” ትርን ጠቅ ያድርጉ።
- ይምረጡ ዳራ-ቀለም እና ከዚያ ለጀርባ ቀለም ከተጠቀሙበት ቀለል ያለ ቀለም ይምረጡ።
ደረጃ 11. CSS ን ያጥፉ።
ጠቅ ያድርጉ ይመልከቱ የምናሌ ንጥል ፣ ይምረጡ የቅጥ አሰጣጥ, እና ጠቅ ያድርጉ የማሳያ ቅጦች በሚከፈተው መስኮት ውስጥ አማራጭ።
ከሆነ የማሳያ ቅጦች አማራጭ ግራጫማ ነው ፣ በ Dreamweaver ሰነድዎ ውስጥ በማንኛውም ቦታ ላይ ጠቅ ያድርጉ እና እንደገና ይሞክሩ።
ደረጃ 12. ተቆልቋይ የምናሌ ይዘቶችን ይፍጠሩ።
እንደ ተቆልቋይ ምናሌ አዝራር ሊጠቀሙበት ከሚፈልጉት ጥይት ነጥብ በታች ንዑስ ነጥቦችን በማከል ይህንን ማድረግ ይችላሉ-
- ወደ ተቆልቋይ ምናሌ ለመለወጥ ከሚፈልጉት የዝርዝሩ ንጥል በስተቀኝ ጠቅ ያድርጉ ፣ ከዚያ ↵ አስገባን ይጫኑ።
- ትር Press ን ይጫኑ።
- የመጀመሪያውን ተቆልቋይ የምናሌ ንጥልዎን ስም ይተይቡ ፣ ከዚያ ↵ አስገባን ይጫኑ።
- በሚቀጥለው ተቆልቋይ ምናሌ ስም ይተይቡ ፣ ከዚያ ይጫኑ ↵ አስገባ እና እንደአስፈላጊነቱ ይድገሙት።
ደረጃ 13. የተቆልቋይ ምናሌ ይዘቶችን በጥይት ንጥል ላይ ያያይዙ።
እንደዚህ ለማድረግ:
- ጠቅ ያድርጉ + ከ “መራጮች” ቀጥሎ ፣ ከዚያ #ስም ul ul ብለው ይተይቡ እና ↵ ሁለቴ ያስገቡ።
- ወደ ታች ይሸብልሉ እና ጠቅ ያድርጉ ማሳያ ፣ ከዚያ ጠቅ ያድርጉ የለም በብቅ ባዩ ምናሌ ውስጥ።
- ያግኙ እና ጠቅ ያድርጉ አቀማመጥ ፣ ከዚያ ጠቅ ያድርጉ ፍፁም በብቅ ባዩ ምናሌ ውስጥ።
ደረጃ 14. ተቆልቋይ ምናሌውን ራሱ ይፍጠሩ።
ይህንን ለማድረግ ሌላ መራጭ ማከል አለብዎት
- ጠቅ ያድርጉ + ከ “መራጮች” ቀጥሎ ፣ ከዚያ በ #ስም ul li: hover> ul ይተይቡ እና ↵ ሁለቴ ያስገቡ።
- ያግኙ እና ጠቅ ያድርጉ ማሳያ ፣ ከዚያ ጠቅ ያድርጉ አግድ በሚመጣው ብቅ-ባይ ምናሌ ውስጥ።
ደረጃ 15. የተቆልቋይ ምናሌ ይዘቶቹ በአቀባዊ እንዲታዩ ያድርጉ።
በነባሪ ፣ ተቆልቋይ የምናሌ ይዘቶች በአግድመት አሞሌ ውስጥ ይታያሉ ፣ ግን የሚከተሉትን በማድረግ ወደ አቀባዊ አምድ ማስገደድ ይችላሉ
- ጠቅ ያድርጉ + ከ “መራጮች” ቀጥሎ ፣ ከዚያ በ #ስም ul ul ሊ ብለው ይተይቡ እና ↵ ሁለቴ ያስገቡ።
- “ተንሳፋፊ” የሚለውን ርዕስ ይፈልጉ።
- “የለም” ን ጠቅ ያድርጉ () ከ “ተንሳፋፊ” ርዕስ በስተቀኝ ያለው አማራጭ።
ደረጃ 16. ፕሮጀክትዎን ያስቀምጡ።
ይህንን ለማድረግ Ctrl+S (ዊንዶውስ) ወይም ⌘ Command+S (Mac) ን ይጫኑ።