Page 81 - COPA VOL II of II - TP -Punjabi
P. 81
CSS ਵੈੱਬਸਾਈਟ ਲੇਆਉਟ • 3-ਕਾਲਮ ਲੇਆਉਟ: ਇਹ ਿੈਬਸਾਈਟ ਲੇਆਉਟ ਭਜਆਦਾਤਰ ਡੈਸਕਟਾਪ
ਲਈ ਿਰਭਤਆ ਜਾਂਦਾ ਹੈ।
ਇੱਕ ਿੈਬਸਾਈਟ ਨੂੰ ਅਕਸਰ ਭਸਰਲੇਿ, ਮੀਨੂ, ਸਮੱਗਰੀ ਅਤੇ ਇੱਕ ਫੁੱਟਰ ਭਿੱਚ
ਿੰਭਡਆ ਜਾਂਦਾ ਹੈ:
ਸਮੱਗਰੀ ਸੈਕਸ਼ਨ: ਸਮੱਗਰੀ ਸੈਕਸ਼ਨ ਿੈੱਬਸਾਈਟ ਦਾ ਮੁੱਿ ਿਾਗ ਹੈ। ਉਪਿੋਗਤਾ
ਐਨ-ਕਾਲਮ ਲੇਆਉਟ ਭਿੱਚ ਸਮੱਗਰੀ ਿਾਗ ਨੂੰ ਿੰਡ ਸਕਦਾ ਹੈ।
ਸਿ ਤੋਂ ਆਮ ਿਾਕੇ ਹਨ:
• 1-ਕਾਲਮ ਲੇਆਉਟ: ਇਹ ਭਜਆਦਾਤਰ ਮੋਬਾਈਲ ਲੇਆਉਟ ਲਈ ਿਰਭਤਆ
ਜਾਂਦਾ ਹੈ।
• 2-ਕਾਲਮ ਲੇਆਉਟ: ਇਹ ਿੈਬਸਾਈਟ ਲੇਆਉਟ ਭਜਆਦਾਤਰ ਟੈਬਲੇਟਾਂ ਜਾਂ
ਲੈਪਟਾਪਾਂ ਲਈ ਿਰਭਤਆ ਜਾਂਦਾ ਹੈ।
ਉਪਿੋਗਤਾ ਇੱਕ ਜਿਾਬਦੇਹ ਲੇਆਉਟ ਿੀ ਬਣਾ ਸਕਦਾ ਹੈ ਭਜੱਿੇ ਸਕਰਰੀਨ ਆਕਾਰ
ਦੇ ਅਨੁਸਾਰ ਲੇਆਉਟ ਬਦਭਲਆ ਜਾਿੇਗਾ। ਹੇਠਾਂ ਭਦੱਤੀ ਉਦਾਹਰਣ ‘ਤੇ ਗੌਰ ਕਰੋ
ਭਜੱਿੇ ਸਕਰਰੀਨ ਦੀ ਚੌੜਾਈ 600px ਤੋਂ ਿੱਧ ਹੈ ਤਾਂ 3-ਕਾਲਮ ਲੇਆਉਟ ਹੋਿੇਗਾ
ਅਤੇ ਜੇਕਰ ਸਕਰਰੀਨ ਦੀ ਚੌੜਾਈ 400px ਤੋਂ 600px ਦੇ ਭਿਚਕਾਰ ਹੈ ਤਾਂ 2-ਕਾਲਮ
ਲੇਆਉਟ ਹੋਿੇਗਾ ਅਤੇ ਜੇਕਰ ਸਕਰਰੀਨ ਦਾ ਆਕਾਰ 400px ਤੋਂ ਘੱਟ ਹੈ ਤਾਂ
1-ਕਾਲਮ ਲੇਆਉਟ ਭਿਿਾਏਗਾ।
ਪ੍ਰੋਗ੍ਾਮ
<!DOCTYPE html>
<html>
<head>
< title>
Website Layout
< /title>
<style>
* {
box-sizing: border-box;
}
/* CSS property for header section */
.header {
background-color: green;
padding: 15px;
t ext-align: center;
}
/* CSS property for navigation menu */
.nav_menu {
background-color: #333;
}
IT ਅਤੇ ITES : COPA (NSQF - ਸੰਸ਼ੋਧਭਤ 2022) - ਅਿਭਆਸ 1.31.114 67
