CSS ਦਰਜਾ: ਮਿਸਾਲ

. ਲੇਆਉਟ-ਸ਼ੁਰੂਆਤ ਅਕਸਰ CSS ਦੁਆਰਾ ਸਥਿਤੀ ਤੱਤ ਨਾਲ ਮੁਸ਼ਕਲ ਹੈ. Position куда проще в освоении, чем кажется на первый взгляд. ਅਸਲ ਵਿਚ, CSS ਦਰਜਾ ਸੰਪਤੀ ਬਹੁਤ ਹੀ ਆਸਾਨ ਵੱਧ ਇਸ ਨੂੰ ਪਹਿਲੀ ਨਜ਼ਰ 'ਤੇ ਲੱਗਦਾ ਹੈ ਸਿੱਖਣ ਲਈ ਹੈ. ਨੂੰ ਸਿੱਖਣ ਨਾਲ, ਤੁਹਾਨੂੰ ਜਿਸ ਨਾਲ ਤੁਹਾਨੂੰ ਸਹੀ ਸਥਾਨ ਵਿੱਚ ਸਭ ਸਫ਼ੇ ਤੱਤ ਦਾ ਪ੍ਰਬੰਧ ਕਰ ਸਕਦੇ ਇੱਕ ਸ਼ਕਤੀਸ਼ਾਲੀ ਸੰਦ ਹੈ ਪ੍ਰਾਪਤ. добиться результата, нужно знать обо всех существующих значениях, поскольку принципы их действия сильно различаются ਪਰ ਕ੍ਰਮ ਨੂੰ ਨਤੀਜੇ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ, ਤੁਹਾਨੂੰ, ਸਾਰੇ ਮੌਜੂਦਾ ਮੁੱਲ ਬਾਰੇ ਪਤਾ ਕਰਨ ਦੀ ਲੋੜ ਹੈ, ਕਿਉਕਿ ਆਪਣੇ ਕੰਮ ਦੇ ਅਸੂਲ ਬਹੁਤ ਹੀ ਵੱਖ ਵੱਖ ਹੁੰਦੇ ਹਨ

ਦਸਤਾਵੇਜ਼ ਵਹਾਅ ਦੇ ਖਾਸ

работает с потоком веб-страницы. ਦਰਜਾ CSS ਵੈੱਬ ਸਫ਼ੇ ਵਹਾਅ ਦੇ ਨਾਲ ਕੰਮ ਕਰਦਾ ਹੈ. ਇਸ ਦਾ ਕੀ ਮਤਲਬ ਹੈ? html- разметке. ਮੂਲ ਰੂਪ ਵਿੱਚ, ਸਾਰੇ ਸਫ਼ੇ ਤੱਤ, ਜਿਸ ਵਿੱਚ ਕ੍ਰਮ ਤੁਹਾਨੂੰ html- ਮਾਰਕਅਪ ਵਿੱਚ ਬਣਾਇਆ ਵਿਚ ਪ੍ਰਬੰਧ ਕੀਤਾ ਗਏ ਹਨ. header расположен над тегом footer, то и на странице он будет отображаться выше. ਸਿਰਲੇਖ ਟੈਗ ਟੈਗ ਫੁੱਟਰ 'ਤੇ ਸਥਿਤ ਹੈ, ਅਤੇ ਫਿਰ, ਜੇ ਇਸ ਨੂੰ ਸਫ਼ੇ ਉਪਰ ਪ੍ਰਦਰਸ਼ਿਤ ਕੀਤਾ ਜਾਵੇਗਾ. footer в html над «хедером», «подвал» страницы будет отображаться над «шапкой». ਇਸ ਦੇ ਉਲਟ, ਜੇ ਕਿਸੇ ਕਾਰਨ ਕਰਕੇ ਤੁਹਾਨੂੰ "Heder" 'ਤੇ HTML ਵਿੱਚ ਇੱਕ ਫੁੱਟਰ ਰੱਖਣ ਦਾ ਫੈਸਲਾ, "ਤਹਿਖ਼ਾਨੇ" ਸਫ਼ਾ "ਕੈਪ" ਉਪਰ ਪ੍ਰਦਰਸ਼ਿਤ ਕੀਤਾ ਜਾਵੇਗਾ. ਇਸ ਮਾਮਲੇ ਵਿੱਚ, ਬਲਾਕ-ਪੱਧਰ ਦੇ ਤੱਤ ਸਾਰੀ ਚੌੜਾਈ ਨੂੰ ਉਪਲੱਬਧ ਰੱਖਿਆ. ਛੋਟੇ-ਅੱਖਰ, ਬਦਲੇ ਵਿੱਚ, ਇੱਕ ਕਤਾਰ ਵਿੱਚ ਪ੍ਰਬੰਧ ਕੀਤਾ ਗਏ ਹਨ, ਜਦਕਿ ਨਾ ਇਹ ਸਭ ਲੈ, ਅਤੇ ਫਿਰ ਨਵ ਇੱਕ ਕਰਨ ਲਈ ਤਬਦੀਲ ਕੀਤਾ ਜਾਵੇਗਾ. ਇਹ ਵਿਧੀ "ਦਸਤਾਵੇਜ਼ ਦੇ ਵਹਾਅ ਨੂੰ." ਕਿਹਾ ਗਿਆ ਹੈ

