CSS padding-inline پرپروپتی
- ਪਿਛਲਾ ਪੰਨਾ padding-bottom
- ਅਗਲਾ ਪੰਨਾ padding-inline-end
تعلیم اور استعمال
عنصر کی padding-inline
یعنی اس کی رینک کی داخلی سمت میں، فلیپ سے مطلب کی فاصلت اور اس کی سائز کی سمت میں ہے۔ یہ درج ذیل کیئنداں کی کیئنداں کی نمائندگی کرتی ہیں:
padding-inline
کیئنداں کی قیمتیں مختلف طریقوں سے سیٹ کی جاسکتی ہیں:
اگر padding-inline کیتابی دو کیئنداں ہوں:
padding-inline: 10px 50px;
- شروعداتی کی ایندن پیدائش 10 پیایکس
- پایانداتی کی ایندن پیدائش 50 پیایکس
如果 padding-inline 属性有一个值:
padding-inline: 10px;
- ਸ਼ੁਰੂ ਅਤੇ ਅੰਤ ਦੀ ਪੈਡਿੰਗ ਦਾ ਮੁੱਲ 10px ਹੈ
CSS padding-inline
ਅਤੇ padding-block
ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ padding-top
ਅਤੇpadding-bottom
ਅਤੇpadding-left
ਅਤੇ padding-right
ਬਹੁਤ ਸਮਾਨ ਹੈ, ਪਰ padding-inline
ਅਤੇ padding-block
ਵਿਸ਼ੇਸ਼ਤਾ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਅਤੇ ਬਲਕ ਦਿਸ਼ਾ ਉੱਤੇ ਨਿਰਭਰ ਕਰਦੀ ਹੈ。
ਧਿਆਨ:ਸਬੰਧਤ CSS ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ writing-mode
ਅਤੇ direction
ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰਦੀ ਹੈ. ਇਹ ਤੱਤ ਦੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਵਿੱਚ ਸ਼ੁਰੂ ਅਤੇ ਅੰਤ ਸਥਾਨਾਂ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਕਰਦੀ ਹੈ ਅਤੇ padding-inline
ਵਿਸ਼ੇਸ਼ਤਾ ਦਾ ਨਤੀਜਾ. ਇੰਗਲਿਸ਼ ਪੰਨਿਆਂ ਵਿੱਚ, ਬਲਕ ਦਿਸ਼ਾ ਹੇਠਾਂ ਹੁੰਦੀ ਹੈ ਅਤੇ ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਸੱਜੇ ਤੋਂ ਵੱਲ ਹੁੰਦੀ ਹੈ.
ਇਨਸਟੈਂਸ
ਉਦਾਹਰਣ 1
ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦੋਵੇਂ ਤਰਫ਼ ਵਿੱਚ ਪੈਡਿੰਗ ਸੈਟ ਕਰੋ:
div { padding-inline: 50px; }
ਉਦਾਹਰਣ 2
when <div> ਤੱਤ ਦੇ writing-mode ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ ਨੂੰ vertical-rl ਦੇ ਰੂਪ ਵਿੱਚ ਸੈਟ ਕੀਤੇ ਜਾਣ ਤੇ, ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਹੇਠਾਂ ਹੁੰਦੀ ਹੈ ਜਿਸ ਨਾਲ ਤੱਤ ਦੇ ਸ਼ੁਰੂ ਅੰਗ ਨੂੰ ਸੱਜੇ ਤੋਂ ਉੱਪਰ ਅਤੇ ਅੰਤ ਅੰਗ ਨੂੰ ਸੱਜੇ ਤੋਂ ਨੀਚੇ ਹੁੰਦਾ ਹੈ:
div { writing-mode: vertical-rl; padding-inline: 10px 100px; }
ਉਦਾਹਰਣ 3
when <div> ਤੱਤ ਦੇ direction ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ ਨੂੰ rtl ਦੇ ਰੂਪ ਵਿੱਚ ਸੈਟ ਕੀਤੇ ਜਾਣ ਤੇ, ਇਨਲਾਈਨ ਦਿਸ਼ਾ ਦਾਖਲ ਹੁੰਦੀ ਹੈ ਜਿਸ ਨਾਲ ਤੱਤ ਦੇ ਸ਼ੁਰੂ ਅੰਗ ਨੂੰ ਸੱਜੇ ਤੋਂ ਵੱਲ ਅਤੇ ਅੰਤ ਅੰਗ ਨੂੰ ਸੱਜੇ ਤੋਂ ਵੱਲ ਹੁੰਦਾ ਹੈ:
div { direction: rtl; padding-inline: 10px 100px; }
CSS ਗਰੇਫਿਕਸਿਜ਼ਮ
padding-inline: auto|value|ਮੂਲ ਮੁੱਲ|ਇਨਹੈਰਿਟ;
ਵਿਸ਼ੇਸ਼ਤਾ ਮੁੱਲ
ਮੁੱਲ | ਵਰਣਨ |
---|---|
ਆਟੋ | ਮੂਲ ਮੁੱਲ |
length |
px, pt, cm ਆਦਿ ਆਕਾਰ ਇਕਾਈਆਂ ਨਾਲ ਦੂਰੀ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰੋ. ਨਕਾਰਾਤਮਕ ਮੁੱਲਾਂ ਨੂੰ ਮਨਜ਼ੂਰ ਨਹੀਂ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。 ਦੇਖੋ:CSS ਯੂਨਿਟ. |
% | ਪੁਰਾ ਪਿੱਛੇ ਵਿੱਚ ਪਿਛਲੇ ਤੱਤ ਦੇ ਆਕਾਰ ਦੇ ਪ੍ਰਤੀਸ਼ਤ ਦੇ ਰੂਪ ਵਿੱਚ ਦੂਰੀ ਨੂੰ ਨਿਰਧਾਰਿਤ ਕਰੋ。 |
ਮੂਲ ਮੁੱਲ | ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਉਸ ਦੇ ਮੂਲ ਮੁੱਲ ਨੂੰ ਸੈਟ ਕਰੋ. ਦੇਖੋ: ਮੂਲ ਮੁੱਲ. |
ਇਨਹੈਰਿਟ | ਆਪਣੇ ਮਾਤਾ ਤੱਤ ਤੋਂ ਇਸ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਇਨਹੈਰਿਟ ਕਰੋ. ਦੇਖੋ: ਇਨਹੈਰਿਟ. |
ਤਕਨੀਕੀ ਵੇਰਵੇ
ਮੂਲ ਮੁੱਲ: | ਆਟੋ |
---|---|
ਮੁਢਲੀਅਤ: | ਨਹੀਂ |
ਐਨੀਮੇਸ਼ਨ ਬਣਾਉਣਾ: | ਸਮਰੱਥਾ ਹੈ. ਦੇਖੋ:ਐਨੀਮੇਸ਼ਨ ਸਬੰਧਤ ਵਿਸ਼ੇਸ਼ਤਾਵਾਂ. |
ਵਰਜਨ: | ਸੀਐੱਸਐੱਸ3 |
ਜਾਵਾਸਕ੍ਰਿਪਟ ਗਰੇਫਿਕਸਿਜ਼ਮ: | object.style.paddingInline="100px 20px" |
ਬਰਾਉਜ਼ਰ ਸਮਰੱਥਾ
ਸਟੇਬਲ ਵਿੱਚ ਦਿਸਾਈ ਦੀ ਆਈਡੈਂਟੀਫਾਈਡ ਵਰਜਨ ਦਾ ਨਿਸ਼ਾਨ ਹੈ ਜਿਸ ਨੇ ਇਸ ਵਿਸ਼ੇਸ਼ ਅਤਿਰਿਕਤ ਸਮਰੱਥਾ ਨੂੰ ਪੂਰਾ ਕੀਤਾ ਹੈ。
ਚਰਾਮਸ | ਐਜ਼ | ਫਾਇਰਫਾਕਸ | ਸਫਾਰੀ | ਓਪਰਾ |
---|---|---|---|---|
87.0 | 87.0 | 66.0 | 14.1 | 73.0 |
ਸਬੰਧਤ ਪੰਨੇ
ਸਲਾਹਦਾਰੀਃCSS ڈائریکشن اٹری بیوٹ
ਸਲਾਹਦਾਰੀਃCSS padding-inline-end پرپروپتی
ਸਲਾਹਦਾਰੀਃCSS padding-inline-start پرپروپتی
ਸਲਾਹਦਾਰੀਃCSS padding-bottom پرپروپتی
ਸਲਾਹਦਾਰੀਃCSS padding-left پرپروپتی
ਸਲਾਹਦਾਰੀਃCSS padding-right پرپروپتی
ਸਲਾਹਦਾਰੀਃCSS padding-top پرپروپتی
ਸਲਾਹਦਾਰੀਃCSS writing-mode ਪ੍ਰਾਪਰਟੀ
- ਪਿਛਲਾ ਪੰਨਾ padding-bottom
- ਅਗਲਾ ਪੰਨਾ padding-inline-end