CSS ਟੈਕਸਟ-ਐਲਾਈਨ ਪ੍ਰਤੀਯੋਗਿਤਾ

ਵਿਆਖਿਆ ਅਤੇ ਵਰਤੋਂ

text-align ਪ੍ਰਤੀਭਾਵ ਇਲੀਮੈਂਟ ਵਿੱਚ ਟੈਕਸਟ ਦੇ ਪੱਧਰੀ ਮਿਸ਼ਰਣ ਸੈਟ ਕਰਦਾ ਹੈ。

ਇਹ ਪ੍ਰਤੀਭਾਵ ਪ੍ਰਤੀ ਲਾਈਨ ਬਕਸ ਦੇ ਕਿਸ ਨਿਰਧਾਰਿਤ ਨਾਲ ਮਿਲਣ ਦੇ ਨਾਲ ਨਾਲ ਬਲਕ ਇਲੀਮੈਂਟ ਦੇ ਅੰਦਰ ਟੈਕਸਟ ਦੇ ਹਰੀਫ਼ਾਂ ਦੇ ਪੱਧਰੀ ਮਿਸ਼ਰਣ ਸੈਟ ਕਰਦਾ ਹੈ। ਇਹ ਇਸ ਲਈ ਸਮਰਥ ਕਰਦਾ ਹੈ ਕਿ ਯੂਜ਼ਰ ਏਜੰਟ ਲਾਈਨ ਸਮੱਗਰੀ ਵਿੱਚ ਅੱਖਰਾਂ ਅਤੇ ਸ਼ਬਦਾਂ ਦਰਮਿਆਨ ਦੀ ਦੂਰੀ ਸੰਤੁਲਿਤ ਕਰ ਸਕੇ, ਜਿਸ ਨਾਲ justify ਮੁੱਲ ਸਮਰਥ ਹੁੰਦਾ ਹੈ; ਵੱਖ-ਵੱਖ ਯੂਜ਼ਰ ਏਜੰਟਾਂ ਵਿੱਚ ਵੱਖ-ਵੱਖ ਨਤੀਜੇ ਮਿਲ ਸਕਦੇ ਹਨ。

ਹੋਰ ਦੇਖੋ:

CSS ਸਿੱਖਿਆCSS ਟੈਕਸਟ

HTML DOM ਜਾਣਕਾਰੀ ਮੁੱਦਾtextAlign ਪ੍ਰਤੀਭਾਵ

ਉਦਾਹਰਣ

h1, h2, h3 ਐਲੀਮੈਂਟਾਂ ਦੇ ਟੈਕਸਟ ਮਿਸ਼ਰਣ ਸੈਟ ਕਰੋ:

h1 {text-align:center;}
h2 {text-align:left;}
h3 {text-align:right;}

ਖੁਦ ਦੂਜਾ ਪ੍ਰਯੋਗ ਕਰੋ

CSS ਗਰੰਥ

text-align: left|right|center|justify|initial|inherit;

ਪ੍ਰਤੀਭਾਵ

ਮੁੱਲ ਵਰਣਨ
left ਲੇਖ ਨੂੰ ਬਾਈਚ ਲੈਣ ਲਈ ਟੈਕਸਟ ਮਿਸ਼ਰਣ ਕਰੋ। ਮੂਲ ਮੁੱਲ: ਬਰਾਉਜ਼ਰ ਦੀ ਤਰਫੋਂ ਨਿਰਧਾਰਿਤ ਹੈ。
right 把文本排列到右边。
center 把文本排列到中间。
justify 实现两端对齐文本效果。
inherit 规定应该从父元素继承 text-align 属性的值。

值 justify

最后一个水平对齐属性是 justify，它会带来自己的一些问题。

值 justify 可以使文本的两端都对齐。在两端对齐文本中，文本行的左右两端都放在父元素的内边界上。然后，调整单词和字母间的间隔，使各行的长度恰好相等。您也许已经注意到了，两端对齐文本在打印领域很常见。不过在 CSS 中，还需要多做些考虑。

要由用户代理（而不是 CSS）来确定两端对齐文本如何拉伸，以填满父元素左右边界之间的空间。例如，有些浏览器可能只在单词之间增加额外的空间，而另外一些浏览器可能会平均分布字母间的额外空间（不过 CSS 规范特别指出，如果 letter-spacing 属性指定为一个长度值，“用户代理不能进一步增加或减少字符间的空间”）。还有一些用户代理可能会减少某些行的空间，使文本挤得更紧密。所有这些做法都会影响元素的外观，甚至改变其高度，这取决于用户代理的对齐选择影响了多少文本行。