ਵਹਾਅ ਵਿਵਹਾਰ ਨੂੰ ਵਰਤਿਆ ਦਰਜਾ ਸੰਪਤੀ ਨੂੰ ਤਬਦੀਲ ਕਰਨ ਲਈ . CSS ਵਿੱਚ. float, но его мы рассматривать не будем. ਇਸ ਵਿਚ ਇਹ ਵੀ ਫਲੋਟ ਦੀ ਵਿਸ਼ੇਸ਼ਤਾ ਦੇ ਕਾਰਨ ਵੱਖ ਵੱਖ ਹੋ ਸਕਦਾ ਹੈ, ਪਰ ਇਸ ਨੂੰ ਮੰਨਿਆ ਜਾ ਨਹੀ ਜਾਵੇਗਾ. ਸਥਿਤੀ ਦੇ ਜੀਅ ਨਾਲ ਆਮ ਸਟਰੀਮ, ਜਿਸ ਦੇ ਬਾਅਦ ਇਸ ਨੂੰ ਵਰਤਾਓ ਕਰਨ ਲਈ ਸ਼ੁਰੂ ਕਰੇਗਾ ਤੱਕ "ਡਿੱਗ" ਕਰਨ ਲਈ ਕੀਤੀ ਜਾ ਸਕਦੀ ਹੈ. ਕਿਸ ਬਿਲਕੁਲ - ਇਸ ਜਾਇਦਾਦ ਦੀ ਵਰਤੀ ਮੁੱਲ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ.

CSS ਦਰਜਾ: ਸਥਿਰ

или статическое позиционирование, является значением по умолчанию для всех блоков html, которые вы создали. ਦਰਜਾ: ਸਥਿਰ, ਜ ਸਥਿਰ ਸਥਿਤੀ ਨੂੰ ਸਭ ਨੂੰ HTML ਬਲਾਕ ਤੁਹਾਨੂੰ ਬਣਾਇਆ ਹੈ, ਜੋ ਕਿ ਇਸ ਲਈ ਮੂਲ ਹੈ. ਆਮ ਹਾਲਾਤ ਦੇ ਤਹਿਤ, ਤੁਹਾਨੂੰ ਉਸ ਨਾਲ ਨਜਿੱਠਣ ਲਈ ਹੈ, ਨਾ ਹੈ. static. ਕਿਸੇ ਵੀ ਬਲਾਕ ਜ ਲਾਈਨ ਕਿਸੇ ਵੀ ਸਾਰੇ ਸਥਾਨ 'ਤੇ ਪ੍ਰਭਾਸ਼ਿਤ ਹੈ, ਜੇ ਹੈ, ਨਾ, ਇਸ ਲਈ ਇਸ ਨੂੰ ਜ਼ਰੂਰੀ ਸਥਿਰ ਹੈ. ਸਫ਼ੇ 'ਤੇ ਹੈ, ਜੋ ਕਿ ਭਾਗ ਨੂੰ ਵਹਾਅ ਦੇ ਅਨੁਸਾਰ ਵੇਖਾਇਆ ਗਿਆ ਹੈ. right/left или top/bottom, никакого эффекта не будет. ਤੁਹਾਨੂੰ ਉਸ ਦੀ ਜਾਇਦਾਦ ਦਾ ਅਧਿਕਾਰ / ਖੱਬੇ ਜ ਚੋਟੀ ਦੇ / ਤਲ ਦਿਖਾਉਣ, ਜੇ, ਕੋਈ ਪ੍ਰਭਾਵ ਹੋ ਜਾਵੇਗਾ.

