ਇੱਕ ਕਦਮ-ਦਰ-ਕਦਮ ਗਾਈਡ
ਕੀ ਤੁਹਾਡਾ ਨੈਵੀਗੇਸ਼ਨ ਮੀਨੂ ਉੱਪਰੀ ਜਾਂ ਖੜ੍ਹੇ ਖੰਭਿਆਂ ਦੇ ਨਾਲ ਇੱਕ ਖਿਤਿਜੀ ਲਾਈਨ ਹੈ, ਇਹ ਅਜੇ ਵੀ ਇੱਕ ਸੂਚੀ ਹੈ ਜਦੋਂ ਵੈੱਬ ਨੇਵੀਗੇਸ਼ਨ ਨੂੰ ਡਿਜ਼ਾਈਨ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਇਹ ਅਕਸਰ ਭੁੱਲਣਾ ਆਸਾਨ ਹੁੰਦਾ ਹੈ ਕਿ ਇੱਕ ਨੈਵੀਗੇਸ਼ਨ ਮੀਨੂ ਲਿੰਕ ਦਾ ਇੱਕ ਸ਼ਾਨਦਾਰ ਸਮੂਹ ਹੈ. ਪਰ ਜੇ ਤੁਸੀਂ XHTML + CSS ਵਰਤਦੇ ਹੋਏ ਆਪਣੇ ਨੇਵੀਗੇਸ਼ਨ ਨੂੰ ਪ੍ਰਭਾਸ਼ਿਤ ਕਰਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਇਕ ਅਜਿਹਾ ਮੀਨੂੰ ਬਣਾ ਸਕਦੇ ਹੋ ਜੋ ਡਾਊਨਲੋਡ ਕਰਨ ਲਈ ਛੋਟਾ ਹੈ (ਐਕਸਐਲਟੀਐਮਟੀ) ਅਤੇ ਅਨੁਕੂਲ ਬਣਾਉਣਾ ਸੌਖਾ (CSS).
ਸ਼ੁਰੂ ਕਰਨਾ
ਨੇਵੀਗੇਸ਼ਨ ਲਈ ਇੱਕ ਸੂਚੀ ਤਿਆਰ ਕਰਨ ਲਈ, ਤੁਹਾਨੂੰ ਇੱਕ ਸੂਚੀ ਦੀ ਵਰਤੋਂ ਕਰਨ ਦੀ ਲੋੜ ਹੈ
ਇਹ ਇੱਕ ਮਿਆਰੀ ਅਣ-ਸੂਚੀਬੱਧ ਸੂਚੀ ਹੋ ਸਕਦੀ ਹੈ ਜੋ ਨੈਵੀਗੇਸ਼ਨ ਵਜੋਂ ਪਛਾਣ ਕੀਤੀ ਗਈ ਹੈ:
ਜੇ ਤੁਸੀਂ HTML ਤੇ ਧਿਆਨ ਨਾਲ ਵੇਖਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਵੇਖੋਗੇ ਕਿ "ਹੋਮ" ਲਿੰਕ ਵਿੱਚ ਵੀ ਤੁਸੀਂ ਆਪਣੇ ਆਪ ਦਾ ਆਈ ਡੀ ਹੈ. ਇਹ ਤੁਹਾਨੂੰ ਇੱਕ ਮੇਨੂ ਬਣਾਉਣ ਦੀ ਇਜਾਜ਼ਤ ਦੇਵੇਗਾ ਜੋ ਤੁਹਾਡੇ ਪਾਠਕਾਂ ਲਈ ਵਰਤਮਾਨ ਸਥਾਨ ਦੀ ਪਛਾਣ ਕਰਦਾ ਹੈ. ਭਾਵੇਂ ਤੁਸੀਂ ਹੁਣੇ ਹੀ ਆਪਣੀ ਸਾਈਟ ਤੇ ਇਸ ਕਿਸਮ ਦੇ ਵਿਜ਼ੂਅਲ ਕਾਊਂਟਸ ਦੀ ਯੋਜਨਾ ਬਣਾਉਣ ਦੀ ਯੋਜਨਾ ਨਹੀਂ ਬਣਾਉਂਦੇ, ਤੁਸੀਂ ਉਸ ਜਾਣਕਾਰੀ ਨੂੰ ਸ਼ਾਮਲ ਕਰ ਸਕਦੇ ਹੋ. ਜੇ ਤੁਸੀਂ ਬਾਅਦ ਵਿਚ ਕਵੇ ਨੂੰ ਜੋੜਨ ਦਾ ਫੈਸਲਾ ਕਰਦੇ ਹੋ, ਤਾਂ ਤੁਹਾਡੀ ਸਾਈਟ ਨੂੰ ਤਿਆਰ ਕਰਨ ਲਈ ਘੱਟ ਕੋਡਿੰਗ ਹੋਵੇਗੀ.
ਬਿਨਾਂ ਕਿਸੇ ਸੀਐਸਐਸਐਸ ਸਟਾਇਲ ਦੇ , ਇਹ ਐਕਸਐਚਐਚਟੀਏ ਮੈਨਯੂ ਇਕ ਮਿਆਰੀ ਅਣ-ਸੂਚੀਬੱਧ ਸੂਚੀ ਵਾਂਗ ਦਿਸਦਾ ਹੈ. ਗੋਲੀਆਂ ਹੁੰਦੀਆਂ ਹਨ ਅਤੇ ਲਿਸਟ ਆਈਟਮਾਂ ਥੋੜ੍ਹੀ ਤਰਸਤੀ ਨਾਲ ਹੁੰਦੀਆਂ ਹਨ. ਕਿਉਂਕਿ ਮੈਂ ਪਲੇਸਹੋਲਡਰ ਲਿੰਕਾਂ ਦੀ ਵਰਤੋਂ ਕਰ ਰਿਹਾ ਹਾਂ, ਜ਼ਿਆਦਾਤਰ ਬ੍ਰਾਊਜ਼ਰ ਲਿੰਕ ਕਰਨਯੋਗ (ਅੰਡਰਲਾਈਨ ਅਤੇ ਨੀਲੇ ਵਿੱਚ) ਦੇ ਰੂਪ ਵਿੱਚ ਲਿੰਕ ਪ੍ਰਦਰਸ਼ਤ ਨਹੀਂ ਕਰਨਗੇ. ਜੇ ਤੁਸੀਂ ਉਪਰੋਕਤ HTML ਨੂੰ ਇੱਕ ਵੈੱਬ ਪੇਜ਼ ਵਿੱਚ ਪੇਸਟ ਕਰਦੇ ਹੋ ਤਾਂ ਤੁਹਾਡੀ ਨੇਵੀਗੇਸ਼ਨ ਇਸ ਤਰਾਂ ਦਿਖਾਈ ਦੇਵੇਗੀ:
- ਘਰ
- ਉਤਪਾਦ
- ਸੇਵਾਵਾਂ
- ਸਾਡੇ ਨਾਲ ਸੰਪਰਕ ਕਰੋ
ਇਹ ਬਹੁਤ ਬੋਰਿੰਗ ਹੈ ਅਤੇ ਇਹ ਕਿਸੇ ਮੀਨੂੰ ਦੀ ਤਰ੍ਹਾਂ ਨਹੀਂ ਲਗਦਾ. ਪਰ ਸੂਚੀ ਵਿੱਚ ਸਿਰਫ਼ ਕੁਝ CSS ਸਟਾਈਲ ਜੋੜੀਆਂ ਗਈਆਂ ਹਨ, ਤੁਸੀਂ ਇੱਕ ਅਜਿਹਾ ਮੇਨੂ ਬਣਾ ਸਕਦੇ ਹੋ ਜੋ ਤੁਹਾਨੂੰ ਮਾਣ ਮਹਿਸੂਸ ਕਰਵਾਏ.
ਵਰਟੀਕਲ ਨੇਵੀਗੇਸ਼ਨ ਮੀਨੂ
ਇੱਕ ਲੰਬਕਾਰੀ ਨੇਵੀਗੇਸ਼ਨ ਮੀਨੂ ਲਿਖਣਾ ਬਹੁਤ ਸੌਖਾ ਹੈ ਕਿਉਂਕਿ ਇਹ ਇੱਕ ਆਮ ਸੂਚੀ ਦੇ ਤੌਰ ਤੇ ਉਸੇ ਤਰ੍ਹਾਂ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦਾ ਹੈ: ਉੱਪਰ ਅਤੇ ਹੇਠਾਂ
ਲਿਸਟ ਆਈਟਮ ਪੇਜ਼ ਉੱਤੇ ਲੰਬਕਾਰੀ ਦਿਖਾਈ ਦਿੰਦੇ ਹਨ.
ਜਦੋਂ ਮੈਂ ਮੇਨੂ ਨੂੰ ਸਟਾਇਲ ਕਰਦਾ ਹਾਂ, ਮੈਂ ਬਾਹਰੋਂ ਸ਼ੁਰੂ ਕਰਨਾ ਚਾਹੁੰਦਾ ਹਾਂ ਅਤੇ ਅੰਦਰ ਕੰਮ ਕਰਨਾ ਚਾਹੁੰਦਾ ਹਾਂ. ਇਸਦੇ ਦੁਆਰਾ, ਮੇਰਾ ਮਤਲਬ ਹੈ ਕਿ ਮੈਂ ਪਹਿਲਾਂ ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ ਨੂੰ ਸਜਾਉਂਦਾ ਹਾਂ ਅਤੇ ਫਿਰ ਲੀ ਤੱਤਾਂ ਤੇ ਜਾਣ ਅਤੇ ਫਿਰ ਲਿੰਕ ਆਦਿ. ਇਸ ਲਈ ਇਸ ਮੀਨੂੰ ਲਈ, ਪਹਿਲਾਂ ਤੁਸੀਂ ਮੀਨੂ ਦੀਆਂ ਚੌੜਾਈ ਨੂੰ ਪਰਿਭਾਸ਼ਿਤ ਕਰਦੇ ਹੋ. ਇਹ ਯਕੀਨੀ ਬਣਾਵੇਗਾ ਕਿ ਭਾਵੇਂ ਮੇਨੂੰ ਆਈਟਮਾਂ ਲੰਬੇ ਹੋਣ, ਉਹ ਬਾਕੀ ਲੇਆਉਟ ਉੱਤੇ ਧੱਕ ਨਹੀਂ ਦੇਣਗੇ ਜਾਂ ਖਿਤਿਜੀ ਸਕ੍ਰੋਲਿੰਗ ਨੂੰ ਕਾਰਨ ਨਹੀਂ ਦੇਣਗੇ.
ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ {ਚੌੜਾ: 12ਮ; }
ਇੱਕ ਵਾਰ ਜਦੋਂ ਮੈਂ ਚੌੜਾਈ ਸੈਟ ਪ੍ਰਾਪਤ ਕਰ ਲਵਾਂ, ਮੈਂ ਸੂਚੀ ਵਿੱਚ ਆਈਟਮਾਂ ਦੇ ਨਾਲ ਖੇਡ ਸਕਦਾ ਹਾਂ. ਇਹ ਮੈਨੂੰ ਕੁੱਝ (ਜਿਵੇਂ ਗੋਲੀਆਂ ਤੋਂ ਖਹਿੜਾ ਛੁਡਾਉਣ ਲਈ), ਬੈਕਗ੍ਰਾਉਂਡ ਰੰਗ, ਬਾਰਡਰਜ਼, ਟੈਕਸਟ ਅਲਾਈਨਮੈਂਟ ਅਤੇ ਮਾਰਜਿਨ ਸੈਟ ਕਰਨ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ.
ਉਲਟ ਨੇਵੀਗੇਸ਼ਨ li {
ਸੂਚੀ-ਸ਼ੈਲੀ: ਕੋਈ ਨਹੀਂ;
ਬੈਕਗ੍ਰਾਉਂਡ-ਰੰਗ: # 039;
ਬਾਰਡਰ-ਟੌਪ: ਠੋਸ 1px # 039;
text-align: left;
ਹਾਸ਼ੀਆ: 0;
}
ਇੱਕ ਵਾਰ ਜਦੋਂ ਤੁਸੀਂ ਲਿਸਟ ਆਈਟਮਾਂ ਲਈ ਬੁਨਿਆਦ ਸਥਾਪਤ ਕਰ ਲੈਂਦੇ ਹੋ ਤਾਂ ਤੁਸੀਂ ਲਿੰਕ ਖੇਤਰਾਂ ਵਿੱਚ ਮੀਨੂੰ ਕਿਵੇਂ ਵੇਖਦਾ ਹੈ ਨਾਲ ਖੇਡਣਾ ਸ਼ੁਰੂ ਕਰ ਸਕਦੇ ਹੋ. ਪਹਿਲੀ ਸਟਾਈਲ ਯੂਐਲ # ਨੇਵੀਗੇਸ਼ਨ LI A ਅਤੇ ਫਿਰ A: ਲਿੰਕ, ਏ: ਵਿਜਿਟ ਕੀਤਾ, ਏ: ਹੋਵਰ, ਅਤੇ ਏ: ਸਰਗਰਮ (ਜੇ ਤੁਸੀਂ ਉਹਨਾਂ ਨੂੰ ਚਾਹੁੰਦੇ ਹੋ). ਸਬੰਧਾਂ ਲਈ, ਮੈਂ ਲਿੰਕ ਨੂੰ ਬਲੌਕ ਇਕਾਈ ਬਣਾਉਣਾ ਚਾਹੁੰਦਾ ਹਾਂ (ਡਿਫੌਲਟ ਇਨ-ਲਾਈਨ ਦੀ ਬਜਾਏ). ਇਹ ਉਹਨਾਂ ਨੂੰ ਲਿਊ ਦੀ ਸਾਰੀ ਜਗ੍ਹਾ ਲੈਣ ਲਈ ਮਜਬੂਰ ਕਰਦਾ ਹੈ ਅਤੇ ਉਹ ਇੱਕ ਪੈਰਾ ਵਰਗੇ ਹੋਰ ਕੰਮ ਕਰਦੇ ਹਨ, ਜੋ ਕਿ ਉਹਨਾਂ ਨੂੰ ਮੇਨੂ ਬਟਨ ਦੇ ਰੂਪ ਵਿੱਚ ਸ਼ੈਲੀ ਲਈ ਸੌਖਾ ਬਣਾਉਂਦਾ ਹੈ. ਮੈਨੂੰ ਹਮੇਸ਼ਾਂ ਕਰਦੇ ਹੋਏ, ਜੋ ਵੀ ਦੂਸਰੀ ਚੀਜ ਹੇਠ ਰੇਖਾ ਨੂੰ ਹਟਾਉਂਦੀ ਹੈ (ਪਾਠ-ਸਜਾਵਟ: ਕੋਈ ਨਹੀਂ;), ਕਿਉਂਕਿ ਇਹ ਬਟਨਾਂ ਨੂੰ ਮੇਰੇ ਲਈ ਬਟਣਾਂ ਵਰਗਾ ਲਗਦਾ ਹੈ.
ਪਰ ਬੇਸ਼ੱਕ, ਤੁਹਾਡੀ ਡਿਜ਼ਾਈਨ ਵੱਖਰੀ ਹੋ ਸਕਦੀ ਹੈ.
ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ li a {
ਡਿਸਪਲੇ: ਬਲਾਕ;
ਪਾਠ-ਸਜਾਵਟ: ਕੋਈ ਨਹੀਂ;
ਪੈਡਿੰਗ: .25ਮ;
ਸੀਮਾ-ਹੇਠਾਂ: ਠੋਸ 1px # 39f;
ਸੀਮਾ-ਸੱਜੇ: ਠੋਸ 1px # 39f;
}
ਡਿਸਪਲੇਅ ਦੇ ਨਾਲ ਵੇਖੋ: ਬਲਾਕ; ਲਿੰਕ ਤੇ ਸੈੱਟ ਕਰੋ, ਮੀਨੂ ਆਈਟਮ ਦਾ ਪੂਰਾ ਬਾਕਸ ਕਲਿਕ ਕਰਨਯੋਗ ਹੈ, ਸਿਰਫ ਅੱਖਰ ਨਹੀਂ. ਇਹ ਉਪਯੋਗਤਾ ਲਈ ਵੀ ਵਧੀਆ ਹੈ. ਲਿੰਕ ਰੰਗ (ਲਿੰਕ, ਵਿਜਿਟ ਕੀਤੇ, ਹੋਵਰ ਅਤੇ ਕਿਰਿਆਸ਼ੀਲ) ਨੂੰ ਨਿਸ਼ਚਿਤ ਕਰੋ ਜੇ ਤੁਸੀਂ ਚਾਹੁੰਦੇ ਹੋ ਕਿ ਉਹ ਡਿਫਾਲਟ ਨੀਲਾ, ਲਾਲ ਅਤੇ ਜਾਮਨੀ ਤੋਂ ਵੱਖਰੇ ਹੋਣ.
a: ਲਿੰਕ, ਏ: ਦੌਰਾ ਕੀਤਾ {color: #fff; }
a: ਹੋਵਰ, ਏ: ਐਕਟਿਵ {ਰੰਗ: # 000; }
ਮੈਂ ਬੈਕਗ੍ਰਾਉਂਡ ਰੰਗ ਬਦਲ ਕੇ ਹੋਵਰ ਸਟੇਟ ਨੂੰ ਥੋੜਾ ਹੋਰ ਧਿਆਨ ਦੇਣਾ ਪਸੰਦ ਕਰਦਾ ਹਾਂ.
a: ਹੋਵਰ (ਪਿਛੋਕੜ-ਰੰਗ: #fff; }
ਜੇ ਤੁਸੀਂ ਲੰਬਕਾਰੀ ਮੀਨੂ ਦੀਆਂ ਹੋਰ ਮਿਸਾਲਾਂ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਹੇਠਾਂ ਦਿੱਤੀ ਸੂਚੀ ਦੇਖੋ
- ਇੱਕ ਸਟਾਇਲ ਵਰਟੀਕਲ ਮੀਨੂ
- ਇੱਕ ਬੇਸਿਕ ਵਰਟੀਕਲ ਮੀਨੂੰ ਥੀਮ
- ਤੁਹਾਡੇ ਨਾਲ ਇੱਕ ਸਟਾਇਲ ਵਰਟੀਕਲ ਮੀਨੂ ਇੱਥੇ ਹੈ
- ਤੁਹਾਡੇ ਨਾਲ ਇੱਕ ਬੇਸਿਕ ਵਰਟੀਕਲ ਮੀਨੂੰ ਟੈਪਲੇਟ ਇੱਥੇ ਹੈ
ਖਿਤਿਜੀ ਨੈਵੀਗੇਸ਼ਨ ਮੀਨੂ
ਖਿਤਿਜੀ ਨੈਵੀਗੇਸ਼ਨ ਮੀਡਿਆ ਬਣਾਉਣਾ ਲੰਬਕਾਰੀ ਨੇਵੀਗੇਸ਼ਨ ਮੀਡਿਆਂ ਨਾਲੋਂ ਥੋੜਾ ਹੋਰ ਔਖਾ ਹੈ ਕਿਉਂਕਿ ਤੁਹਾਨੂੰ ਇਹ ਤੱਥ ਛੁਟਕਾਰਾ ਕਰਨਾ ਹੁੰਦਾ ਹੈ ਕਿ HTML ਸੂਚੀਆਂ ਲੰਬਕਾਰੀ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨਾ ਪਸੰਦ ਕਰਦੀਆਂ ਹਨ. ਖਿਤਿਜੀ ਮੇਨੂ ਦੇ ਨਾਲ, ਪਹਿਲਾਂ ਆਪਣੀ ਨੇਵੀਗੇਸ਼ਨ ਮੀਨੂ ਸੂਚੀ ਬਣਾਓ :
ਇੱਕ ਹਰੀਜੱਟਲ ਮੀਨੂ ਬਣਾਉਣ ਲਈ, ਉਸੇ ਤਰ੍ਹਾਂ ਕੰਮ ਕਰੋ ਜਿਵੇਂ ਤੁਸੀਂ ਵਰਟੀਕਲ ਮੀਨੂ ਨਾਲ ਕੀਤਾ ਸੀ. ਬਾਹਰੋਂ ਸ਼ੁਰੂ ਕਰੋ ਅਤੇ ਕੰਮ ਕਰੋ. ਕਿਉਂਕਿ ਮੈਂ ਖੱਬੀ ਕੋਨੇ 'ਤੇ ਆਪਣੇ ਨੇਵੀਗੇਸ਼ਨ ਨੂੰ ਸ਼ੁਰੂ ਕਰਨਾ ਚਾਹੁੰਦਾ ਹਾਂ, ਮੈਂ ਇਸਨੂੰ 0 ਖੱਬਾ ਹਾਸ਼ੀਏ ਅਤੇ ਪੈਡਿੰਗ ਨਾਲ ਸੈਟ ਕੀਤਾ ਹੈ, ਅਤੇ ਮੈਂ ਇਸਨੂੰ ਖੱਬੇ ਪਾਸੇ ਫਲੋਟ ਕਰਦਾ ਹਾਂ. ਤੁਹਾਨੂੰ ਚੌੜਾਈ ਨੂੰ ਸੈੱਟ ਕਰਨ ਦੀ ਆਦਤ ਵੀ ਪ੍ਰਾਪਤ ਕਰਨੀ ਚਾਹੀਦੀ ਹੈ ਤਾਂ ਜੋ ਤੁਹਾਡੇ ਮੇਨੂ ਵਿੱਚ ਤੁਹਾਡੇ ਤੋਂ ਵੱਧ ਜਾਂ ਘੱਟ ਜਗ੍ਹਾ ਨਾ ਲੱਗੇ ਜੋ ਤੁਸੀਂ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ. ਹਰੀਜੱਟਲ ਮੀਨੂ ਲਈ, ਇਹ ਆਮ ਤੌਰ ਤੇ ਡਿਜ਼ਾਈਨ ਦੀ ਪੂਰੀ ਚੌੜਾਈ ਹੈ. ਮੈਂ ਇਸ ਨੂੰ ਪੜ੍ਹਨ ਵਿੱਚ ਅਸਾਨ ਬਣਾਉਣ ਲਈ ਪੂਰੀ ਸੂਚੀ ਵਿੱਚ ਇੱਕ ਬੈਕਗ੍ਰਾਉਂਡ ਰੰਗ ਵੀ ਜੋੜਿਆ ਹੈ
ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ {
ਫਲੋਟ: ਖੱਬੇ;
ਹਾਸ਼ੀਆ: 0;
ਪੈਡਿੰਗ: 0;
ਚੌੜਾਈ: 100%;
ਬੈਕਗ੍ਰਾਉਂਡ-ਰੰਗ: # 039;
}
ਪਰ ਖਿਤਿਜੀ ਨੈਵੀਗੇਸ਼ਨ ਮੀਨੂ ਦਾ ਰਾਜ਼ ਸੂਚੀ ਦੇ ਆਈਟਮਾਂ ਵਿੱਚ ਹੈ ਲਿਸਟ ਆਈਟਮਾਂ ਆਮ ਤੌਰ ਤੇ ਅਲਾਇੰਸ ਬਲਾਕ ਕਰਦੀਆਂ ਹਨ, ਜਿਸਦਾ ਅਰਥ ਹੈ ਕਿ ਉਹਨਾਂ ਦੇ ਹਰ ਇੱਕ ਤੋਂ ਪਹਿਲਾਂ ਅਤੇ ਬਾਅਦ ਇੱਕ ਨਵੀਂ ਲਾਈਨ ਰੱਖੀ ਜਾਵੇਗੀ. ਬਲਾਕ ਤੋਂ ਇਨਲਾਈਨ ਲਈ ਡਿਸਪਲੇਅ ਸਵਿੱਚ ਕਰਕੇ, ਤੁਸੀਂ ਲਿਸਟ ਐਲੀਮੈਂਟਸ ਨੂੰ ਇੱਕ ਦੂਸਰੇ ਤੋਂ ਅਗਲੇ ਖਿਤਿਜੀ ਹੋਣ ਲਈ ਮਜ਼ਬੂਰ ਕਰਦੇ ਹੋ.
ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ li {display: inline; }
ਮੈਂ ਲਿੰਕਾਂ ਦਾ ਇਲਾਜ ਕੀਤਾ ਸੀ ਜਿਵੇਂ ਮੈਂ ਉਹਨਾਂ ਨੂੰ ਖੜ੍ਹੇ ਨੇਵੀਗੇਸ਼ਨ ਮੀਨੂ ਵਿੱਚ ਵਰਤਾਂਗਾ, ਉਸੇ ਰੰਗ ਅਤੇ ਪਾਠ ਸਜਾਵਟ ਨਾਲ. ਮੈਂ ਬਟਨਾਂ ਨੂੰ ਚਿੱਤਰਣ ਲਈ ਇੱਕ ਚੋਟੀ ਦੀ ਸਰਹੱਦ ਨੂੰ ਜੋੜਿਆ ਹੈ ਜਦੋਂ ਉਹ ਵੱਧ ਖਿੱਚੀਆਂ ਗਈਆਂ ਹਨ ਸਿਰਫ ਉਹੀ ਚੀਜ਼ ਜੋ ਮੈਂ ਹਟਾ ਲਈ ਸੀ ਡਿਸਪਲੇਅ: ਬਲਾਕ; ਜਿਵੇਂ ਕਿ ਨਵੀਂਆਂ ਲਾਈਨਾਂ ਨੂੰ ਵਾਪਸ ਵਿੱਚ ਲਿਆਉਣਾ ਅਤੇ ਖਿਤਿਜੀ ਸੂਚੀ ਨੂੰ ਨਸ਼ਟ ਕਰਨਾ.
ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ li a {
ਪਾਠ-ਸਜਾਵਟ: ਕੋਈ ਨਹੀਂ;
ਪੈਡਿੰਗ: .25ਮ 1em;
ਸੀਮਾ-ਹੇਠਾਂ: ਠੋਸ 1px # 39f;
ਬਾਰਡਰ-ਟੌਪ: ਠੋਸ 1px # 39f;
ਸੀਮਾ-ਸੱਜੇ: ਠੋਸ 1px # 39f;
}
a: ਲਿੰਕ, ਏ: ਦੌਰਾ ਕੀਤਾ {color: #fff; }
ਉਲ-ਨੇਵੀਗੇਸ਼ਨ li a: ਹੋਵਰ {
ਬੈਕਗ੍ਰਾਉਂਡ-ਰੰਗ: #fff;
ਰੰਗ: # 000;
}
ਤੁਸੀਂ ਇੱਥੇ ਹੋ. ਸਥਾਨ ਜਾਣਕਾਰੀ
HTML ਦਾ ਇਕ ਹੋਰ ਪਹਿਲੂ ਹੈਵਰਰੇਅਰ ਪਛਾਣਕਰਤਾ ਹੈ. ਜੇ ਤੁਸੀਂ ਆਪਣੇ ਉਪਭੋਗੀਆਂ ਦੀ ਵਰਤਮਾਨ ਸਥਿਤੀ ਨੂੰ ਦਰਸਾਉਣ ਲਈ ਆਪਣੇ ਮੇਨੂ ਨੂੰ ਬਦਲਣਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਸਿਰਫ਼ ਇੱਕ ਵੱਖਰਾ ਪਿਛੋਕੜ ਰੰਗ ਜਾਂ ਦੂਸਰਾ ਸਟਾਈਲ ਪਰਿਭਾਸ਼ਿਤ ਕਰਨ ਲਈ ਇਸ ਆਈਡੀ ਦੀ ਵਰਤੋਂ ਕਰੋ. ਉਸ ID ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਦੂਜੇ ਪੰਨਿਆਂ ਤੇ ਸਹੀ ਮੀਨੂ ਆਈਟਮ ਤੇ ਲਿਜਾਓ ਤਾਂ ਜੋ ਮੌਜੂਦਾ ਸਫ਼ੇ ਨੂੰ ਹਮੇਸ਼ਾ ਉਜਾਗਰ ਕੀਤਾ ਜਾ ਸਕੇ.
ਉਲਟ # ਨੇਵੀਗੇਸ਼ਨ li # ਤੁਸੀਂ ਇੱਥੇ ਇੱਕ {ਬੈਕਗ੍ਰਾਉਂਡ-ਰੰਗ: # 09f; }
ਜੇ ਤੁਸੀਂ ਇਹਨਾਂ ਪੰਨਿਆਂ ਤੇ ਇਹ ਸਟਾਈਲ ਇਕੱਠੇ ਕਰਦੇ ਹੋ, ਤੁਸੀਂ ਇੱਕ ਖਿਤਿਜੀ ਜਾਂ ਲੰਬਕਾਰੀ ਮੀਨੂ ਬਾਰ ਬਣਾ ਸਕਦੇ ਹੋ ਜੋ ਤੁਹਾਡੀ ਸਾਈਟ ਨਾਲ ਕੰਮ ਕਰਦਾ ਹੈ ਪਰੰਤੂ ਡਾਊਨਲੋਡ ਕਰਨ ਲਈ ਤੇਜ਼ ਹੈ ਅਤੇ ਭਵਿੱਖ ਵਿੱਚ ਅਪਡੇਟ ਕਰਨਾ ਬਹੁਤ ਅਸਾਨ ਹੈ. XHTML + CSS ਦੀ ਵਰਤੋਂ ਕਰਨ ਨਾਲ ਤੁਹਾਡੀਆਂ ਸੂਚੀਆਂ ਨੂੰ ਡਿਜ਼ਾਇਨ ਲਈ ਇੱਕ ਬਹੁਤ ਹੀ ਤਾਕਤਵਰ ਔਜ਼ਾਰ ਵਜੋਂ ਬਦਲ ਦਿੱਤਾ ਜਾਂਦਾ ਹੈ.
ਜੇ ਤੁਸੀਂ ਖਿਤਿਜੀ ਮੈਦਾਨਾਂ ਦੇ ਹੋਰ ਉਦਾਹਰਣ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਹੇਠ ਦਿੱਤੇ ਸੁਝਾਵਾਂ ਨੂੰ ਵੇਖੋ.
- ਇੱਕ ਸਟਾਈਲਡ ਹੋਰੀਜ਼ੌਨਟਲ ਮੀਨੂ
- ਇੱਕ ਬੇਸਿਕ ਹਰੀਜ਼ਟਲ ਮੀਨੂੰ ਟੈਂਪਲੇਟ
- ਤੁਹਾਡੇ ਨਾਲ ਇਕ ਸਟਾਈਲਡ ਹੋਰੀਜ਼ੌਨਟਲ ਮੀਨੂ ਇੱਥੇ ਹੈ
- ਤੁਹਾਡੇ ਨਾਲ ਇੱਕ ਬੇਸਿਕ ਹਰੀਜੱਟਲ ਮੀਨੂੰ ਟੈਪਲੇਟ ਇੱਥੇ ਹੈ