CSS ਵੀ ਨਾਲੀ ਦੇ ਹੱਲਾਣ ਦੇ ਸਮਾਧਾਨ ਦੀ ਸੂਚਨਾ ਨਹੀਂ ਦਿੰਦਾ (ਟਿੱਪਣੀ 1)। ਮੁੱਖ ਤੌਰ 'ਤੇ ਦੋ-ਤਰਫ਼ ਸਮਾਯੋਜਿਤ ਟੈਕਸਟ ਵਿੱਚ ਨਾਲੀ ਨਾਲ ਲੰਮੇ ਸ਼ਬਦਾਂ ਨੂੰ ਦੋ ਹਿੱਸਿਆਂ ਵਿੱਚ ਰੱਖਿਆ ਜਾਂਦਾ ਹੈ ਤਾਕਿ ਸ਼ਬਦਾਂ ਵਿੱਚ ਦੂਰੀ ਘਟ ਸਕੇ ਅਤੇ ਟੈਕਸਟ ਲਾਈਨ ਦੇ ਦਿਸ਼ਾ ਦਿਸ਼ਾ ਵਿੱਚ ਬਿਹਤਰ ਦਿਸੇ। ਲੇਕਿਨ CSS ਵਿੱਚ ਨਾਲੀ ਦੇ ਵਿਵਹਾਰ ਦੀ ਨਿਯਮਾਂ ਨਹੀਂ ਹੋਣ ਨਾਲ ਯੂਜ਼ਰ ਏਜੰਟ ਆਟੋਮੈਟਿਕ ਰੂਪ ਵਿੱਚ ਨਾਲੀ ਜੋੜਨ ਦੀ ਸੰਭਾਵਨਾ ਨਹੀਂ ਹੈ। ਇਸ ਲਈ CSS ਵਿੱਚ ਦੋ-ਤਰਫ਼ ਸਮਾਯੋਜਿਤ ਟੈਕਸਟ ਪ੍ਰਿੰਟ ਵਿੱਚ ਬਿਹਤਰ ਨਹੀਂ ਦਿਸਦਾ, ਖਾਸ ਕਰਕੇ ਜਿਸ ਵਿੱਚ ਪੱਧਰ ਬਹੁਤ ਚੰਗੇ ਨਹੀਂ ਹੁੰਦਾ ਅਤੇ ਹਰ ਪੰਨੀ ਵਿੱਚ ਸਿਰਫ ਕੁਝ ਸ਼ਬਦ ਰੱਖੇ ਜਾ ਸਕਦੇ ਹਨ। ਸਟਾਈਲ ਤਰੀਕੇ ਨਾਲ ਸਰਕਾਰੀ ਤੌਰ 'ਤੇ ਨਹੀਂ ਹੈ, ਲੇਕਿਨ ਇਸ ਦੇ ਦੋਸ਼ ਨੂੰ ਧਿਆਨ ਵਿੱਚ ਰੱਖਣਾ ਚਾਹੀਦਾ ਹੈ。

ਟਿੱਪਣੀ 1:CSS ਵਿੱਚ ਨਾਲੀ ਦੇ ਹੱਲਾਣ ਦੀ ਸੂਚਨਾ ਨਹੀਂ ਹੈ ਕਿਉਂਕਿ ਵੱਖ-ਵੱਖ ਭਾਸ਼ਾਵਾਂ ਵਿੱਚ ਨਾਲੀ ਦੀ ਵਿਵਹਾਰਕ ਨਿਯਮਾਂ ਵੱਖ-ਵੱਖ ਹਨ। ਨਿਯਮਾਂ ਵਿੱਚ ਅਜਿਹੇ ਸੰਭਾਵਨਾ ਨਾਲ ਅਸੰਪੂਰਨ ਹੋਣ ਵਾਲੇ ਨਿਯਮਾਂ ਨੂੰ ਸਮਾਯੋਜਿਤ ਕਰਨ ਦੀ ਕੋਸ਼ਿਸ਼ ਨਹੀਂ ਕੀਤੀ ਗਈ ਸੀ ਬਲਕਿ ਇਹ ਪ੍ਰਸ਼ਨ ਨਹੀਂ ਉਠਾਇਆ ਗਿਆ ਸੀ。

ਤਕਨੀਕੀ ਵੇਰਵੇ

ਮੂਲ ਮੁੱਲ: ਜੇਕਰ direction ਵਿਸ਼ੇਸ਼ਤਾ ltr ਹੈ ਤਾਂ ਮੂਲ ਮੁੱਲ left ਹੈ; ਅਗਰ direction rtl ਹੈ ਤਾਂ right ਹੈ。
ਵਿਰਾਸਤੀਤਾ: ਹਾਂ
ਸੰਸਕਰਣ: CSS1
JavaScript ਵਿਆਕਰਣ: object.style.textAlign="right"

ਹੋਰ ਉਦਾਹਰਣ

ਟੈਕਸਟ ਸਮਾਯੋਜਨ
ਇਸ ਉਦਾਹਰਣ ਵਿੱਚ ਪ੍ਰਦਰਸ਼ਿਤ ਕੀਤਾ ਗਿਆ ਹੈ ਕਿ ਕਿਵੇਂ ਟੈਕਸਟ ਨੂੰ ਸਮਾਯੋਜਿਤ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ。

ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ

ਸਾਰੇ ਪੱਧਰਾਂ ਦੇ ਅਕਾਰ ਵਿੱਚ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਿਤ ਹੋਣ ਵਾਲੇ ਪਹਿਲੇ ਬਰਾਉਜ਼ਰ ਦੀ ਸੰਖਿਆ ਨੂੰ ਤਾਲੀਕਾ ਵਿੱਚ ਦਰਸਾਇਆ ਗਿਆ ਹੈ。

ਚਰਮੋਈ IE / ਐਜ਼ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
1.0 3.0 1.0 1.0 3.5