CSS ਦਰਜਾ: ਹੱਲ ਕੀਤਾ

оказывается вне нормального потока документа. ਜਦ ਇਸ ਸੰਪਤੀ ਨੂੰ ਵਰਤ ਕੇ, ਤੱਤ ਦਸਤਾਵੇਜ਼ ਦੇ ਆਮ ਵਹਾਅ ਬਾਹਰ ਹੈ. относительно окна браузера, независимо от того, как размещаются прочие компоненты. ਹੁਣ ਉਸ ਦੀ ਸਥਿਤੀ ਬਰਾਊਜ਼ਰ ਵਿੰਡੋ ਦੇ ਮੁਤਾਬਕ ਹਿਸਾਬ ਹੈ, ਪਰਵਾਹ ਕਿਸ ਹੋਰ ਭਾਗ ਸਥਿਤ ਹਨ. : fixed отправится в верхнюю часть страницы, прижмется к краю окна браузера, а прочие элементы займут его место в соответствии с потоком. ਹੋਰ ਸ਼ਬਦ ਵਿੱਚ, ਦੀ ਸਥਿਤੀ ਦੇ ਨਾਲ ਇੱਕ ਬਲਾਕ: ਹੱਲ ਕੀਤਾ ਸਫ਼ੇ ਦੇ ਸਿਖਰ, ਬਰਾਊਜ਼ਰ ਵਿੰਡੋ ਦੇ ਕਿਨਾਰੇ ਦੇ ਖਿਲਾਫ ਦਬਾਇਆ ਨੂੰ ਛੱਡ, ਅਤੇ ਹੋਰ ਤੱਤ ਦਾ ਵਹਾਅ ਅਨੁਸਾਰ ਇਸ ਦੀ ਜਗ੍ਹਾ ਲੈ.

ਹੱਲ ਕੀਤਾ ਸਥਿਤੀ ਤੱਤ ਦੀ ਮੁੱਖ ਵਿਸ਼ੇਸ਼ਤਾ ਹੈ ਕਿ ਉਹ ਹੋਰ ਬਲਾਕ ਅਤੇ ਸਫ਼ੇ ਸਤਰ ਉੱਤੇ ਸਕਦਾ ਹੈ. : fixed будет будто бы оставаться на месте, не исчезая с экрана. ਦਰਜਾ ਦੇ ਨਾਲ ਬਲਾਕ ਸਕਰੋਲਿੰਗ ਜਦ: ਹੱਲ ਕੀਤਾ ਸ਼ਾਇਦ ਸਕਰੀਨ ਤੱਕ ਅਲੋਪ ਬਿਨਾ ਜਗ੍ਹਾ ਵਿੱਚ ਰਹੇਗਾ. ਜੇਕਰ ਤੁਹਾਨੂੰ ਨੈਵੀਗੇਟ ਕਰਨ ਲਈ ਜ, ਜੋ ਕਿ ਉਪਭੋਗੀ ਨੂੰ ਹਮੇਸ਼ਾ ਲਈ ਪਹੁੰਚ ਹੋਣੀ ਚਾਹੀਦੀ ਹੈ ਕਰਨ ਦੀ ਲੋੜ ਹੈ ਵਰਗੇ, ਇਹ ਫਾਇਦੇਮੰਦ ਹੈ. ਜੇਕਰ ਤੁਹਾਨੂੰ ਸਫ਼ੇ ਦੀ ਇੱਕ ਨੂੰ ਕੁਝ ਹਿੱਸੇ ਵਿਚ ਇੱਕ ਤੇਜ਼ ਪੱਤਰੀ ਬਟਨ ਨੂੰ ਰੱਖਣ ਲਈ ਚਾਹੁੰਦੇ ਹੋ ਨਿਸ਼ਚਿਤ ਨੂੰ ਵੀ ਵਰਤਿਆ ਗਿਆ ਹੈ.

CSS ਦਰਜਾ: ਰਿਸ਼ਤੇਦਾਰ

