ली तत्व के चारों ओर एंकर टैग लपेटें

Question

मैं नेविगेशन मेनू बना रहा हूं। मैं सीएसएस का उपयोग करना चाहता हूं ताकि एंकर टैग ली तत्व के चारों ओर लपेटा जा सके लेकिन एंकर टैग ली तत्व के अंदर हैं।

यहाँ यहाँ मेरी कम सीएसएस

ul { 
    list-style-type: none; 
    padding: 0; 
    margin: 0; 
    li { 
    padding: 2% 4%; 
    border: 1px solid green; 
    a { 
     text-decoration: none; 
     display: block; 
    } 
    } 
} 

Answer 1

केवल कानूनी तत्व एक <ul> अंदर की अनुमति दी एक <li> है एचटीएमएल

<ul> 
    <li><a href="">Uutiset</a></li> 
    <li><a href="">Foorumi</a></li> 
    <li><a href="">Kauppa</a></li> 
    <li><a href="">Messut</a></li> 
    <li><a href="">Asiakaspalvelu</a></li> 
    <li><a href="">Nakoislehti</a></li> 
    <li><a href="">Nae meidat</a></li> 
</ul> 

है। आपके पास <li> के चारों ओर एक एंकर लपेटा नहीं जा सकता है। यह एचटीएमएल 5 में सच है, जहां एक एंकर अन्य ब्लॉक स्तर तत्वों के चारों ओर लपेट सकता है।

क्या आप सीएसएस में है लगभग वहाँ है, बस जोड़ें:

a { 
    text-decoration: none; 
    display: block; 
    width: 100%; 
    height: 100%; 
} 

और अपने लंगर <li> की पूरी जगह को भरने जाएगा।

Answer 2

आप एक ली क्लिक करने योग्य नहीं कर सकते, लेकिन आप क्या कर सकते के रूप में यहाँ का सुझाव दिया ली के आकार के एक लिंक के विस्तार है: https://stackoverflow.com/a/1121754/1068495

Answer 3

इस प्रयास करें, गद्दी ली के बजाय एंकर करने के लिए दे । बाहर ली रखना संभव नहीं है। ली के बजाय अपने एंकर शैली बनाओ। ली को एक रैपर की तरह कार्य करने दें। li में

ul { 
    list-style-type: none; 
    padding: 0; 
    margin: 0; 
    li { 
    a { 
     padding: 2% 4%; 
     border: 1px solid green; 
     text-decoration: none; 
     display: block; 
    } 
    } 
} 

Answer 4

न उपयोग गद्दी, बजाय लंगर पाठ के लिए line-height का उपयोग करें। यह li तत्व की पूर्ण ऊंचाई को कवर करेगा।

यहां, इस Example

पर एक नज़र डालें