px ਤੋਂ rem ਅਤੇ em ਕਨਵਰਟਰ
ਆਪਣੇ ਰੂਟ ਅਤੇ ਕੰਟੈਕਸਟ ਫੌਂਟ ਸਾਈਜ਼ ਦੀ ਵਰਤੋਂ ਕਰਕੇ px, rem ਅਤੇ em ਵਿਚਕਾਰ ਬਦਲੋ — ਕਿਸੇ ਵੀ ਫੀਲਡ ਨੂੰ ਐਡਿਟ ਕਰੋ ਅਤੇ ਬਾਕੀ ਦੋਵੇਂ ਤੁਹਾਡੇ ਟਾਈਪ ਕਰਨ ਦੇ ਨਾਲ-ਨਾਲ ਅੱਪਡੇਟ ਹੋ ਜਾਣਗੇ।
| px | rem |
|---|---|
| 8 | 0.5 |
| 12 | 0.75 |
| 14 | 0.875 |
| 16 | 1 |
| 18 | 1.125 |
| 20 | 1.25 |
| 24 | 1.5 |
| 32 | 2 |
| 40 | 2.5 |
| 48 | 3 |
ਹਰ ਪਰਿਵਰਤਨ ਤੁਹਾਡੇ ਬ੍ਰਾਊਜ਼ਰ ਵਿੱਚ ਚੱਲਦਾ ਹੈ। ਤੁਹਾਡੇ ਵੱਲੋਂ ਟਾਈਪ ਕੀਤਾ ਗਿਆ ਕੋਈ ਵੀ ਡਾਟਾ BroBroGo 'ਤੇ ਅੱਪਲੋਡ ਨਹੀਂ ਕੀਤਾ ਜਾਂਦਾ।
ਅਕਸਰ ਪੁੱਛੇ ਜਾਣ ਵਾਲੇ ਸਵਾਲ
px, rem ਅਤੇ em ਵਿੱਚ ਕੀ ਅੰਤਰ ਹੈ?
px ਇੱਕ ਨਿਸ਼ਚਿਤ ਲੰਬਾਈ ਹੈ। rem ਨੂੰ ਪੇਜ ਦੇ ਰੂਟ ਫੌਂਟ ਸਾਈਜ਼ ਦੇ ਵਿਰੁੱਧ ਮਾਪਿਆ ਜਾਂਦਾ ਹੈ, ਇਸਲਈ 16px ਰੂਟ 'ਤੇ, 1rem ਬਰਾਬਰ 16px ਹੁੰਦਾ ਹੈ। em ਨੂੰ ਉਸ ਐਲੀਮੈਂਟ ਦੇ ਫੌਂਟ ਸਾਈਜ਼ ਦੇ ਵਿਰੁੱਧ ਮਾਪਿਆ ਜਾਂਦਾ ਹੈ ਜਿਸ ਵਿੱਚ ਇਹ ਸਥਿਤ ਹੁੰਦਾ ਹੈ। rem ਵਿੱਚ ਟਾਈਪ ਅਤੇ ਸਪੇਸਿੰਗ ਦਾ ਆਕਾਰ ਨਿਰਧਾਰਤ ਕਰਨ ਨਾਲ ਜਦੋਂ ਕੋਈ ਪਾਠਕ ਆਪਣਾ ਡਿਫੌਲਟ ਫੌਂਟ ਸਾਈਜ਼ ਬਦਲਦਾ ਹੈ ਤਾਂ ਸਭ ਕੁਝ ਸਕੇਲ ਹੋ ਸਕਦਾ ਹੈ।
ਇੱਕ ਵੱਖਰਾ em ਕੰਟੈਕਸਟ ਸਾਈਜ਼ ਕਿਉਂ ਹੈ?
em ਇਸਦੇ ਆਪਣੇ ਐਲੀਮੈਂਟ ਦੇ ਫੌਂਟ ਸਾਈਜ਼ ਦੇ ਅਨੁਪਾਤ ਵਿੱਚ ਹੁੰਦਾ ਹੈ, ਜੋ ਕਿ ਹਮੇਸ਼ਾ ਰੂਟ ਨਹੀਂ ਹੁੰਦਾ। em ਨੂੰ ਸਹੀ ਢੰਗ ਨਾਲ ਪੜ੍ਹਨ ਲਈ em ਕੰਟੈਕਸਟ ਨੂੰ ਉਸ ਐਲੀਮੈਂਟ ਦੇ ਫੌਂਟ ਸਾਈਜ਼ 'ਤੇ ਸੈੱਟ ਕਰੋ, ਅਤੇ ਜਦੋਂ ਦੋਵੇਂ ਮੇਲ ਖਾਂਦੇ ਹੋਣ ਤਾਂ ਇਸਨੂੰ ਰੂਟ ਦੇ ਬਰਾਬਰ ਰੱਖੋ।
ਜੇਕਰ ਮੇਰਾ ਰੂਟ ਫੌਂਟ ਸਾਈਜ਼ 16px ਨਹੀਂ ਹੈ ਤਾਂ ਕੀ ਹੋਵੇਗਾ?
ਆਪਣੇ CSS ਨਾਲ ਮੇਲ ਕਰਨ ਲਈ ਰੂਟ ਫੌਂਟ ਸਾਈਜ਼ ਫੀਲਡ ਨੂੰ ਬਦਲੋ ਅਤੇ ਹਰ rem ਮੁੱਲ ਤੁਰੰਤ ਅੱਪਡੇਟ ਹੋ ਜਾਵੇਗਾ। ਹੇਠਾਂ ਦਿੱਤੀ ਤੁਰੰਤ ਸਾਰਣੀ ਆਮ 16px ਰੂਟ ਲਈ ਇੱਕ ਉਪਯੋਗੀ ਗਾਈਡ ਹੈ ਜਿਸ ਤੋਂ ਜ਼ਿਆਦਾਤਰ ਸਾਈਟਾਂ ਸ਼ੁਰੂ ਹੁੰਦੀਆਂ ਹਨ।