. ਇਸ ਸੰਪਤੀ ਨੂੰ ਇਸਤੇਮਾਲ ਕਰਨ ਨਾਲ ਰਿਸ਼ਤੇਦਾਰ ਦੀ ਸਥਿਤੀ ਲਈ ਕਿਹਾ ਗਿਆ ਹੈ. : relative, тот останется на своем месте. ਜੇਕਰ ਤੁਹਾਨੂੰ ਇਕਾਈ ਨੂੰ ਸੰਪਤੀ ਸਥਿਤੀ ਲਈ ਸੈੱਟ ਕਰੋ, ਜੇ: ਰਿਸ਼ਤੇਦਾਰ, ਉਹ ਇਸ ਦੀ ਜਗ੍ਹਾ ਵਿੱਚ ਰਹੇਗਾ. right/left и top/bottom. ਪਹਿਲੀ ਨਜ਼ਰ 'ਤੇ, ਕੁਝ ਵੀ ਬਹੁਤ ਕੁਝ ਹੁੰਦਾ ਹੈ, ਪਰ ਸਾਰੇ ਤਬਦੀਲ ਕਰੋ, ਜੇ ਹੋਰ ਅੱਗੇ ਵਰਤਣ ਦਾ ਦਰਜਾ ਸੱਜੇ / ਖੱਬੇ ਅਤੇ ਚੋਟੀ ਦੇ / ਤਲ. ਉਹ ਇਸ ਦੇ ਟਿਕਾਣੇ ਨੂੰ ਭਾਗ ਨੂੰ ਰਿਸ਼ਤੇਦਾਰ ਦੀ ਲਹਿਰ ਨੂੰ ਕੰਟਰੋਲ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾ ਸਕਦਾ ਹੈ. останутся на своих положениях, не обращая внимания на освободившееся место . ਜਿੱਥੇ ਬਲਾਕ ਜ ਲਾਈਨ ਵਰਤਿਆ ਜਾਦਾ ਹੈ 'ਤੇ, ਇੱਕ ਖਾਲੀ ਸਪੇਸ ਹੋ ਜਾਵੇਗਾ - ਹੋਰ ਤੱਤ, ਆਪਣੇ ਅਹੁਦੇ ਵਿੱਚ ਰਹਿਣ ਖਾਲ ਕਰਨ ਲਈ ਧਿਆਨ ਦੇਣ ਨਾ ਕਰੋ.

ਜਦ ਤੁਹਾਨੂੰ ਜਾਣ ਵਾਲੇ ਭਾਗ ਦੀ ਸਫ਼ੇ ਦੇ ਆਲੇ-ਦੁਆਲੇ ਦੇ ਹਿੱਸੇ ਦੀ ਸਥਿਤੀ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਨਹੀ ਹੈ. ਉਹ, ਜਗ੍ਹਾ ਵਿੱਚ ਰਹਿੰਦੇ ਹਨ, ਪਰ ਮੁਕਾਬਲਤਨ ਸਥਿਤੀ ਬਲਾਕ ਨੂੰ ਬਲਾਕ ਕਰ ਸਕਦਾ ਹੈ ਜਾਵੇਗਾ. ਆਪਣੇ ਆਪ ਨੂੰ ਵਿੱਚ, ਇਸ ਸੰਪਤੀ ਨੂੰ ਘੱਟ ਹੀ ਵਰਤਿਆ ਗਿਆ ਹੈ. ਆਮ ਤੌਰ 'ਤੇ ਇਸ ਨੂੰ ਹੇਠ ਦਿੱਤੀ ਸਰੂਪ ਨਾਲ ਜੋੜ ਕੇ ਵਰਤਿਆ ਗਿਆ ਹੈ.

ਸੰਪੂਰਣ

