ਫੌਂਟ ਅਕਾਰ ਬਦਲਣ ਲਈ EMS ਦੀ ਵਰਤੋਂ
ਜਦੋਂ ਤੁਸੀਂ ਕੋਈ ਵੈਬ ਪੇਜ ਬਣਾ ਰਹੇ ਹੁੰਦੇ ਹੋ, ਤਾਂ ਜ਼ਿਆਦਾਤਰ ਪੇਸ਼ੇਵਰ ਇਹ ਸਲਾਹ ਦਿੰਦੇ ਹਨ ਕਿ ਤੁਸੀਂ ਈਐਮਐਸ, ਐਕਸਜ਼, ਪ੍ਰਤੀਸ਼ਤ ਜਾਂ ਪਿਕਸਲ ਵਰਗੇ ਅਨੁਪਾਤਕ ਮਾਪ ਨਾਲ ਫੌਂਟ (ਅਤੇ ਅਸਲ ਵਿੱਚ, ਹਰ ਚੀਜ਼) ਦਾ ਆਕਾਰ ਕਰੋ. ਇਹ ਇਸ ਲਈ ਹੈ ਕਿਉਂਕਿ ਤੁਸੀਂ ਸੱਚਮੁੱਚ ਇਹ ਨਹੀਂ ਜਾਣਦੇ ਕਿ ਕੋਈ ਹੋਰ ਤੁਹਾਡੀ ਸਮੱਗਰੀ ਨੂੰ ਦੇਖ ਸਕਦਾ ਹੈ. ਅਤੇ ਜੇਕਰ ਤੁਸੀਂ ਇੱਕ ਪੂਰਨ ਮਾਪ (ਇੰਚ, ਸੈਂਟੀਮੀਟਰ, ਮਿਲੀਮੀਟਰ, ਪੁਆਇੰਟ, ਜਾਂ ਪਿਕਸ) ਵਰਤਦੇ ਹੋ ਤਾਂ ਇਹ ਵੱਖਰੇ ਉਪਕਰਣਾਂ ਵਿੱਚ ਸਫ਼ੇ ਦੀ ਡਿਸਪਲੇ ਜਾਂ ਪਡ਼੍ਹਾਈ ਨੂੰ ਪ੍ਰਭਾਵਤ ਕਰ ਸਕਦਾ ਹੈ.
ਅਤੇ W3C ਸਿਫਾਰਸ਼ ਕਰਦਾ ਹੈ ਕਿ ਤੁਸੀਂ ਆਕਾਰ ਲਈ ems ਵਰਤਦੇ ਹੋ.
ਪਰ ਐਮ ਕਿੰਨੀ ਵੱਡੀ ਹੈ?
W3C ਦੇ ਇੱਕ ਐਮ ਅਨੁਸਾਰ:
"ਉਸ ਤੱਤ ਦੀ 'ਫੌਂਟ-ਅਕਾਰ' ਸੰਪਤੀ ਦੀ ਗਣਨਾ ਕੀਤੀ ਮੁੱਲ ਦੇ ਬਰਾਬਰ ਹੈ ਜਿਸ ਉੱਤੇ ਇਹ ਵਰਤੀ ਜਾਂਦੀ ਹੈ. ਅਪਵਾਦ ਉਦੋਂ ਹੁੰਦਾ ਹੈ ਜਦੋਂ 'ਐਮ' 'ਫੌਂਟ-ਅਕਾਰ' ਪ੍ਰਾਪਰਟੀ ਦੇ ਮੁੱਲ ਵਿੱਚ ਹੁੰਦਾ ਹੈ, ਜਿਸ ਵਿੱਚ ਇਸ ਦਾ ਮਤਲਬ ਹੈ ਮੂਲ ਤੱਤ ਦੇ ਫੌਂਟ ਦੇ ਆਕਾਰ ਤੇ. "
ਦੂਜੇ ਸ਼ਬਦਾਂ ਵਿਚ, ਈਐਮਐਸ ਦਾ ਪੂਰਾ ਅਕਾਰ ਨਹੀਂ ਹੁੰਦਾ. ਉਹ ਉਹਨਾਂ ਦੇ ਆਕਾਰ ਦੇ ਮੁੱਲਾਂ ਨੂੰ ਲੈ ਕੇ ਉਸ ਸਥਾਨ ਤੇ ਹਨ ਜਿੱਥੇ ਉਹ ਹਨ ਜ਼ਿਆਦਾਤਰ ਵੈਬ ਡਿਜ਼ਾਈਨਰਾਂ ਲਈ , ਇਸਦਾ ਅਰਥ ਇਹ ਹੈ ਕਿ ਉਹ ਇੱਕ ਵੈਬ ਬ੍ਰਾਉਜ਼ਰ ਵਿੱਚ ਹਨ, ਇਸਲਈ 1EM ਲੰਬਾ ਫੌਂਟ ਉਸੇ ਬਰਾਊਜ਼ਰ ਦੇ ਡਿਫਾਲਟ ਫੌਂਟ ਅਕਾਰ ਦੇ ਬਰਾਬਰ ਹੈ.
ਪਰ ਮੂਲ ਅਕਾਰ ਕਿੰਨਾ ਲੰਬਾ ਹੈ? ਗਾਹਕਾਂ ਆਪਣੇ ਬ੍ਰਾਉਜ਼ਰ ਤੇ ਆਪਣਾ ਡਿਫਾਲਟ ਫੌਂਟ ਅਕਾਰ ਬਦਲ ਸਕਦੇ ਹਨ, ਪਰੰਤੂ ਜ਼ਿਆਦਾ ਲੋਕ ਨਹੀਂ ਮੰਨਦੇ ਕਿ ਜ਼ਿਆਦਾਤਰ ਬ੍ਰਾਉਜ਼ਰ ਕੋਲ 16px ਦੇ ਫੌਂਟ ਦਾ ਅਕਾਰ ਹੈ. ਇਸ ਲਈ ਜਿਆਦਾਤਰ ਸਮਾਂ 1em = 16px .
ਪਿਕਸਲਸ ਵਿੱਚ ਸੋਚੋ, ਮਾਪ ਲਈ EMS ਵਰਤੋਂ
ਇੱਕ ਵਾਰ ਜਦੋਂ ਤੁਸੀਂ ਜਾਣਦੇ ਹੋ ਕਿ ਡਿਫਾਲਟ ਫੌਂਟ ਅਕਾਰ 16px ਹੈ, ਤਾਂ ਤੁਸੀਂ ਆਪਣੇ ਗਾਹਕਾਂ ਨੂੰ ਪੇਜ਼ ਨੂੰ ਆਸਾਨੀ ਨਾਲ ਬਦਲਣ ਦੀ ਇਜ਼ਾਜਤ ਦੇਣ ਲਈ ems ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ ਪਰ ਆਪਣੇ ਫੌਂਟ ਸਾਈਜ਼ ਲਈ ਪਿਕਸਲ ਵਿੱਚ ਸੋਚ ਸਕਦੇ ਹੋ.
ਕਹੋ ਕਿ ਤੁਹਾਡੇ ਕੋਲ ਇੱਕ ਵਰਗਾ ਆਕਾਰ ਵਰਗੀ ਕੋਈ ਚੀਜ਼ ਹੈ:
- ਹੈਡਲਾਈਨ 1 - 20 ਪੈਕਸ
- ਹੈਡਲਾਈਨ 2 - 18 ਪੈਕਸ
- ਹੈਡਲਾਈਨ 3 - 16 ਪੈਕਸ
- ਮੁੱਖ ਪਾਠ - 14px
- ਸਬ ਟੈਕਸਟ- 12px
- ਫੁਟਨੋਟ - 10px
ਤੁਸੀਂ ਉਹਨਾਂ ਨੂੰ ਮਾਪ ਲਈ ਪਿਕਸਲ ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਉਸ ਤਰੀਕੇ ਨੂੰ ਪਰਿਭਾਸ਼ਤ ਕਰ ਸਕਦੇ ਹੋ, ਪਰੰਤੂ ਫਿਰ ਵੀ IE 6 ਅਤੇ 7 ਵਰਤ ਰਹੇ ਕੋਈ ਵਿਅਕਤੀ ਤੁਹਾਡੇ ਪੰਨੇ ਨੂੰ ਚੰਗੀ ਤਰ੍ਹਾਂ ਬਦਲ ਨਹੀਂ ਸਕਦਾ. ਇਸ ਲਈ ਤੁਹਾਨੂੰ ਆਕਾਰ ਨੂੰ ਈਐਮਐਸ ਵਿੱਚ ਬਦਲਣਾ ਚਾਹੀਦਾ ਹੈ ਅਤੇ ਇਹ ਸਿਰਫ ਕੁਝ ਗਿਣਤ ਦੀ ਗੱਲ ਹੈ:
- ਹੈਡਲਾਈਨ 1 - 1.25ਮ (16 x 1.25 = 20)
- ਹੈਡਲਾਈਨ 2 - 1.125 ਐਮ (16 × 1.125 = 18)
- ਹੈਡਲਾਈਨ 3 - 1em (1em = 16px)
- ਮੁੱਖ ਪਾਠ - 0.875ੈਮ (16 x 0.875 = 14)
- ਸਬ ਟੈਕਸਟ - 0.75ੈਮ (16 x 0.75 = 12)
- ਫੁਟਨੋਟ - 0.625ਮ (16 x 0.625 = 10)
ਵਿਰਾਸਤ ਭੁੱਲ ਨਾ ਜਾਣਾ!
ਪਰ ਇਹ ਸਭ ਕੁਝ ਈਮਜ਼ ਲਈ ਨਹੀਂ ਹੈ. ਦੂਜੀ ਗੱਲ ਜੋ ਤੁਹਾਨੂੰ ਯਾਦ ਰੱਖਣ ਦੀ ਜ਼ਰੂਰਤ ਹੈ ਇਹ ਹੈ ਕਿ ਉਹ ਮਾਤਾ ਜਾਂ ਪਿਤਾ ਦੇ ਆਕਾਰ ਤੇ ਲੈਂਦੇ ਹਨ. ਇਸ ਲਈ ਜੇਕਰ ਤੁਹਾਡੇ ਕੋਲ ਵੱਖੋ ਵੱਖਰੇ ਫੌਂਟ ਅਕਾਰ ਦੇ ਨਾਲ ਤੱਤ ਬਣੇ ਹੋਏ ਹਨ, ਤਾਂ ਤੁਸੀਂ ਆਪਣੀ ਆਸ ਨਾਲੋਂ ਕਿਤੇ ਘੱਟ ਜਾਂ ਵੱਡੇ ਫੋਟ ਦੇ ਨਾਲ ਖਤਮ ਹੋ ਸਕਦੇ ਹੋ.
ਉਦਾਹਰਣ ਦੇ ਲਈ, ਤੁਹਾਡੇ ਕੋਲ ਇਹ ਇੱਕ ਸਟਾਇਲ ਸ਼ੀਟ ਹੋ ਸਕਦੀ ਹੈ:
p {font-size: 0.875em; }
.footnote {ਫੌਂਟ-ਸਾਈਜ਼: 0.625ਮ; }
ਇਸਦੇ ਨਤੀਜੇ ਵਜੋਂ ਫੌਂਟ 14px ਅਤੇ 10px ਮੁੱਖ ਪਾਠ ਅਤੇ ਫੁੱਟਨੋਟ ਲਈ ਕ੍ਰਮਵਾਰ ਕ੍ਰਮਵਾਰ ਹੋਣਗੇ. ਪਰ ਜੇ ਤੁਸੀਂ ਪੈਰਾਗ੍ਰਾਫ ਵਿੱਚ ਇੱਕ ਫੁਟਨੋਟ ਲਗਾਉਂਦੇ ਹੋ, ਤਾਂ ਤੁਸੀਂ ਪਾਠ ਨਾਲ ਸਮਾਪਤ ਕਰ ਸਕਦੇ ਹੋ ਜੋ 10px ਦੀ ਬਜਾਏ 8.75 ਪੈਕਸ ਹੈ. ਇਸ ਨੂੰ ਆਪਣੇ ਉੱਤੇ ਰੱਖੋ, ਇਸ ਨੂੰ ਉਪਰ CSS ਅਤੇ ਇੱਕ HTML ਵਿੱਚ ਹੇਠ ਦਿੱਤੇ HTML ਪਾ:
ਇਹ ਫੋਂਟ 14px ਜਾਂ 0.875 ਈਐਸਐਸ ਹੈ.
ਇਸ ਪੈਰੇ ਵਿਚ ਇਕ ਫੁਟਨੋਟ ਹੈ
ਹਾਲਾਂਕਿ ਇਹ ਕੇਵਲ ਫੁਟਨੋਟ ਪੈਰਾ ਹੈ.
ਫੁਟਨੋਟ ਦੇ ਪਾਠ ਨੂੰ 10px ਤੇ ਪੜ੍ਹਨਾ ਔਖਾ ਹੁੰਦਾ ਹੈ, ਇਹ ਲਗਭਗ 8.75 ਪੈਕਸ ਉੱਤੇ ਅਸਪਸ਼ਟ ਹੁੰਦਾ ਹੈ.
ਇਸ ਲਈ, ਜਦੋਂ ਤੁਸੀਂ ਈਐਮਐਸ ਦੀ ਵਰਤੋਂ ਕਰ ਰਹੇ ਹੁੰਦੇ ਹੋ, ਤਾਂ ਤੁਹਾਨੂੰ ਪੇਰੈਂਟ ਔਬਜੈਕਟਾਂ ਦੇ ਆਕਾਰ ਬਾਰੇ ਬਹੁਤ ਜਾਣੂ ਹੋਣ ਦੀ ਜ਼ਰੂਰਤ ਹੁੰਦੀ ਹੈ, ਜਾਂ ਤੁਸੀਂ ਆਪਣੇ ਪੰਨਿਆਂ ਤੇ ਕੁਝ ਅਸਲ ਅਜੀਬ ਆਕਾਰ ਦੇ ਤੱਤ ਦੇ ਨਾਲ ਖਤਮ ਹੋਵੋਗੇ.