ਸਭ ਦਿਲਚਸਪ ਅਤੇ ਸਭ ਅਕਸਰ ਵਰਤਿਆ ਚੋਣ ਦੇ ਇੱਕ ਹੈ. ਵਿਸ਼ੇਸ਼ਤਾ ਦਰਜਾ ਵਰਤ ਜਦ absolute положение компонента страницы будет высчитываться относительно окна браузера. ਸਫ਼ੇ ਭਾਗ ਨੂੰ ਦੇ ਪੂਰਾ ਸਥਿਤੀ ਦਾ ਮੁੱਲ ਦੇ ਨਾਲ ਬਰਾਊਜ਼ਰ ਵਿੰਡੋ ਦੇ ਮੁਤਾਬਕ ਦਾ ਹਿਸਾਬ ਕੀਤਾ ਜਾਵੇਗਾ. элементы (не являющиеся абсолютно позиционированными) словно «забудут» о существовании «собрата» с Position : absolute и займут его место в потоке. ਹੋਰ ਤੱਤ (ਗੈਰ-ਬਿਲਕੁਲ ਸਥਿਤੀ) ਵਰਗੇ ਦਰਜਾ ਦੀ ਮੌਜੂਦਗੀ ਦੀ ਹੈ "ਭਰਾ" ਬਾਰੇ "ਭੁੱਲ": ਅਸਲੀ ਅਤੇ ਸਟਰੀਮ 'ਚ ਉਸ ਦੀ ਜਗ੍ਹਾ ਲੈ ਜਾਵੇਗਾ. : fixed, но есть и серьезные различия. ਇਹ ਲੱਗਦਾ ਹੈ ਕਿ ਸਭ ਕੁਝ ਹੈ, ਜੋ ਕਿ ਬਿਲਕੁਲ ਦਰਜਾ ਦੇ ਮਾਮਲੇ ਵਿੱਚ ਦੇ ਰੂਪ ਵਿੱਚ ਹੀ ਹੁੰਦਾ ਹੈ: ਹੱਲ ਕੀਤਾ ਹੈ, ਪਰ ਮਹੱਤਵਪੂਰਨ ਅੰਤਰ ਹਨ.

top/right/bottom/left. ਪਹਿਲੀ ਗੱਲ, ਤੱਤ ਦੀ ਸਥਿਤੀ ਨੂੰ ਮੁਫ਼ਤ ਕੰਟਰੋਲ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ - ਇਸ ਸੰਪਤੀ ਨੂੰ ਚੋਟੀ ਦੇ / ਸੱਜੇ / ਤਲ / ਛੱਡ ਦਿੱਤਾ ਲਈ ਵਰਤਿਆ ਜਾਦਾ ਹੈ. bottom : 100px, блок «оттолкнется» от нижней част страницы на 100 пикселей. ਉਦਾਹਰਨ ਲਈ, ਜੇਕਰ ਤੁਹਾਨੂੰ ਤਲ ਦੇ ਮੁੱਲ: 100px, ਬਲਾਕ ਸਫ਼ੇ 100 ਪਿਕਸਲ ਦੇ ਹੇਠਲੇ "ਬੰਦ ਧੱਕਣ". ਦੂਜਾ, ਸਕਰੋਲਿੰਗ ਜਦ "ਅਸਲੀ" ਹਿੱਸੇ ਦੀ ਬਜਾਏ ਇੱਕ ਸਫ਼ੇ ਤੇ ਜਾਣ ਲਈ ਹੋਣ ਦੇ ਸਥਾਨ ਵਿੱਚ ਰਹੇਗਾ.

ਮਾਤਾ ਤੱਤ ਨਾਲ ਗੱਲਬਾਤ ਪੂਰਾ ਯੂਨਿਟ

ਤੁਹਾਨੂੰ ਬਿਲਕੁਲ ਸਥਿਤੀ ਨੂੰ ਹਿੱਸੇ 'ਤੇ ਹੋਰ ਵੀ ਸਹੀ ਕੰਟਰੋਲ ਪ੍ਰਾਪਤ ਕਰ ਸਕਦਾ ਹੈ. : fixed, relative или absolute. ਇਹ ਕਰਨ ਲਈ, ਤੁਹਾਨੂੰ ਇਸ ਦੀ ਮਾਤਾ ਸੰਪਤੀ ਦਰਜਾ ਸੈੱਟ ਕਰਨ ਦੀ ਲੋੜ ਹੈ: ਹੱਲ ਕੀਤਾ, ਰਿਸ਼ਤੇਦਾਰ ਜ ਪੂਰਾ.

ਇਕ ਮਿਸਾਲ ਉੱਤੇ ਗੌਰ. div с классом relative-div, внутри которого размещается div с классом absolute-div. ਤੁਹਾਨੂੰ ਰਿਸ਼ਤੇਦਾਰ-Div ਦੀ ਇੱਕ ਕਲਾਸ ਹੈ, ਜੋ ਅੰਦਰ ਪੂਰਾ-Div ਦੀ ਕਲਾਸ ਦੇ ਨਾਲ ਇੱਕ Div ਰੱਖਿਆ ਗਿਆ ਹੈ ਦੇ ਨਾਲ ਇੱਕ Div ਹੈ. : absolute. ਅਸਲੀ: ਸਾਨੂੰ ਇਨਡੋਰ ਯੂਨਿਟ ਸੰਪਤੀ ਸਥਿਤੀ ਲਈ ਸੈੱਟ ਕਰੋ. ਉਸ ਨੇ ਤੁਰੰਤ ਸਟਰੀਮ ਤੱਕ "ਬੰਦ ਕਰਦਾ ਹੈ" ਅਤੇ, ਕਿਉਕਿ ਹੁਣ ਇਸ ਦੇ ਟਿਕਾਣੇ ਬਰਾਊਜ਼ਰ ਵਿੰਡੋ ਦੇ ਮੁਤਾਬਕ ਹਿਸਾਬ ਹੈ, ਸਿਖਰ 'ਤੇ ਕਿਤੇ ਹੈ. relative-div свойство Position : relative и «блудный сын» возвращается на место. ਹੁਣ ਕਲਾਸ ਰਿਸ਼ਤੇਦਾਰ-Div ਦਰਜਾ ਸੰਪਤੀ ਦੇ ਨਾਲ ਦਿੱਤੀ ਗਈ ਬਲਾਕ: ਰਿਸ਼ਤੇਦਾਰ ਅਤੇ "ਉਜਾੜੂ ਪੁੱਤਰ" ਦੀ ਜਗ੍ਹਾ ਵਿੱਚ ਵਾਪਸ ਹੈ. ਲਗਭਗ. ਅਸਲ ਵਿਚ, ਇਸ ਨੂੰ ਮਾਤਾ ਤੱਤ ਦੇ ਉੱਪਰ ਖੱਬੇ ਕੋਨੇ ਵਿੱਚ ਦਿਸਦਾ ਹੈ.

ਇਸ ਹੋ ਰਿਹਾ ਹੈ? : absolute. ਨਿਸ਼ਚਿਤ ਵਿਸ਼ੇਸ਼ਤਾ ਸਥਿਤੀ ਵਿਚ ਡੀਲ: ਅਸਲੀ. static, позиция начинает зависеть от родительского элемента. ਮੂਲ ਰੂਪ ਵਿੱਚ, ਇਸ ਦੇ ਟਿਕਾਣੇ ਆਪਣੇ ਬਰਾਊਜ਼ਰ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ, ਪਰ ਜੇਕਰ "ਮਾਤਾ" ਵੀ, ਪਰ ਕੁਝ ਵੀ ਸਥਿਰ ਦੇ ਤੌਰ ਤੇ ਖੜੀ ਹੈ, ਸਥਿਤੀ ਮਾਤਾ ਤੱਤ' ਤੇ ਨਿਰਭਰ ਕਰਨ ਲਈ ਸ਼ੁਰੂ ਹੁੰਦਾ ਹੈ. ਇਹ ਬਹੁਤ ਹੈ, ਕਿਉਕਿ ਤੁਹਾਡੇ ਬਰਾਊਜ਼ਰ ਵਿੰਡੋ ਦੇ ਮੁਤਾਬਕ proschityvaya ਵੱਡੀ ਗਿਣਤੀ ਨੂੰ ਬਿਨਾ ਕਿਤੇ ਵੀ ਭਾਗ ਨੂੰ ਰੱਖ ਸਕਦਾ ਹੈ. ਦਾਖਲਾ ਅਕਸਰ ਆਈਕਾਨ, ਬਟਨ ਅਤੇ ਹੋਰ ਛੋਟੇ ਇਕਾਈ ਰੱਖਣ ਲਈ ਵਰਤਿਆ ਗਿਆ ਹੈ.

ਦਰਜਾ CSS ਕਦਰਤ

ਮੁੱਖ ਮੁਸ਼ਕਲ ਸ਼ੁਰੂਆਤ ਦੇ ਇਕ ਵਰਟੀਕਲ ਅਤੇ ਹਰੀਜੱਟਲ ਤੱਤ center ਹੈ. , сделать это проще простого. ਠੀਕ ਦਰਜਾ ਸੰਪਤੀ ਵਰਤ ਕੇ, ਇਸ ਨੂੰ ਆਸਾਨ ਕਰ. CSS ਦਰਜਾ: ਕਦਰ 'ਤੇ ਪੂਰਾ ਹੇਠ ਸੈੱਟ ਕੀਤਾ ਗਿਆ ਹੈ. iv с классом absolute-div, который находится в «диве» с классом relative-div. ਦਾ ਕਹਿਣਾ ਹੈ ਕਿ ਤੁਹਾਨੂੰ ਇੱਕ ਕਲਾਸ d IV ਅਸਲੀ-Div ਹੈ, ਜੋ ਕਿ ਕਲਾਸ ਰਿਸ਼ਤੇਦਾਰ-Div ਨੂੰ "ਅਦਾਕਾਰਾ" ਵਿੱਚ ਹੈ ਕਰੀਏ. "ਮਾਤਾ" ਅਤੇ ਇਸ ਦੇ ਚੌੜਾਈ ਸਾਰੀ ਸਫ਼ੇ ਦੀ ਚੌੜਾਈ ਦੇ ਬਰਾਬਰ ਕਰਨ ਲਈ ਸਥਿਤੀ ਰਿਸ਼ਤੇਦਾਰ. и высоту 400 px, абсолютное позиционирование и по умолчанию располагается в верхнем левом углу родительского элемента. "ਸੰਤਾਨ" ਇੱਕ ਚੌੜਾਈ ਅਤੇ 400 px, ਸੰਪੂਰਣ ਦੀ ਇੱਕ ਉਚਾਈ ਹੈ, ਅਤੇ ਮਾਤਾ ਤੱਤ ਦੇ ਉੱਪਰਲੇ-ਖੱਬੇ ਕੋਨੇ ਵਿੱਚ ਮੂਲ ਰੂਪ ਵਿੱਚ ਸਥਿਤ ਹੈ.

top: 50 % и left: 50 %. 50% ਅਤੇ ਛੱਡ ਦਿੱਤਾ:: 50% - ਤੁਹਾਨੂੰ ਕੀ ਕਰਨ ਦੀ ਲੋੜ ਹੈ ਅਸਲੀ ਭਾਗ ਨੂੰ ਚੋਟੀ ਦੇ ਸੈੱਟ ਕਰਨ ਲਈ ਹੁੰਦਾ ਹੈ. ਲਗਭਗ ਕੀਤਾ! сдвинулся с места и оказался почти в центре, но не совсем. ਅਸਲੀ-Div ਬਜ ਅਤੇ ਲਗਭਗ ਕਦਰ ਵਿੱਚ ਸੀ, ਪਰ ਕਾਫ਼ੀ ਨਹੀ ਹੈ. ਦਾ ਮਤਲਬ ਹੈ "ਮਾਤਾ" ਉਸ ਦੇ ਅੰਤ ਨਾਲ ਸੰਬੰਧਿਤ ਹੈ, ਅਤੇ ਸਾਨੂੰ ਬਲਾਕ ਦੇ ਵਿੱਚਕਾਰ ਵਿੱਚ ਪ੍ਰਾਪਤ ਕਰਨ ਦੀ ਲੋੜ ਹੈ ਦੀ ਕਦਰ ਸਾਬਤ "ਸੰਤਾਨ." margin-left и margin-right со значениями -200 px. ਇਹ ਕਰਨ ਲਈ, ਤੁਹਾਨੂੰ ਉਸ ਮੁੱਲ -200 px ਨਾਲ ਫਰਕ-ਖੱਬੇ ਅਤੇ ਹਾਸ਼ੀਆ-ਸੱਜੇ ਨੂੰ ਪੁੱਛਣ ਦੀ ਲੋੜ ਹੈ. ਇਸ ਲਈ, ਸਾਨੂੰ ਇਸ ਦੀ ਉਚਾਈ ਅਤੇ ਚੌੜਾਈ ਦੇ ਅੱਧੇ 'ਤੇ ਬਿਲਕੁਲ ਸਥਿਤੀ ਬਲਾਕ ਸ਼ਿਫਟ. ਸਾਰੇ ਇਸ ਨੂੰ ਮੱਧ ਵਿੱਚ!

ਓਵਰਲੈਪ ਭਾਗ

ਸਮੱਸਿਆ ਮੁਸ਼ਕਲ ਹੋ ਸਕਦਾ ਹੈ, ਪਹਿਲੀ ਨਜ਼ਰ 'ਤੇ, ਆਪਣੇ "ਗੁਆਢੀਆ" ਨੂੰ ਸਥਿਤੀ ਤੱਤ "ਲਾਗੂ". : fixed будет перекрывать все, что расположено на странице. ਉਦਾਹਰਨ ਲਈ, ਭਾਗ ਨੂੰ ਦਰਜਾ: ਹੱਲ ਕੀਤਾ ਸਾਰੇ ਸਫ਼ੇ 'ਤੇ ਸਥਿਤ ਅਣਡਿੱਠਾ ਕਰ ਦਿੱਤਾ ਜਾਵੇਗਾ. z-index, однако помните, что оно работает только для позиционированных элементов. ਇਸ ਮੁਸ਼ਕਲ ਨੂੰ ਹੱਲ, ਜੇਕਰ ਤੁਹਾਨੂੰ z-ਇੰਡੈਕਸ ਦੀ ਵਿਸ਼ੇਸ਼ਤਾ ਨੂੰ ਵਰਤਣ, ਪਰ ਯਾਦ ਰੱਖੋ ਕਿ ਇਸ ਨੂੰ ਸਿਰਫ ਸਥਿਤੀ ਤੱਤ ਲਈ ਕੰਮ ਕਰਦਾ ਹੈ ਕਰ ਸਕਦਾ ਹੈ. ਇਸ ਅਨੁਸਾਰ, ਜੇ ਤੁਹਾਨੂੰ ਹੱਲ ਕੀਤਾ ਸਥਿਤੀ ਤੱਤ ਦੇ ਸਿਖਰ 'ਤੇ ਇੱਕ ਬਲਾਕ ਰੱਖਣ ਲਈ ਚਾਹੁੰਦੇ ਹੋ, ਇਸ ਯੂਨਿਟ ਨੂੰ ਵੀ ਸਥਿਤੀ ਨੂੰ ਸੈੱਟ ਕਰਨ ਦੀ ਲੋੜ ਹੋਵੇਗੀ. ਉਦਾਹਰਨ ਲਈ, ਇੱਕ ਰਿਸ਼ਤੇਦਾਰ.

учший способ освоить позиционирование – рассматривать примеры Position CSS, экспериментировать и пробовать что-то свое. ਇਕ ਵਧੀਆ ਤਰੀਕਾ ਸਥਿਤੀ ਪੰਗਾ ਕਰਨ ਲਈ - ਮੰਨਿਆ ਮਿਸਾਲ ਦਰਜਾ CSS, ਤਜਰਬਾ ਅਤੇ ਵੱਖ ਵੱਖ ਨੂੰ ਕੁਝ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰਨ. calc() – это даст возможность более гибко настраивать расположение. ਫੰਕਸ਼ਨ ਕੈਲਕ () ਨਾਲ ਜੋੜ ਕੇ ਇਸ ਨੂੰ ਵਰਤਣ ਲਈ ਸਿੱਖਣ ਦੀ ਕੋਸ਼ਿਸ਼ ਕਰੋ - ਇਹ ਸਥਿਤੀ ਨੂੰ ਠੀਕ ਕਰਨ ਦੀ ਵੱਡਾ ਲਚਕਤਾ ਨੂੰ ਯੋਗ ਹੋਵੇਗਾ. ਪਰ, ਯਾਦ ਰੱਖੋ ਕਿ ਇਸ ਸੰਪਤੀ ਸਾਰੀ "ਸ਼ੁੱਧ" ਸਫ਼ੇ ਨੂੰ ਬਣਾਉਣ ਲਈ ਤਿਆਰ ਨਹੀ ਹੈ. ਇਸ ਨਾਲ, ਤੁਹਾਨੂੰ ਮੁਕਾਬਲਤਨ ਛੋਟੇ ਤੱਤ ਜਾਣ ਦੀ ਲੋੜ ਹੈ, ਜ ਉਲਝਣ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ ਬਹੁਤ ਆਸਾਨ ਹੋ ਸਕਦਾ ਹੈ.