ಆಸ್ತಿ ಬ್ರೇಕ್-ಒಳಗೆಪ್ರಸ್ತುತ ಅಂಶದೊಳಗೆ ಪುಟ ವಿರಾಮಗಳು ಮತ್ತು ಕಾಲಮ್ಗಳನ್ನು ಜೋಡಿಸಲು ತತ್ವಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತದೆ. ಪೂರ್ವನಿಯೋಜಿತವಾಗಿ, ಪುಟ ಅಥವಾ ಕಾಲಮ್ ವಿರಾಮಗಳನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಇರಿಸಲಾಗುತ್ತದೆ ಮತ್ತು ಮೂಲ ಅಂಶಗಳಿಂದ ಆನುವಂಶಿಕವಾಗಿರುವುದಿಲ್ಲ. ಪುಟದ ಡಾಕ್ಯುಮೆಂಟ್‌ಗಳನ್ನು ಫಾರ್ಮ್ಯಾಟ್ ಮಾಡುವಾಗ ಮಾತ್ರ ತಪ್ಪಿಸುವ-ಪುಟ ಮೌಲ್ಯವನ್ನು ಬಳಸಲಾಗುತ್ತದೆ, ಉದಾಹರಣೆಗೆ ಮುದ್ರಿಸುವಾಗ ಮತ್ತು ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಪ್ರದರ್ಶಿಸಲಾದಂತಹ ಪುಟಗಳಿಲ್ಲದ ವೀಕ್ಷಣೆಗಳಿಗಾಗಿ ನಿರ್ಲಕ್ಷಿಸಲಾಗುತ್ತದೆ. ತಪ್ಪಿಸು-ಕಾಲಮ್ ಮೌಲ್ಯವನ್ನು ಬಹು-ಕಾಲಮ್ ಪಠ್ಯಕ್ಕಾಗಿ ಬಳಸಲಾಗುತ್ತದೆ.
ಮಾನ್ಯ ಮೌಲ್ಯಗಳು
- CSS2 CSS3 ಸ್ವಯಂ- ಪ್ರಸ್ತುತ ಅಂಶದ ಮೊದಲು ಸ್ವಯಂಚಾಲಿತ ಪುಟ ಅಥವಾ ಕಾಲಮ್ ಬ್ರೇಕ್ (ಡೀಫಾಲ್ಟ್)
- CSS2 CSS3 ತಪ್ಪಿಸಲು
- CSS3 ತಪ್ಪಿಸಿ-ಪುಟ- ಪ್ರಸ್ತುತ ಅಂಶದೊಳಗೆ ಪುಟ ವಿರಾಮವನ್ನು ರದ್ದುಗೊಳಿಸಿ
- CSS3 ತಪ್ಪಿಸಿ-ಕಾಲಮ್- ಪ್ರಸ್ತುತ ಅಂಶದ ಒಳಗೆ ಕಾಲಮ್ ಬ್ರೇಕ್ ಅನ್ನು ರದ್ದುಗೊಳಿಸುವುದು
ಬಳಸುವ ಉದಾಹರಣೆಗಳು
ಬ್ರೇಕ್-ಒಳಗೆ: ಆಟೋ; - ಏಕರೂಪದ ವಿತರಣೆ
ಕಾಲಮ್ಗಳ ನಡುವೆ ವಿಷಯದ ಏಕರೂಪದ ವಿತರಣೆ, ಇದರಲ್ಲಿ ಯಾವುದೇ ಅಂಶಗಳ ಒಳಗೆ ಅಥವಾ ನಡುವೆ ಅತ್ಯಂತ ಸೂಕ್ತವಾದ ಸ್ಥಳಗಳಲ್ಲಿ ವಿರಾಮಗಳನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಇರಿಸಲಾಗುತ್ತದೆ. ಸಮ ವಿತರಣೆಯೊಂದಿಗೆ, ಹೆಚ್ಚು ಅಥವಾ ಕಡಿಮೆ ಏಕರೂಪದ ಪಠ್ಯ ಸಾಂದ್ರತೆಯೊಂದಿಗೆ ಕಾಲಮ್ಗಳ ಎತ್ತರವು ಸರಿಸುಮಾರು ಒಂದೇ ಆಗಿರುತ್ತದೆ.
ಶೈಲಿ (ಕಾಲಮ್-ಎಣಿಕೆ: 3; ಕಾಲಮ್-ಅಂತರ: 2em; ಕಾಲಮ್-ನಿಯಮ: 1px ಘನ #666; )
ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ
ಒಡೆಯ-ಒಳಗೆ: ತಪ್ಪಿಸು-ಕಾಲಮ್; - ಕಾಲಮ್ ವಿರಾಮಗಳನ್ನು ರದ್ದುಗೊಳಿಸಿ
ಶೈಲಿ (ಕಾಲಮ್-ಎಣಿಕೆ: 3; ಕಾಲಮ್-ಅಂತರ: 2em; ಕಾಲಮ್-ನಿಯಮ: 1px ಘನ #666; ) .ಸ್ಟೈಲ್ ಡಿವ್ ( ಬ್ರೇಕ್-ಒಳಗೆ: ತಪ್ಪಿಸಿ-ಕಾಲಮ್; )
1 ನೇ ಬ್ಲಾಕ್ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ
2 ನೇ ಬ್ಲಾಕ್ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ
3 ನೇ ಬ್ಲಾಕ್ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ ಪಠ್ಯ.
ಬ್ರೇಕ್-ಇನ್ಸೈಡ್ ಆಸ್ತಿಯನ್ನು CSS 3 ಬಹು-ಕಾಲಮ್ ಲೇಔಟ್ ಮಾಡ್ಯೂಲ್ ವಿವರಣೆಯಲ್ಲಿ ವ್ಯಾಖ್ಯಾನಿಸಲಾಗಿದೆ, ಬ್ಲಾಕ್-ಲೆವೆಲ್ ಅಂಶಗಳಿಗೆ ಅನ್ವಯಿಸುತ್ತದೆ ಮತ್ತು ಎಲ್ಲಾ ಪುಟ ಮಾಧ್ಯಮದಲ್ಲಿ ಮಾನ್ಯವಾಗಿರುತ್ತದೆ, ಅದರ ಮೌಲ್ಯವು ಡಾಕ್ಯುಮೆಂಟ್ ಶ್ರೇಣಿಯಲ್ಲಿನ ಮೂಲ ಅಂಶದಿಂದ ಆನುವಂಶಿಕವಾಗಿಲ್ಲ ಮತ್ತು ಡೀಫಾಲ್ಟ್‌ಗೆ ಸ್ವಯಂ. ಆಸ್ತಿಯು ಪ್ರಸ್ತುತ ಎಲ್ಲಾ ಪ್ರಮುಖ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಬೆಂಬಲಿತವಾಗಿದೆ.
ಸಹ ನೋಡಿ:
- ಬ್ರೇಕ್-ಆಫ್ಟರ್ - ಅಂಶದ ನಂತರ ಕಾಲಮ್ ಅಥವಾ ಪುಟ ವಿರಾಮವನ್ನು ಹೊಂದಿಸುವ ನಿಯಮಗಳು
- ಬ್ರೇಕ್-ಬಿಫೋರ್ - ಅಂಶದ ಮೊದಲು ಕಾಲಮ್ ಅಥವಾ ಪುಟ ವಿರಾಮವನ್ನು ಹೊಂದಿಸುವ ನಿಯಮಗಳು
- -webkit-column-break-after - ಒಂದು ಅಂಶದ ನಂತರ ಕಾಲಮ್ ಬ್ರೇಕ್ ಅನ್ನು ಹೊಂದಿಸುವ ನಿಯಮಗಳು
- -webkit-column-break-before - ಒಂದು ಅಂಶದ ಮೊದಲು ಕಾಲಮ್ ಬ್ರೇಕ್ ಅನ್ನು ಹೊಂದಿಸುವ ನಿಯಮಗಳು
- -ವೆಬ್ಕಿಟ್-ಕಾಲಮ್-ಬ್ರೇಕ್-ಇನ್ಸೈಡ್ - ಎಲಿಮೆಂಟ್ ಒಳಗೆ ಕಾಲಮ್ ಬ್ರೇಕ್ ಅನ್ನು ಹೊಂದಿಸುವ ನಿಯಮಗಳು
ಘಟಕ CSS3 ಕಾಲಮ್‌ಗಳುನೀವು ವಿಷಯವನ್ನು ಸಂಘಟಿಸಲು ಅನುಮತಿಸುವ ಬಹು-ಕಾಲಮ್ ವಿನ್ಯಾಸವನ್ನು ವಿವರಿಸುತ್ತದೆ ಇದರಿಂದ ಅದು ವೃತ್ತಪತ್ರಿಕೆ ಅಥವಾ ನಿಯತಕಾಲಿಕದಂತೆಯೇ ಬಹು ಲಂಬ ಧಾರಕಗಳನ್ನು ವ್ಯಾಪಿಸುತ್ತದೆ. ಕಾಲಮ್ಗಳು ಶೀರ್ಷಿಕೆಗಳು, ಪಠ್ಯ, ಕೋಷ್ಟಕಗಳು, ಚಿತ್ರಗಳು ಮತ್ತು ಯಾವುದೇ ಇತರ ಇನ್‌ಲೈನ್ ಅಂಶಗಳನ್ನು ಒಳಗೊಂಡಿರಬಹುದು.
ಬಹು-ಕಾಲಮ್ ಮಾದರಿ
ಬ್ರೌಸರ್ ಬೆಂಬಲ
IE: 10
ಅಂಚು: 12
ಫೈರ್‌ಫಾಕ್ಸ್: 52, 2 -moz
Chrome: 50, 4 -ವೆಬ್ಕಿಟ್-
ಸಫಾರಿ: 9, 3.1 -ವೆಬ್ಕಿಟ್-
ಒಪೆರಾ: 37, 11.5 -ವೆಬ್ಕಿಟ್-
ಐಒಎಸ್ ಸಫಾರಿ: 9, 3.2 -ವೆಬ್ಕಿಟ್-
Android ಗಾಗಿ UC ಬ್ರೌಸರ್: 11.8
Android ಗಾಗಿ Chrome: 73
Samsung ಇಂಟರ್ನೆಟ್: 5, 4 -ವೆಬ್ಕಿಟ್-
ಹಳೆಯ ಪೋಸ್ಟ್
ನವೆಂಬರ್ 24, 2012
ಇಂಗ್ಲೆಂಡ್‌ನಲ್ಲಿನ 15 ಅತ್ಯಂತ ಆಕರ್ಷಕ ಸಣ್ಣ ಪಟ್ಟಣಗಳು
1. ಬರ್ವಿಕ್-ಆನ್-ಟ್ವೀಡ್
ನಾರ್ತಂಬ್ರಿಯಾ ಸಾಮ್ರಾಜ್ಯದ ಸಮಯದಲ್ಲಿ ಬರ್ವಿಕ್ ಅನ್ನು ಆಂಗ್ಲೋ-ಸ್ಯಾಕ್ಸನ್ ವಸಾಹತು ಎಂದು ಸ್ಥಾಪಿಸಲಾಯಿತು, ಇದನ್ನು 10 ನೇ ಶತಮಾನದಲ್ಲಿ ಇಂಗ್ಲೆಂಡ್ ಸ್ವಾಧೀನಪಡಿಸಿಕೊಂಡಿತು. ಈ ಪ್ರದೇಶವು 400 ವರ್ಷಗಳಿಗಿಂತಲೂ ಹೆಚ್ಚು ಕಾಲ ಇಂಗ್ಲೆಂಡ್ ಮತ್ತು ಸ್ಕಾಟ್ಲೆಂಡ್ ಸಾಮ್ರಾಜ್ಯಗಳ ನಡುವಿನ ಐತಿಹಾಸಿಕ ಗಡಿ ಯುದ್ಧಗಳಿಗೆ ಕೇಂದ್ರವಾಗಿತ್ತು ಮತ್ತು ಹಲವಾರು ಬಾರಿ ಬರ್ವಿಕ್‌ನ ಸ್ವಾಧೀನವು ಎರಡು ರಾಜ್ಯಗಳ ನಡುವೆ ಕೈ ಬದಲಾಯಿತು. 1482 ರಲ್ಲಿ ಗ್ಲೌಸೆಸ್ಟರ್‌ನ ರಿಚರ್ಡ್ ಇದನ್ನು ಇಂಗ್ಲೆಂಡ್‌ಗೆ ಮರಳಿ ಪಡೆದಾಗ ಕೊನೆಯ ಬಾರಿಗೆ ಅದು ಕೈ ಬದಲಾಯಿತು. ಇಂದಿಗೂ ಅನೇಕ ಬರ್ವಿಕರ್‌ಗಳು ಸ್ಕಾಟ್‌ಲ್ಯಾಂಡ್‌ಗೆ ನಿಕಟ ಸಂಬಂಧವನ್ನು ಹೊಂದಿದ್ದಾರೆ.
ಇತ್ತೀಚಿನ ದಿನಗಳಲ್ಲಿ ಬರ್ವಿಕ್-ಆನ್-ಟ್ವೀಡ್ ಅದರ ಹೆಚ್ಚು ಗೋಚರಿಸುವ ಇತಿಹಾಸಕ್ಕಾಗಿ ಹೆಚ್ಚು-ಸಂದರ್ಶಿತವಾಗಿದೆ: ಮಧ್ಯಕಾಲೀನ ಪಟ್ಟಣದ ಗೋಡೆಗಳು, ಎಲಿಜಬೆತ್ ರಾಂಪಾರ್ಟ್‌ಗಳು, 13 ನೇ ಶತಮಾನದ ಕೋಟೆಯ ಅವಶೇಷಗಳು, ಅದರ 17 ನೇ ಶತಮಾನದ 'ಓಲ್ಡ್ ಬ್ರಿಡ್ಜ್', ಟೌನ್ ಹಾಲ್, ಬ್ರಿಟನ್‌ನ ಆರಂಭಿಕ ಸೇನಾ ಬ್ಯಾರಕ್‌ಗಳು, ಇಂಗ್ಲೆಂಡ್‌ನ ಉತ್ತರದ ಹೋಟೆಲ್, ಇತರವುಗಳಲ್ಲಿ .
2.ರೈ
ಪುರಾತನ ರೈ ಎಂಬುದು ಎಲ್ಲಾ ಕಲ್ಲುಮಣ್ಣುಗಳಿಂದ ಕೂಡಿದ ಬೀದಿಗಳು ಮತ್ತು ಸಮುದ್ರದ ಪಕ್ಕದಲ್ಲಿರುವ ಮನೆಗಳ ಸಾಲುಗಳು. ಮೂಲತಃ ಸಿಂಕ್ ಪೋರ್ಟ್ಸ್ ಕಾನ್ಫೆಡರೇಶನ್‌ನ ಭಾಗವಾಗಿದೆ, ಮಧ್ಯಕಾಲೀನ ಕಾಲದಲ್ಲಿ ವ್ಯಾಪಾರ ಮತ್ತು ಮಿಲಿಟರಿ ಉದ್ದೇಶಗಳಿಗಾಗಿ ಪ್ರಮುಖ ಐದು ಕಾರ್ಯತಂತ್ರದ ಪಟ್ಟಣಗಳು, ಇಂದು ರೈ ಪ್ರಾಯೋಗಿಕವಾಗಿ ಜೀವಂತ ವಸ್ತುಸಂಗ್ರಹಾಲಯವಾಗಿದೆ. ರೈ ಕ್ಯಾಸಲ್ ಅನ್ನು ಜನಪ್ರಿಯವಾಗಿ Ypres ಟವರ್ ಎಂದು ಕರೆಯಲಾಗುತ್ತದೆ, ಇದನ್ನು 1249 ರಲ್ಲಿ ಹೆನ್ರಿ III ಅವರು ಫ್ರೆಂಚ್‌ನಿಂದ ಆಗಾಗ್ಗೆ ದಾಳಿಯಿಂದ ರಕ್ಷಿಸಲು ನಿರ್ಮಿಸಿದರು; ಇನ್ನೂ ಹಳೆಯದು, ನಾರ್ಮನ್-ಯುಗದ ಸೇಂಟ್. ಮೇರಿ ಚರ್ಚ್ ಪಟ್ಟಣದ ಮೇಲೆ ಕಾಣುತ್ತದೆ. ರೈಯು ಇಂಗ್ಲೆಂಡ್‌ನ ಅತ್ಯಂತ ಪ್ರಸಿದ್ಧ ಕಡಲತೀರಗಳಲ್ಲಿ ಒಂದಾದ ಕ್ಯಾಂಬರ್ ಸ್ಯಾಂಡ್ಸ್‌ನಿಂದ ಕೆಲವೇ ನಿಮಿಷಗಳ ದೂರದಲ್ಲಿದೆ, ಇದು ಕೈಟ್‌ಸರ್ಫರ್‌ಗಳು ಮತ್ತು ಬೀಚ್‌ಲೋವರ್‌ಗಳಿಗಾಗಿ ಎರಡು ಮೈಲಿ ಉದ್ದದ ಆಟದ ಮೈದಾನವಾಗಿದೆ.
ಚಿತ್ರ 1. ಬಹು-ಕಾಲಮ್ ವಿನ್ಯಾಸದ ಉದಾಹರಣೆ
1. ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಅಗಲ
ಬಹು-ಕಾಲಮ್ ವಿನ್ಯಾಸವನ್ನು ನಿರ್ಮಿಸುವಾಗ ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಅಗಲವನ್ನು ನಿರ್ಧರಿಸುವುದು ಮೂಲಭೂತವಾಗಿದೆ. ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಅಗಲವನ್ನು ಹೊಂದಿಸಲು ಕಾಲಮ್-ಎಣಿಕೆ ಮತ್ತು ಕಾಲಮ್-ಅಗಲ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಬಳಸಲಾಗುತ್ತದೆ.
ಮೂರನೆಯ ಆಸ್ತಿ, ಕಾಲಮ್ಗಳು, ಒಂದು ಶಾರ್ಟ್‌ಹ್ಯಾಂಡ್ ಆಸ್ತಿಯಾಗಿದ್ದು ಅದು ಕಾಲಮ್ಗಳ ಅಗಲ ಮತ್ತು ಸಂಖ್ಯೆಯನ್ನು ಏಕಕಾಲದಲ್ಲಿ ಹೊಂದಿಸುತ್ತದೆ.
ಸ್ಪಷ್ಟ ಕಾಲಮ್ ಬ್ರೇಕ್ಗಳು, ವಿಷಯ ಮತ್ತು ಎತ್ತರದ ನಿರ್ಬಂಧಗಳಂತಹ ಇತರ ಅಂಶಗಳು ಕಾಲಮ್ಗಳ ನಿಜವಾದ ಸಂಖ್ಯೆ ಮತ್ತು ಅಗಲದ ಮೇಲೆ ಪರಿಣಾಮ ಬೀರಬಹುದು.
1.1. ಕಾಲಮ್ ಅಗಲ: ಕಾಲಮ್ ಅಗಲ ಆಸ್ತಿ
ಕಾಲಮ್-ಅಗಲ ಆಸ್ತಿಯು ಪ್ರತಿ ಕಾಲಮ್ ಆಕ್ರಮಿಸಬೇಕಾದ ಕನಿಷ್ಠ ಅಗಲವನ್ನು ಸೂಚಿಸುತ್ತದೆ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಕಾಲಮ್-ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಅಗಲ: 100px; ಕಾಲಮ್ ಅಗಲ: 10ಎಮ್; ಕಾಲಮ್-ಅಗಲ: 3.3vw; ಅಂಕಣ-ಅಗಲ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ಅಗಲ: ಆರಂಭಿಕ;
1.2. ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ: ಕಾಲಮ್-ಎಣಿಕೆ ಆಸ್ತಿ
ಕಾಲಮ್-ಎಣಿಕೆ ಆಸ್ತಿಯು ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆಯನ್ನು ವಿವರಿಸುತ್ತದೆ ಮತ್ತು ಲಭ್ಯವಿರುವ ಜಾಗದ ಅಗಲವನ್ನು ಆಧರಿಸಿ ಅವುಗಳ ಅಗಲವನ್ನು ಲೆಕ್ಕಹಾಕಲಾಗುತ್ತದೆ. ಕಾಲಮ್-ಎಣಿಕೆಯಂತೆಯೇ ಅದೇ ಸಮಯದಲ್ಲಿ ಕಾಲಮ್-ಅಗಲವನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಿದರೆ, ನಂತರ ಕಾಲಮ್-ಎಣಿಕೆಯನ್ನು ಗರಿಷ್ಠ ಸಂಖ್ಯೆಯ ಕಾಲಮ್‌ಗಳಾಗಿ ಪರಿಗಣಿಸಲಾಗುತ್ತದೆ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2; ಅಂಕಣ-ಎಣಿಕೆ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ಎಣಿಕೆ: ಆರಂಭಿಕ;
1.3 ಏಕ ಕಾಲಮ್ಗಳ ಆಸ್ತಿಯನ್ನು ಬಳಸಿಕೊಂಡು ಕಾಲಮ್ಗಳನ್ನು ಹೊಂದಿಸಲಾಗುತ್ತಿದೆ
ಕಾಲಮ್ಗಳ ಆಸ್ತಿಯು ಕಾಲಮ್-ಅಗಲ ಮತ್ತು ಕಾಲಮ್-ಎಣಿಕೆಯನ್ನು ಹೊಂದಿಸಲು ಸಂಕ್ಷಿಪ್ತ ಆಸ್ತಿಯಾಗಿದೆ. ಬಿಟ್ಟುಬಿಡಲಾದ ಮೌಲ್ಯಗಳನ್ನು ಅವುಗಳ ಆರಂಭಿಕ ಮೌಲ್ಯಗಳಿಗೆ ಹೊಂದಿಸಲಾಗಿದೆ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಕಾಲಮ್ಗಳು: 12ಎಮ್; /* ಕಾಲಮ್-ಅಗಲ: 12ಎಮ್; ಕಾಲಮ್-ಎಣಿಕೆ: ಸ್ವಯಂ */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ 12ಎಮ್; /* ಕಾಲಮ್-ಅಗಲ: 12ಎಮ್; ಕಾಲಮ್-ಎಣಿಕೆ: ಸ್ವಯಂ */ ಕಾಲಮ್ಗಳು: 2; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2 */ ಕಾಲಮ್ಗಳು: 2 ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2 */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: ಸ್ವಯಂ */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: ಸ್ವಯಂ */ ಕಾಲಮ್ಗಳು: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್ಗಳು: ಆರಂಭಿಕ;
2. ಕಾಲಮ್ಗಳು ಮತ್ತು ವಿಭಜಿಸುವ ರೇಖೆಗಳ ನಡುವಿನ ಅಂತರಗಳು
ಒಂದು ಬಹು-ಕಾಲಮ್ ಕಂಟೇನರ್‌ನಲ್ಲಿ ಕಾಲಮ್ಗಳ ನಡುವೆ ಕಾಲಮ್ ಸ್ಪೇಸ್‌ಗಳು ಮತ್ತು ವಿಭಜಿಸುವ ರೇಖೆಗಳನ್ನು ಇರಿಸಲಾಗುತ್ತದೆ. ಸ್ಥಳಗಳು ಮತ್ತು ವಿಭಜಕಗಳ ಉದ್ದವು ಕಾಲಮ್ನ ಎತ್ತರಕ್ಕೆ ಸಮಾನವಾಗಿರುತ್ತದೆ. ಕಾಲಮ್‌ಗಳಲ್ಲಿನ ಅಂತರವು ಜಾಗವನ್ನು ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ, ಅಂದರೆ, ಅವು ಪಕ್ಕದ ಕಾಲಮ್ಗಳಲ್ಲಿ ವಿಷಯವನ್ನು ತಳ್ಳುತ್ತವೆ.
ಕಾಲಮ್ಗಳ ನಡುವಿನ ಅಂತರದ ಮಧ್ಯದಲ್ಲಿ ವಿಭಜಿಸುವ ರೇಖೆಯನ್ನು ಎಳೆಯಲಾಗುತ್ತದೆ, ಯಾವುದೇ ಜಾಗವನ್ನು ತೆಗೆದುಕೊಳ್ಳುವುದಿಲ್ಲ. ಅಂದರೆ, ವಿಭಜಿಸುವ ರೇಖೆಯ ಉಪಸ್ಥಿತಿ ಅಥವಾ ದಪ್ಪವು ಬೇರೆ ಯಾವುದರ ನಿಯೋಜನೆಯನ್ನು ಬದಲಾಯಿಸುವುದಿಲ್ಲ.
ಬಹು-ಕಾಲಮ್ ಅಂಶದ ಗಡಿಯ ಮೇಲೆ ಸಾಲುಗಳನ್ನು ಚಿತ್ರಿಸಲಾಗಿದೆ. ಅಂಶವು ಸ್ಕ್ರೋಲ್ ಮಾಡಬಹುದಾದ ಪ್ರದೇಶವನ್ನು ಹೊಂದಿದ್ದರೆ, ವಿಭಜಿಸುವ ರೇಖೆಗಳು ಕಾಲಮ್ಗಳ ಜೊತೆಗೆ ಸ್ಕ್ರಾಲ್ ಆಗುತ್ತವೆ. ವಿಭಾಜಕ ಸಾಲುಗಳು ವಿಷಯವನ್ನು ಹೊಂದಿರುವ ಎರಡು ಕಾಲಮ್ಗಳ ನಡುವೆ ಮಾತ್ರ ಗೋಚರಿಸುತ್ತವೆ.
2.1. ಕಾಲಮ್ಗಳ ನಡುವಿನ ಅಂತರಗಳು: ಕಾಲಮ್-ಗ್ಯಾಪ್ ಪ್ರಾಪರ್ಟಿ
ಕಾಲಮ್-ಗ್ಯಾಪ್ ಆಸ್ತಿಯು ಕಾಲಮ್ಗಳ ನಡುವಿನ ಅಂತರವನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತದೆ. ಕಾಲಮ್-ರೂಲ್ ಆಸ್ತಿಯನ್ನು ಬಳಸಿಕೊಂಡು ನೀವು ಕಾಲಮ್‌ಗಳಿಗೆ ವಿಭಜಿಸುವ ರೇಖೆಯನ್ನು ಹೊಂದಿಸಿದರೆ, ಈ ರೇಖೆಯು ಅಂತರದ ಮಧ್ಯದಲ್ಲಿ ಇರುತ್ತದೆ ಮತ್ತು ಅದರ ಅಗಲವು ಒಟ್ಟಾರೆ ಅಗಲವನ್ನು ಬದಲಾಯಿಸುವುದಿಲ್ಲ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಕಾಲಮ್-ಅಂತರ: ಸಾಮಾನ್ಯ; ಕಾಲಮ್-ಅಂತರ: 3px; ಕಾಲಮ್-ಅಂತರ: 2.5em; ಕಾಲಮ್-ಅಂತರ: 3%; ಅಂಕಣ-ಅಂತರ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ಅಂತರ: ಆರಂಭಿಕ;
2.2 ಡಿವೈಡರ್ ಲೈನ್ ಬಣ್ಣ: ಕಾಲಮ್-ರೂಲ್-ಬಣ್ಣದ ಆಸ್ತಿ
ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣದ ಗುಣಲಕ್ಷಣವು ವಿಭಜಿಸುವ ರೇಖೆಯ ಬಣ್ಣವನ್ನು ಸೂಚಿಸುತ್ತದೆ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣ: ಗುಲಾಬಿ; ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣ: #D71C3B; ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣ: rgb(192, 56, 78); ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣ: ಪಾರದರ್ಶಕ; ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣ: hsla(0, 100%, 50%, 0.6); ಅಂಕಣ-ನಿಯಮ-ಬಣ್ಣ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣ: ಆರಂಭಿಕ;
2.3 ವಿಭಾಜಕ ಸಾಲಿನ ಶೈಲಿ: ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿಯ ಆಸ್ತಿ
ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿಯ ಆಸ್ತಿಯು ವಿಭಜಿಸುವ ರೇಖೆಯ ಶೈಲಿಯನ್ನು ಹೊಂದಿಸುತ್ತದೆ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
| ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿ | |
|---|---|
| ಮೌಲ್ಯಗಳನ್ನು: | |
| ಯಾವುದೂ | ಮೌಲ್ಯವು 0 ಗೆ ಮೌಲ್ಯಮಾಪನಗೊಳ್ಳುತ್ತದೆ. ಡೀಫಾಲ್ಟ್ ಮೌಲ್ಯ. |
| ಮರೆಮಾಡಲಾಗಿದೆ | ಯಾವುದೂ ಇಲ್ಲ ಎಂಬ ಮೌಲ್ಯದಂತೆಯೇ, ರೇಖೆಯನ್ನು ಮರೆಮಾಡಲಾಗಿದೆ. |
| ಚುಕ್ಕೆಗಳಿಂದ ಕೂಡಿದೆ | ರೇಖೆಯನ್ನು ಚದರ ಚುಕ್ಕೆಗಳ ಗುಂಪಿನಂತೆ ಪ್ರದರ್ಶಿಸುತ್ತದೆ. |
| ಡ್ಯಾಶ್ ಮಾಡಿದ | ಡ್ಯಾಶ್‌ಗಳ ಅನುಕ್ರಮವಾಗಿ ರೇಖೆಯನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ. |
| ಘನ | ನಿಯಮಿತ ಸಾಲು. |
| ದುಪ್ಪಟ್ಟು | ಪರಸ್ಪರ ಸ್ವಲ್ಪ ದೂರದಲ್ಲಿರುವ ಎರಡು ಸಮಾನಾಂತರ ತೆಳುವಾದ ರೇಖೆಗಳ ರೂಪದಲ್ಲಿ ವಿಭಜಿಸುವ ರೇಖೆಯನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ. ವಿಭಜಿಸುವ ರೇಖೆಯ ಅಗಲವನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲಾಗಿಲ್ಲ, ಆದರೆ ರೇಖೆಗಳ ಮೊತ್ತ ಮತ್ತು ಅವುಗಳ ನಡುವಿನ ಅಂತರವು ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ ಮೌಲ್ಯಕ್ಕೆ ಸಮಾನವಾಗಿರುತ್ತದೆ. |
| ತೋಡು | ಕ್ಯಾನ್ವಾಸ್‌ಗೆ ಒತ್ತುವ ವಾಲ್ಯೂಮೆಟ್ರಿಕ್ ಲೈನ್ ಅನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ. ಎರಡು ಬಣ್ಣಗಳ ನೆರಳು ರಚಿಸುವ ಮೂಲಕ ಇದನ್ನು ಸಾಧಿಸಲಾಗುತ್ತದೆ, ಒಂದು ಗಾಢವಾದ ಮತ್ತು ಹಗುರವಾದ. |
| ಪರ್ವತಶ್ರೇಣಿ | ಪರಿಮಾಣದ ವಿಭಜಿಸುವ ರೇಖೆಯನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ, ಅಂದರೆ. ತೋಡು ವಿರುದ್ಧ ಪರಿಣಾಮ. |
| ಒಳಹೊಕ್ಕು | ನಿರ್ದಿಷ್ಟ ರೇಖೆಯ ಬಣ್ಣಕ್ಕಿಂತ ಗಾಢವಾದ ಬಣ್ಣದಲ್ಲಿ ಘನ ರೇಖೆಯನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ. |
| ಪ್ರಾರಂಭ | ಕಾಲಮ್-ರೂಲ್-ಬಣ್ಣದ ಆಸ್ತಿಯಿಂದ ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ಬಣ್ಣದೊಂದಿಗೆ ಘನ ರೇಖೆಯನ್ನು ಪ್ರದರ್ಶಿಸುತ್ತದೆ. |
| ಆರಂಭಿಕ | ಆಸ್ತಿ ಮೌಲ್ಯವನ್ನು ಡೀಫಾಲ್ಟ್ ಮೌಲ್ಯಕ್ಕೆ ಹೊಂದಿಸುತ್ತದೆ. |
| ಆನುವಂಶಿಕವಾಗಿ | ಮೂಲ ಅಂಶದಿಂದ ಆಸ್ತಿ ಮೌಲ್ಯವನ್ನು ಆನುವಂಶಿಕವಾಗಿ ಪಡೆಯುತ್ತದೆ. |
ಸಿಂಟ್ಯಾಕ್ಸ್
ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಯಾವುದೂ ಇಲ್ಲ; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಮರೆಮಾಡಲಾಗಿದೆ; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಚುಕ್ಕೆ; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಡ್ಯಾಶ್ ಮಾಡಿದ; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಘನ; ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿ: ಡಬಲ್; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ತೋಡು; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ರಿಡ್ಜ್; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಒಳಸೇರಿಸುವಿಕೆ; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ:ಆರಂಭ; ಅಂಕಣ-ನಿಯಮ-ಶೈಲಿ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿ: ಆರಂಭಿಕ;
2.4 ಡಿವೈಡರ್ ಲೈನ್ ಅಗಲ: ಕಾಲಮ್-ರೂಲ್-ಅಗಲ ಆಸ್ತಿ
ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ ಆಸ್ತಿಯು ವಿಭಜಿಸುವ ರೇಖೆಯ ಅಗಲವನ್ನು ಹೊಂದಿಸುತ್ತದೆ. ನಕಾರಾತ್ಮಕ ಮೌಲ್ಯಗಳನ್ನು ಅನುಮತಿಸಲಾಗುವುದಿಲ್ಲ. ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿಯ ಪ್ರಾಪರ್ಟಿ ಇಲ್ಲದೆ ಕೆಲಸ ಮಾಡುವುದಿಲ್ಲ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಅಂಕಣ-ನಿಯಮ-ಅಗಲ: ತೆಳುವಾದ; ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ: ಮಧ್ಯಮ; ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ: ದಪ್ಪ; ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ: 1px; ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ: 2.5em; ಅಂಕಣ-ನಿಯಮ-ಅಗಲ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ: ಆರಂಭಿಕ;
2.5 ವಿಭಜಿಸುವ ರೇಖೆಯ ಗುಣಲಕ್ಷಣಗಳ ತ್ವರಿತ ಸಾರಾಂಶ: ಕಾಲಮ್-ನಿಯಮ ಆಸ್ತಿ
ಕಾಲಮ್-ನಿಯಮ-ಅಗಲ ಕಾಲಮ್-ನಿಯಮ-ಶೈಲಿಯ ಕಾಲಮ್-ನಿಯಮ-ಬಣ್ಣದ ಆಸ್ತಿಗೆ ಕಾಲಮ್-ರೂಲ್ ಪ್ರಾಪರ್ಟಿ ಸಂಕ್ಷಿಪ್ತ ರೂಪವಾಗಿದೆ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಅಂಕಣ-ನಿಯಮ: ಚುಕ್ಕೆ; ಕಾಲಮ್-ನಿಯಮ: ಘನ 8px; ಕಾಲಮ್-ನಿಯಮ: ಘನ ನೀಲಿ; ಕಾಲಮ್-ನಿಯಮ: ದಪ್ಪ ಒಳಸೇರಿದ ನೀಲಿ; ಅಂಕಣ-ನಿಯಮ: ಉತ್ತರಾಧಿಕಾರ; ಅಂಕಣ-ನಿಯಮ: ಆರಂಭಿಕ;
3. ಕಾಲಮ್ ಬ್ರೇಕ್ಗಳು
ವಿಷಯವನ್ನು ಬಹು ಕಾಲಮ್ಗಳಲ್ಲಿ ಇರಿಸಿದಾಗ, ಕಾಲಮ್ ಬ್ರೇಕ್‌ಗಳನ್ನು ಎಲ್ಲಿ ಇರಿಸಲಾಗಿದೆ ಎಂಬುದನ್ನು ಬ್ರೌಸರ್ ನಿರ್ಧರಿಸಬೇಕು. ವಿಷಯವನ್ನು ಕಾಲಮ್‌ಗಳಾಗಿ ವಿಭಜಿಸುವ ಸಮಸ್ಯೆಯು ವಿಷಯವನ್ನು ಪುಟಗಳಾಗಿ ವಿಭಜಿಸುವಂತೆಯೇ ಇರುತ್ತದೆ. ಈ ಸಮಸ್ಯೆಯನ್ನು ಪರಿಹರಿಸಲು, ಪುಟ ವಿರಾಮಗಳಂತೆಯೇ ಅದೇ ಗುಣಲಕ್ಷಣಗಳಲ್ಲಿ ಕಾಲಮ್ ವಿರಾಮಗಳನ್ನು ವಿವರಿಸಲು ಮೂರು ಹೊಸ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಪರಿಚಯಿಸಲಾಗಿದೆ: ಬ್ರೇಕ್-ಮೊದಲು , ಬ್ರೇಕ್-ಆಫ್ಟರ್ , ಮತ್ತು ಬ್ರೇಕ್-ಇನ್ಸೈಡ್ .
4. ಕಾಲಮ್ ವ್ಯಾಪಿಸುವಿಕೆ: ಕಾಲಮ್-ಸ್ಪ್ಯಾನ್ ಆಸ್ತಿ
ಕಾಲಮ್-ಸ್ಪ್ಯಾನ್ ಆಸ್ತಿಯು ಒಂದು ಅಂಶವನ್ನು ಬಹು ಕಾಲಮ್ಗಳನ್ನು ವ್ಯಾಪಿಸಲು ಅನುಮತಿಸುತ್ತದೆ. ಇದು ಕಂಟೇನರ್ ಬ್ಲಾಕ್ಗಾಗಿ ಅಲ್ಲ, ಆದರೆ ಒಳಗೆ ನಿರ್ದಿಷ್ಟ ಅಂಶಕ್ಕಾಗಿ ಸೂಚಿಸಲಾಗುತ್ತದೆ, ಉದಾಹರಣೆಗೆ, ಹೆಡರ್ಗಾಗಿ.
ಭವಿಷ್ಯದಲ್ಲಿ ಟೇಬಲ್ ಸೆಲ್‌ಗೆ ಅನ್ವಯಿಸಬಹುದಾದ ಕೋಲ್‌ಸ್ಪಾನ್ ಗುಣಲಕ್ಷಣದಂತೆಯೇ, ಸ್ಪ್ಯಾನ್ ಮಾಡಲು ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆಯನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ಸಾಧ್ಯವಾಗುತ್ತದೆ, ಆದರೆ CSS3 ವಿವರಣೆಯು ಕೇವಲ ಎರಡು ಸಂಭವನೀಯ ಮೌಲ್ಯಗಳನ್ನು ಹೊಂದಿದೆ: ಯಾವುದೂ ಇಲ್ಲ ಮತ್ತು ಎಲ್ಲವೂ .
ಫೈರ್‌ಫಾಕ್ಸ್‌ನಲ್ಲಿ ಆಸ್ತಿಯು ಪೂರ್ವನಿಯೋಜಿತವಾಗಿ ಕಾರ್ಯನಿರ್ವಹಿಸುವುದಿಲ್ಲ. ಬಳಕೆದಾರರು ವೈಶಿಷ್ಟ್ಯವನ್ನು ಸ್ಪಷ್ಟವಾಗಿ ಸಕ್ರಿಯಗೊಳಿಸಬೇಕು, layout.css.column-span.enabled ಅನ್ನು ಸರಿ ಎಂದು ಹೊಂದಿಸಬೇಕು. ಫೈರ್‌ಫಾಕ್ಸ್‌ನಲ್ಲಿ ಸೆಟ್ಟಿಂಗ್‌ಗಳನ್ನು ಬದಲಾಯಿಸಲು, about:config ಗೆ ಹೋಗಿ.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಕಾಲಮ್-ಸ್ಪ್ಯಾನ್: ಯಾವುದೂ ಇಲ್ಲ; ಕಾಲಮ್-ಸ್ಪ್ಯಾನ್: ಎಲ್ಲಾ; ಕಾಲಮ್-ಸ್ಪ್ಯಾನ್: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ಸ್ಪ್ಯಾನ್: ಆರಂಭಿಕ;
5. ವಿಷಯದೊಂದಿಗೆ ಕಾಲಮ್ಗಳನ್ನು ಭರ್ತಿ ಮಾಡುವುದು: ಕಾಲಮ್-ಫಿಲ್ ಪ್ರಾಪರ್ಟಿ
ಕಾಲಮ್-ಫಿಲ್ ಪ್ರಾಪರ್ಟಿಯು ಕಾಲಮ್ಗಳು ಹೇಗೆ ವಿಷಯದಿಂದ ತುಂಬಿವೆ ಎಂಬುದನ್ನು ನಿಯಂತ್ರಿಸುತ್ತದೆ. ಕಾಲಮ್ಗಳನ್ನು ಭರ್ತಿ ಮಾಡಲು ಎರಡು ತಂತ್ರಗಳಿವೆ: ಕಾಲಮ್ಗಳನ್ನು ಎತ್ತರಕ್ಕೆ ಜೋಡಿಸಬಹುದು ಅಥವಾ ಇಲ್ಲದಿರಬಹುದು. ಕಾಲಮ್ಗಳನ್ನು ಜೋಡಿಸಿದರೆ, ಕಾಲಮ್ ಎತ್ತರದಲ್ಲಿ ಬದಲಾವಣೆಗಳನ್ನು ಕಡಿಮೆ ಮಾಡಲು ಬ್ರೌಸರ್‌ಗಳು ಪ್ರಯತ್ನಿಸಬೇಕು, ಬಲವಂತದ ವಿರಾಮಗಳು, ವಿಧವೆಯರು, ಅನಾಥರು ಮತ್ತು ಕಾಲಮ್ ಎತ್ತರದ ಮೇಲೆ ಪರಿಣಾಮ ಬೀರುವ ಇತರ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳಬೇಕು. ಕಾಲಮ್ಗಳನ್ನು ಜೋಡಿಸದಿದ್ದರೆ, ಅವುಗಳನ್ನು ಅನುಕ್ರಮವಾಗಿ ಭರ್ತಿ ಮಾಡಲಾಗುತ್ತದೆ, ಅವುಗಳಲ್ಲಿ ಕೆಲವು ಭಾಗಶಃ ತುಂಬಿರಬಹುದು ಅಥವಾ ತುಂಬದೇ ಇರಬಹುದು.
ಆಸ್ತಿ ಪಿತ್ರಾರ್ಜಿತವಾಗಿಲ್ಲ.
ಸಿಂಟ್ಯಾಕ್ಸ್
ಕಾಲಮ್-ಫಿಲ್: ಸ್ವಯಂ; ಅಂಕಣ-ತುಂಬಿ: ಸಮತೋಲನ; ಅಂಕಣ-ತುಂಬಿ: ಸಮತೋಲನ-ಎಲ್ಲ; ಅಂಕಣ-ಭರ್ತಿ: ಉತ್ತರಾಧಿಕಾರ; ಕಾಲಮ್-ಫಿಲ್: ಆರಂಭಿಕ;
6. ಓವರ್ಫ್ಲೋ
6.1. ಬಹು-ಕಾಲಮ್ ಕಂಟೈನರ್‌ಗಳ ಒಳಗೆ ಉಕ್ಕಿ ಹರಿಯುತ್ತದೆ
ಕಾಲಮ್ ಮುರಿಯಲು ಕಾರಣವಾಗುವುದನ್ನು ಹೊರತುಪಡಿಸಿ, ಕಾಲಮ್ನ ಮಿತಿಗಳನ್ನು ಮೀರಿದ ವಿಷಯವು ಅದರ ಗಡಿಗಳನ್ನು ಮೀರಿ ವಿಸ್ತರಿಸುತ್ತದೆ ಮತ್ತು ಅದನ್ನು ಕತ್ತರಿಸಲಾಗುವುದಿಲ್ಲ. ಇದು ಪ್ರಾಥಮಿಕವಾಗಿ ಚಿತ್ರಗಳಿಗೆ ಅನ್ವಯಿಸುತ್ತದೆ. ಈ ಸಮಸ್ಯೆಯನ್ನು ಪರಿಹರಿಸಲು, ನೀವು ಚಿತ್ರಗಳಿಗಾಗಿ ಈ ಕೆಳಗಿನ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಹೊಂದಿಸಬೇಕಾಗಿದೆ:
Img (ಪ್ರದರ್ಶನ: ಬ್ಲಾಕ್; /* ಚಿತ್ರದ ಅಡಿಯಲ್ಲಿ ಕೆಳಗಿನ ಪ್ಯಾಡಿಂಗ್ ಅನ್ನು ತೆಗೆದುಹಾಕಿ*/ ಅಗಲ: 100%; /* ಕಂಟೇನರ್ ಬ್ಲಾಕ್‌ನ ಸಂಪೂರ್ಣ ಅಗಲಕ್ಕೆ ಚಿತ್ರವನ್ನು ವಿಸ್ತರಿಸಿ*/ )
6.2 ಬಹು-ಕಾಲಮ್ ಕಂಟೈನರ್‌ಗಳ ಹೊರಗೆ ವಿನ್ಯಾಸ ಮತ್ತು ಓವರ್ಫ್ಲೋ
ಬಹು-ಕಾಲಮ್ ಕಂಟೇನರ್‌ನ ಅಂಚುಗಳಲ್ಲಿ ಕಾಲಮ್ಗಳನ್ನು ಮೀರಿ ವಿಸ್ತರಿಸುವ ವಿಷಯ ಮತ್ತು ವಿಭಜಿಸುವ ರೇಖೆಗಳನ್ನು ಓವರ್ಫ್ಲೋ ಆಸ್ತಿಯ ಪ್ರಕಾರ ಕ್ಲಿಪ್ ಮಾಡಲಾಗುತ್ತದೆ.
ಕಾಲಮ್-ಎತ್ತರದ ನಿರ್ಬಂಧಗಳು (ಉದಾಹರಣೆಗೆ ಎತ್ತರ ಅಥವಾ ಗರಿಷ್ಠ-ಎತ್ತರ) ಮತ್ತು ಸ್ಪಷ್ಟ ಕಾಲಮ್ ಬ್ರೇಕ್‌ಗಳಿಂದಾಗಿ ಬಹು-ಕಾಲಮ್ ಕಂಟೇನರ್ ಹೆಚ್ಚು ಕಾಲಮ್ಗಳನ್ನು ಹೊಂದಿರಬಹುದು. ಈ ಸಂದರ್ಭದಲ್ಲಿ, ಹೆಚ್ಚುವರಿ ಕಾಲಮ್ಗಳನ್ನು ಸಾಲಿನ ದಿಕ್ಕಿನಲ್ಲಿ ರಚಿಸಲಾಗುತ್ತದೆ, ನಂತರದ ಪುಟಗಳಿಗೆ ಚಲಿಸುತ್ತದೆ.
ದಿ CSS ಬಹು-ಕಾಲಮ್ ಲೇಔಟ್ ಮಾಡ್ಯೂಲ್ವಿಸ್ತರಿಸುತ್ತದೆ ಬ್ಲಾಕ್ ಲೇಔಟ್ ಮೋಡ್ಪಠ್ಯದ ಬಹು ಕಾಲಮ್ಗಳ ಸುಲಭ ವ್ಯಾಖ್ಯಾನವನ್ನು ಅನುಮತಿಸಲು.ಸಾಲುಗಳು ತುಂಬಾ ಉದ್ದವಾಗಿದ್ದರೆ ಜನರು ಪಠ್ಯವನ್ನು ಓದುವಲ್ಲಿ ತೊಂದರೆ ಹೊಂದಿರುತ್ತಾರೆ; ಕಣ್ಣುಗಳು ಒಂದು ಸಾಲಿನ ಅಂತ್ಯದಿಂದ ಮುಂದಿನ ಆರಂಭಕ್ಕೆ ಚಲಿಸಲು ತುಂಬಾ ಸಮಯ ತೆಗೆದುಕೊಂಡರೆ, ಅವರು ಯಾವ ಸಾಲಿನಲ್ಲಿದ್ದರು ಎಂಬುದರ ಟ್ರ್ಯಾಕ್ ಅನ್ನು ಕಳೆದುಕೊಳ್ಳುತ್ತವೆ. ಆದ್ದರಿಂದ, ದೊಡ್ಡ ಪರದೆಯ ಗರಿಷ್ಠ ಬಳಕೆಯನ್ನು ಮಾಡಲು, ಲೇಖಕರು ಪತ್ರಿಕೆಗಳಂತೆಯೇ ಅಕ್ಕಪಕ್ಕದಲ್ಲಿ ಪಠ್ಯದ ಸೀಮಿತ-ಅಗಲದ ಕಾಲಮ್ಗಳನ್ನು ಹೊಂದಿರಬೇಕು.
ದುರದೃಷ್ಟವಶಾತ್, ಸ್ಥಿರ ಸ್ಥಾನಗಳಲ್ಲಿ ಕಾಲಮ್ ಬ್ರೇಕ್‌ಗಳನ್ನು ಒತ್ತಾಯಿಸದೆ ಅಥವಾ ಪಠ್ಯದಲ್ಲಿ ಅನುಮತಿಸಲಾದ ಮಾರ್ಕ್ಅಪ್ ಅನ್ನು ತೀವ್ರವಾಗಿ ನಿರ್ಬಂಧಿಸದೆ ಅಥವಾ ವೀರೋಚಿತ ಸ್ಕ್ರಿಪ್ಟಿಂಗ್ ಅನ್ನು ಬಳಸದೆ CSS ಮತ್ತು HTML ನೊಂದಿಗೆ ಮಾಡಲು ಅಸಾಧ್ಯವಾಗಿದೆ. ಸಾಂಪ್ರದಾಯಿಕ ಬ್ಲಾಕ್ ಲೇಔಟ್ ಮೋಡ್ ಅನ್ನು ವಿಸ್ತರಿಸಲು ಹೊಸ CSS ಗುಣಲಕ್ಷಣಗಳನ್ನು ಸೇರಿಸುವ ಮೂಲಕ ಈ ಮಿತಿಯನ್ನು ಪರಿಹರಿಸಲಾಗುತ್ತದೆ.
ಕಾಲಮ್ಗಳನ್ನು ಬಳಸುವುದು
ಕಾಲಮ್ ಎಣಿಕೆ ಮತ್ತು ಅಗಲ
ಎರಡು CSS ಗುಣಲಕ್ಷಣಗಳು ಎಷ್ಟು ಕಾಲಮ್ಗಳು ಗೋಚರಿಸುತ್ತವೆ ಎಂಬುದನ್ನು ನಿಯಂತ್ರಿಸುತ್ತವೆ: ಕಾಲಮ್-ಎಣಿಕೆ ಮತ್ತು ಕಾಲಮ್-ಅಗಲ .
ಕಾಲಮ್-ಎಣಿಕೆ ಆಸ್ತಿಯು ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆಯನ್ನು ನಿರ್ದಿಷ್ಟ ಸಂಖ್ಯೆಗೆ ಹೊಂದಿಸುತ್ತದೆ. ಉದಾ.,
ಉದಾಹರಣೆ 1
HTML
ಲೊರೆಮ್ ಇಪ್ಸಮ್ ಡೋಲರ್ ಸಿಟ್ ಅಮೆಟ್, ಕಾನ್ಸೆಕ್ಟೆಟರ್ ಅಡಿಪಿಸಿಸಿಂಗ್ ಎಲಿಟ್, ಸೆಡ್ ಡು ಐಯುಸ್ಮೋಡ್ ಟೆಂಪರ್ ಇನ್ಸಿಡಿಡಂಟ್ ಯುಟ್ ಲೇಬರ್ ಮತ್ತು ಡೋಲೋರ್ ಮ್ಯಾಗ್ನಾ ಅಲಿಕ್ವಾ.
ಉತ್ ಎನಿಮ್ ಅಡ್ ಮಿನಿಮ್ ವೆನಿಯಮ್, ಕ್ವಿಸ್ ನಾಸ್ಟ್ರುಡ್ ಎಕ್ಸರ್ಸಿಟೇಶನ್ ಉಲ್ಲಮ್ಕೊ ಲೇಬರಿಸ್ ನಿಸಿ ಯುಟ್ ಅಲಿಕ್ವಿಪ್ ಎಕ್ಸ್ ಇಎ ಕಮೊಡೊ ಕಾನ್ಸೆಕ್ವಾಟ್.
ಡುಯಿಸ್ ಆಟ್ ಇರುರೆ ಡೋಲೋರ್ ಇನ್ ರಿಪ್ರೆಹೆಂಡರಿಟ್ ಇನ್ ವಾಲ್ಯೂಪ್ಟೇಟ್ ವೆಲಿಟ್ ಎಸ್ಸೆ ಸಿಲಮ್ ಡೋಲೋರ್ ಇಯು ಫ್ಯೂಗಿಯಾಟ್ ನುಲ್ಲಾ ಪರಿಯಾತುರ್.
ಎಕ್ಸೆಪ್ಟಿಯರ್ ಸಿಂಟ್ ಓಕೆಕಾಟ್ ಕ್ಯುಪಿಡಾಟಟ್ ನಾನ್ ಪ್ರೊಡೆಡೆಂಟ್, ಕಲ್ಪಾ ಕ್ವಿ ಅಫಿಷಿಯಾ ಡೆಸೆರಂಟ್ ಮೊಲಿಟ್ ಅನಿಮ್ ಐಡಿ ಎಸ್ಟ್ ಲೇಬರ್.
CSS
#col (ಕಾಲಮ್-ಎಣಿಕೆ: 2;)ಫಲಿತಾಂಶ
ವಿಷಯವನ್ನು ಎರಡು ಕಾಲಮ್ಗಳಲ್ಲಿ ಪ್ರದರ್ಶಿಸುತ್ತದೆ (ನೀವು ಬಹು-ಕಾಲಮ್ ಕಂಪ್ಲೈಂಟ್ ಬ್ರೌಸರ್ ಅನ್ನು ಬಳಸುತ್ತಿದ್ದರೆ):
ಕಾಲಮ್-ಅಗಲ ಆಸ್ತಿಯು ಕನಿಷ್ಟ ಬಯಸಿದ ಕಾಲಮ್ ಅಗಲವನ್ನು ಹೊಂದಿಸುತ್ತದೆ. ಕಾಲಮ್-ಎಣಿಕೆಯನ್ನು ಸಹ ಹೊಂದಿಸದಿದ್ದರೆ, ಲಭ್ಯವಿರುವ ಅಗಲಕ್ಕೆ ಸರಿಹೊಂದುವಷ್ಟು ಕಾಲಮ್ಗಳನ್ನು ಬ್ರೌಸರ್ ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಮಾಡುತ್ತದೆ.
ಉದಾಹರಣೆ 2
HTML
CSS
#ವಿಡ್ (ಕಾಲಮ್-ಅಗಲ: 100px;)ಫಲಿತಾಂಶ
ಬಹು-ಕಾಲಮ್ ಬ್ಲಾಕ್‌ನಲ್ಲಿ, ಅಗತ್ಯವಿರುವಂತೆ ವಿಷಯವನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಒಂದು ಕಾಲಮ್‌ನಿಂದ ಮುಂದಿನದಕ್ಕೆ ಹರಿಯಲಾಗುತ್ತದೆ. ಎಲ್ಲಾ HTML, CSS ಮತ್ತು DOM ಕಾರ್ಯಚಟುವಟಿಕೆಗಳನ್ನು ಕಾಲಮ್ಗಳಲ್ಲಿ ಬೆಂಬಲಿಸಲಾಗುತ್ತದೆ, ಹಾಗೆಯೇ ಸಂಪಾದನೆ ಮತ್ತು ಮುದ್ರಣ.
ಅಂಕಣಗಳ ಸಂಕ್ಷಿಪ್ತ ರೂಪ
ಹೆಚ್ಚಿನ ಸಮಯ, ವೆಬ್ ಡಿಸೈನರ್ ಎರಡು CSS ಗುಣಲಕ್ಷಣಗಳಲ್ಲಿ ಒಂದನ್ನು ಬಳಸುತ್ತಾರೆ: ಕಾಲಮ್-ಎಣಿಕೆ ಅಥವಾ ಕಾಲಮ್-ಅಗಲ . ಈ ಗುಣಲಕ್ಷಣಗಳ ಮೌಲ್ಯಗಳು ಅತಿಕ್ರಮಿಸುವುದಿಲ್ಲವಾದ್ದರಿಂದ, ಸಂಕ್ಷಿಪ್ತ ಕಾಲಮ್ಗಳನ್ನು ಬಳಸಲು ಇದು ಅನುಕೂಲಕರವಾಗಿರುತ್ತದೆ. ಉದಾ.
CSS ಘೋಷಣೆಯ ಕಾಲಮ್ ಅಗಲ: 12em ಅನ್ನು ಕಾಲಮ್‌ಗಳಿಂದ ಬದಲಾಯಿಸಬಹುದು: 12em .
ಉದಾಹರಣೆ 3
HTML
CSS
#ಕೊಲ್_ಶಾರ್ಟ್ (ಕಾಲಮ್ಗಳು: 12ಎಮ್; )CSS ಘೋಷಣೆಯ ಕಾಲಮ್-ಎಣಿಕೆ: 4 ಅನ್ನು ಕಾಲಮ್‌ಗಳಿಂದ ಬದಲಾಯಿಸಬಹುದು: 4 .
ಉದಾಹರಣೆ 4
HTML
CSS
#ಕಾಲಮ್ಗಳು_4 (ಕಾಲಮ್ಗಳು: 4;)ಫಲಿತಾಂಶ
ಎರಡು CSS ಘೋಷಣೆಗಳು ಕಾಲಮ್-ಅಗಲ: 8em ಮತ್ತು ಕಾಲಮ್-ಎಣಿಕೆ: 12 ಅನ್ನು ಕಾಲಮ್‌ಗಳಿಂದ ಬದಲಾಯಿಸಬಹುದು: 12 8em .
ಉದಾಹರಣೆ 5
HTML
CSS
#ಕಾಲಮ್ಗಳು_12 (ಕಾಲಮ್ಗಳು: 12 8ಎಮ್; )ಫಲಿತಾಂಶ
ಎತ್ತರ ಸಮತೋಲನ
CSS3 ಕಾಲಮ್ ವಿವರಣೆಯು ಕಾಲಮ್ ಎತ್ತರಗಳನ್ನು ಸಮತೋಲನಗೊಳಿಸಬೇಕು: ಅಂದರೆ, ಬ್ರೌಸರ್ ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಗರಿಷ್ಠ ಕಾಲಮ್ ಎತ್ತರವನ್ನು ಹೊಂದಿಸುತ್ತದೆ ಆದ್ದರಿಂದ ಪ್ರತಿ ಕಾಲಮ್‌ನಲ್ಲಿರುವ ವಿಷಯದ ಎತ್ತರಗಳು ಸರಿಸುಮಾರು ಸಮಾನವಾಗಿರುತ್ತದೆ. Firefox ಇದನ್ನು ಮಾಡುತ್ತದೆ.
ಆದಾಗ್ಯೂ, ಕೆಲವು ಸಂದರ್ಭಗಳಲ್ಲಿ ಕಾಲಮ್ಗಳ ಗರಿಷ್ಠ ಎತ್ತರವನ್ನು ಸ್ಪಷ್ಟವಾಗಿ ಹೊಂದಿಸಲು ಸಹ ಉಪಯುಕ್ತವಾಗಿದೆ, ಮತ್ತು ನಂತರ ಮೊದಲ ಕಾಲಮ್‌ನಿಂದ ಪ್ರಾರಂಭಿಸಿ ಮತ್ತು ಅಗತ್ಯವಿರುವಷ್ಟು ಕಾಲಮ್ಗಳನ್ನು ರಚಿಸುವ ವಿಷಯವನ್ನು ಲೇಔಟ್ ಮಾಡಿ, ಪ್ರಾಯಶಃ ಬಲಕ್ಕೆ ಉಕ್ಕಿ ಹರಿಯಬಹುದು. ಆದ್ದರಿಂದ, ಎತ್ತರವನ್ನು ನಿರ್ಬಂಧಿಸಿದರೆ, ಬಹು-ಕಾಲಮ್ ಬ್ಲಾಕ್‌ನಲ್ಲಿ CSS ಎತ್ತರ ಅಥವಾ ಗರಿಷ್ಠ-ಎತ್ತರದ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಹೊಂದಿಸುವ ಮೂಲಕ, ಪ್ರತಿ ಕಾಲಮ್ ಅನ್ನು ಆ ಎತ್ತರಕ್ಕೆ ಬೆಳೆಯಲು ಅನುಮತಿಸಲಾಗುತ್ತದೆ ಮತ್ತು ಹೊಸ ಕಾಲಮ್ ಅನ್ನು ಸೇರಿಸುವ ಮೊದಲು. ಲೇಔಟ್‌ಗೆ ಈ ಮೋಡ್ ಹೆಚ್ಚು ಪರಿಣಾಮಕಾರಿಯಾಗಿದೆ.
ಕಾಲಮ್ ಅಂತರಗಳು
ಅಂಕಣಗಳ ನಡುವೆ ಅಂತರವಿದೆ. ಶಿಫಾರಸು ಮಾಡಲಾದ ಡೀಫಾಲ್ಟ್ 1em ಆಗಿದೆ. ಬಹು-ಕಾಲಮ್ ಬ್ಲಾಕ್‌ಗೆ ಕಾಲಮ್-ಗ್ಯಾಪ್ ಆಸ್ತಿಯನ್ನು ಅನ್ವಯಿಸುವ ಮೂಲಕ ಈ ಗಾತ್ರವನ್ನು ಬದಲಾಯಿಸಬಹುದು:
ಉದಾಹರಣೆ 6
HTML
CSS
#ಕಾಲಮ್_ಅಂತರ (ಕಾಲಮ್-ಎಣಿಕೆ: 5; ಕಾಲಮ್-ಅಂತರ: 2ಎಮ್; )ಫಲಿತಾಂಶ
ಆಕರ್ಷಕವಾದ ಅವನತಿ
ಕಾಲಮ್-ಸಪೋರ್ಟಿಂಗ್ ಬ್ರೌಸರ್‌ಗಳಿಂದ ಕಾಲಮ್ ಗುಣಲಕ್ಷಣಗಳನ್ನು ನಿರ್ಲಕ್ಷಿಸಲಾಗುತ್ತದೆ. ಆದ್ದರಿಂದ ಆ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಒಂದೇ ಕಾಲಮ್‌ನಲ್ಲಿ ಪ್ರದರ್ಶಿಸುವ ಮತ್ತು ಬೆಂಬಲಿಸುವ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಬಹು ಕಾಲಮ್ಗಳನ್ನು ಬಳಸುವ ವಿನ್ಯಾಸವನ್ನು ರಚಿಸುವುದು ತುಲನಾತ್ಮಕವಾಗಿ ಸುಲಭವಾಗಿದೆ.
ತೀರ್ಮಾನ
CSS3 ಕಾಲಮ್ಗಳು ವೆಬ್ ಡೆವಲಪರ್‌ಗಳಿಗೆ ಪರದೆಯ ರಿಯಲ್ ಎಸ್ಟೇಟ್ ಅನ್ನು ಉತ್ತಮವಾಗಿ ಬಳಸಿಕೊಳ್ಳಲು ಸಹಾಯ ಮಾಡುವ ಲೇಔಟ್ ಪ್ರಾಚೀನವಾಗಿದೆ. ಕಾಲ್ಪನಿಕ ಡೆವಲಪರ್‌ಗಳು ಅವರಿಗೆ ಅನೇಕ ಉಪಯೋಗಗಳನ್ನು ಕಂಡುಕೊಳ್ಳಬಹುದು, ವಿಶೇಷವಾಗಿ ಸ್ವಯಂಚಾಲಿತ ಎತ್ತರ ಸಮತೋಲನ ವೈಶಿಷ್ಟ್ಯದೊಂದಿಗೆ.
ಹಲವಾರು ಕಾಲಮ್ಗಳಲ್ಲಿ ಪುಟದಲ್ಲಿ ಪಠ್ಯವನ್ನು ಹೇಗೆ ಜೋಡಿಸುವುದು? ಮತ್ತು ಇದನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಮಾಡಬಹುದೇ? ಖಂಡಿತವಾಗಿ, ವೆಬ್ ಅಭಿವೃದ್ಧಿಯಲ್ಲಿ ತೊಡಗಿರುವ ನಿಮ್ಮಲ್ಲಿ ಹಲವರು ಈ ಸಮಸ್ಯೆಯನ್ನು ಎದುರಿಸಿದ್ದಾರೆ - ಮತ್ತು ಟ್ರಿಕಿ ಶೈಲಿಗಳು ಅಥವಾ ಹೆಚ್ಚುವರಿ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಲೈಬ್ರರಿಗಳ ಬಳಕೆಯ ಅಗತ್ಯವಿರುವ ಸಂಕೀರ್ಣ ಪರಿಹಾರಗಳಿಗೆ (ಉದಾಹರಣೆಗೆ, jQuery ಗಾಗಿ ಅಂಕಣಕಾರ ಪ್ಲಗಿನ್ ಅನ್ನು ನೋಡಿ).
ಬಹು-ಕಾಲಮ್ ಕಂಟೆಂಟ್ ಲೇಔಟ್ (ಸಾಮಾನ್ಯ ಬಹು-ಕಾಲಮ್ ಪುಟ ವಿನ್ಯಾಸದ ಕಾರ್ಯದೊಂದಿಗೆ ಗೊಂದಲಕ್ಕೀಡಾಗಬಾರದು, ಇದು ಗ್ರಿಡ್‌ನಲ್ಲಿ ಬ್ಲಾಕ್‌ಗಳನ್ನು ಜೋಡಿಸುವ ಸಮಸ್ಯೆಗೆ ಹತ್ತಿರದಲ್ಲಿದೆ) ದೀರ್ಘಕಾಲದವರೆಗೆ ವೆಬ್ ಮಾನದಂಡಗಳ ಜಗತ್ತಿನಲ್ಲಿ ತನ್ನ ದಾರಿಯನ್ನು ಮಾಡುತ್ತಿದೆ. ಮತ್ತು, ಅಂತಿಮವಾಗಿ, ಅನುಗುಣವಾದ CSS3 ಮಲ್ಟಿ ಮಾಡ್ಯೂಲ್-ಕಾಲಮ್ ಲೇಔಟ್ ರೂಪದಲ್ಲಿ ಅಭ್ಯರ್ಥಿಯ ಶಿಫಾರಸು ಸ್ಥಿತಿಯನ್ನು ತಲುಪಿಲ್ಲ, ಆದರೆ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಸಾಕಷ್ಟು ವ್ಯಾಪಕ ಬೆಂಬಲವನ್ನು ಸಹ ಪಡೆದುಕೊಂಡಿದೆ: ಎಲ್ಲೋ ಪೂರ್ವಪ್ರತ್ಯಯಗಳೊಂದಿಗೆ (-moz- ಅಥವಾ -webkit-) ಮತ್ತು ಎಲ್ಲೋ ಪ್ರಸ್ತುತ (ಒಪೇರಾ 11.1+) ಮತ್ತು ಯೋಜಿತ ಆವೃತ್ತಿಗಳು (IE10+), ಮತ್ತು ತಕ್ಷಣವೇ ಪೂರ್ವಪ್ರತ್ಯಯಗಳಿಲ್ಲದೆ.
ಕಾಮೆಂಟ್ ಮಾಡಿ
ಇಂಟರ್ನೆಟ್ ಎಕ್ಸ್‌ಪ್ಲೋರರ್ 10 ರ ಸಂದರ್ಭದಲ್ಲಿ, HTML/CSS/JS ಅನ್ನು ಬಳಸಿಕೊಂಡು ವಿಂಡೋಸ್ 8 ಗಾಗಿ ಮೆಟ್ರೋ ಶೈಲಿಯ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸುವಾಗ ನೀವು CSS3 ಬಹು-ಕಾಲಮ್ ಅನ್ನು ಬಳಸಬಹುದು ಎಂದು ಇದು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಅರ್ಥೈಸುತ್ತದೆ.
ಈ ಲೇಖನದ ಉದ್ದೇಶಗಳಿಗಾಗಿ, ಕೋಡ್ ಅನ್ನು ಗೊಂದಲಗೊಳಿಸಲು ನಾನು ಬ್ರೌಸರ್ ಪೂರ್ವಪ್ರತ್ಯಯಗಳನ್ನು ಬಳಸುವುದಿಲ್ಲ, ಆದರೆ ನಿಜ ಜೀವನದ ಬಳಕೆಯಲ್ಲಿ, Firefox, Safari ಮತ್ತು Chrome ಗೆ ಪೂರ್ವಪ್ರತ್ಯಯ ಬೆಂಬಲವನ್ನು ಸೇರಿಸಲು ಮರೆಯಬೇಡಿ.
ಇನ್ನೂ ಎರಡು ಪ್ರಮುಖ ವಿವರಗಳನ್ನು ನಾನು ತಕ್ಷಣ ಗಮನಿಸುತ್ತೇನೆ.
ಮೊದಲನೆಯದಾಗಿ, ಹೆಚ್ಚಿನ ಸಂದರ್ಭಗಳಲ್ಲಿ, ಪಠ್ಯಕ್ಕಾಗಿ ಬಹು-ಕಾಲಮ್ ವಿನ್ಯಾಸದ ಬಳಕೆಯನ್ನು ಪ್ರಗತಿಶೀಲ ವರ್ಧನೆಯ ಹಾದಿಯಲ್ಲಿ ಸೈಟ್ ವಿಷಯದ ಪ್ರದರ್ಶನದ ಅಭಿವೃದ್ಧಿ ಎಂದು ಪರಿಗಣಿಸಬಹುದು, ಅದರೊಳಗೆ ಹೆಚ್ಚು ಆಧುನಿಕ ಸೈಟ್‌ಗಳ ಬಳಕೆದಾರರು ಹೆಚ್ಚಿನ ಗುಡಿಗಳನ್ನು ಸ್ವೀಕರಿಸುತ್ತಾರೆ:
ಎರಡನೆಯದಾಗಿ, ಬಹು-ಕಾಲಮ್ ಪ್ರದರ್ಶನವು ಮಾಧ್ಯಮ ಪ್ರಶ್ನೆಗಳ (ಮತ್ತು ಸ್ಪಂದಿಸುವ ವಿನ್ಯಾಸ ಕಲ್ಪನೆಗಳು) ಸಾಮರ್ಥ್ಯಗಳೊಂದಿಗೆ ಚೆನ್ನಾಗಿ ಹೊಂದಿಕೊಳ್ಳುತ್ತದೆ, ಉದಾಹರಣೆಗೆ, ವಿಭಿನ್ನ ಪರದೆಯ ಗಾತ್ರಗಳಲ್ಲಿ ನೀವು ವಿಭಿನ್ನ ಸಂಖ್ಯೆಯ ಕಾಲಮ್ಗಳಲ್ಲಿ ಪಠ್ಯವನ್ನು ಫಾರ್ಮ್ಯಾಟ್ ಮಾಡಬಹುದು:
ಮತ್ತು ಪರಿಚಯದಲ್ಲಿ ನಾನು ಕೊನೆಯದಾಗಿ ಗಮನಿಸಲು ಬಯಸುತ್ತೇನೆ, ಆದ್ದರಿಂದ ಈ ಬಗ್ಗೆ ಮತ್ತಷ್ಟು ವಾಸಿಸಬಾರದು ಮತ್ತು ತಾಂತ್ರಿಕ ವಿವರಗಳಿಗೆ ಸ್ಪಷ್ಟ ಆತ್ಮಸಾಕ್ಷಿಯೊಂದಿಗೆ ಮುಂದುವರಿಯಿರಿ: ಬಹು-ಕಾಲಮ್ ಪಠ್ಯ ವಿನ್ಯಾಸವನ್ನು ಬಳಸುವಾಗ, ಅಂತಹ ವ್ಯವಸ್ಥೆಯು ಸಹ ಊಹಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ನೆನಪಿನಲ್ಲಿಡಬೇಕು. ಒಂದು ನಿರ್ದಿಷ್ಟ ಓದುವ ಕ್ರಮ (ಯುರೋಪಿಯನ್ ಭಾಷೆಗಳಿಗೆ, ಎಡದಿಂದ ಬಲಕ್ಕೆ). ಆದ್ದರಿಂದ, ನೋಟವನ್ನು ಒಂದು ಕಾಲಮ್‌ನಿಂದ ಇನ್ನೊಂದಕ್ಕೆ ಸರಿಸಲು, ಸಾಧ್ಯವಾದಷ್ಟು ಕಡಿಮೆ ಹೆಚ್ಚುವರಿ ಕ್ರಿಯೆಗಳನ್ನು ನಿರ್ವಹಿಸುವುದು ಅವಶ್ಯಕ, ವಿಶೇಷವಾಗಿ ಲಂಬ ಸುರುಳಿಗಳಿಗೆ ಬಂದಾಗ:
ಈ ಅರ್ಥದಲ್ಲಿ, ಕಾಲಮ್ಗಳ ಸಮತಲ ಸ್ವರೂಪವು ಸಮತಲ ಸ್ಕ್ರೋಲಿಂಗ್‌ನೊಂದಿಗೆ ಉತ್ತಮವಾಗಿ ಸಂಯೋಜಿಸಲ್ಪಟ್ಟಿದೆ (ಹಲವು Win8 ಅಪ್ಲಿಕೇಶನ್‌ಗಳಲ್ಲಿ ಬಳಸಿದಂತೆ - ಉದಾಹರಣೆಗೆ, ಇದು USA Today ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ ಸ್ಪಷ್ಟವಾಗಿ ಗೋಚರಿಸುತ್ತದೆ):
ಸಾಮಾನ್ಯವಾಗಿ, ಸ್ಪೀಕರ್‌ಗಳು ಉತ್ತಮವಾಗಿವೆ, ಆದರೆ ಬಳಕೆದಾರರ ಅನುಭವದ ಬಗ್ಗೆ ಮರೆಯಬೇಡಿ. ಮತ್ತು ಈಗ ಯುದ್ಧದಲ್ಲಿ!
ಕಾಲಮ್ಗಳು
ಆದ್ದರಿಂದ, ನಾವು ಹಲವಾರು ಕಾಲಮ್ಗಳಲ್ಲಿ ಇರಿಸಲು ಬಯಸುವ ಪಠ್ಯವನ್ನು (ವಿಷಯ) ಹೊಂದಿದ್ದೇವೆ. ಎಲ್ಲಿಂದ ಪ್ರಾರಂಭಿಸಬೇಕು?
ಅಂತಹ ಅಂಶವನ್ನು ಬಹು-ಕಾಲಮ್ ಆಗಿ ಪರಿವರ್ತಿಸಲು, ನೀವು CSS ಶೈಲಿಗಳ ಮೂಲಕ ಗುಣಲಕ್ಷಣಗಳಲ್ಲಿ ಒಂದನ್ನು ಹೊಂದಿಸಬೇಕಾಗುತ್ತದೆ: ಕಾಲಮ್-ಅಗಲಅಥವಾ ಕಾಲಮ್ ಎಣಿಕೆಬೇರೆ ಅರ್ಥಕ್ಕೆ ಸ್ವಯಂ. ಉದಾಹರಣೆಗೆ,
ಪಠ್ಯವನ್ನು ಎರಡು ಕಾಲಮ್‌ಗಳಾಗಿ ವಿಭಜಿಸಲು, ಇದನ್ನು ಮಾಡಿ:
ಲೇಖನ (ಕಾಲಮ್-ಎಣಿಕೆ: 2;)
ಬ್ರೌಸರ್ ಉಳಿದದ್ದನ್ನು ಮಾಡುತ್ತದೆ: 
ಪರ್ಯಾಯ ಆಸ್ತಿ - ಕಾಲಮ್-ಅಗಲ- ಸೂಕ್ತವಾದ ಕಾಲಮ್ ಅಗಲವನ್ನು ಹೊಂದಿಸಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ:
ಲೇಖನ (ಕಾಲಮ್ ಅಗಲ: 150px; )
ಈ ಸಂದರ್ಭದಲ್ಲಿ, ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ಕಾಲಮ್ ಅಗಲಕ್ಕೆ ಹೊಂದಿಕೊಳ್ಳುವ, ಹೊರಗಿನ ಧಾರಕವನ್ನು ತುಂಬಲು ಬ್ರೌಸರ್ ಸ್ವತಃ ವಿಷಯವನ್ನು ಅಗತ್ಯವಿರುವ ಸಂಖ್ಯೆಯ ಕಾಲಮ್‌ಗಳಾಗಿ ವಿಭಜಿಸುತ್ತದೆ. ಮುಖ್ಯವಾದ ಅಂಶವೆಂದರೆ ಅದು ನಿಜವಾದ ಅಗಲವು ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ಒಂದಕ್ಕಿಂತ ಭಿನ್ನವಾಗಿರಬಹುದುಮೇಲೆ ಅಥವಾ ಕೆಳಗೆ: ಮೇಲಿನ ಚಿತ್ರದಲ್ಲಿ, ಬೂದು ಪಟ್ಟಿಯು ನಿಖರವಾಗಿ 150px ಅಗಲವಿದೆ - ಮತ್ತು, ನೀವು ನೋಡುವಂತೆ, ಇದು ಕಾಲಮ್ನ ನಿಜವಾದ ಅಗಲಕ್ಕಿಂತ ಚಿಕ್ಕದಾಗಿದೆ.
ಈ ನಡವಳಿಕೆಯನ್ನು ನಿರ್ದಿಷ್ಟತೆಯ ಮೂಲಕ ವ್ಯಾಖ್ಯಾನಿಸಲಾಗಿದೆ ಮತ್ತು ಸ್ಪಂದಿಸುವ ಮಾರ್ಕ್ಅಪ್ ಅನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸುವಾಗ (ಸ್ವಯಂಚಾಲಿತವಾಗಿ) ಹೆಚ್ಚಿನ ನಮ್ಯತೆಯನ್ನು ಅನುಮತಿಸುತ್ತದೆ:
ಉದಾಹರಣೆಗೆ, ನೀವು 100px ಅಗಲವಿರುವ ಕಂಟೇನರ್ ಹೊಂದಿದ್ದರೆ ಮತ್ತು ನೀವು ಕಾಲಮ್ಗಳನ್ನು 45px ಅಗಲಕ್ಕೆ ಹೊಂದಿಸಿದರೆ, ಬ್ರೌಸರ್ ಕೇವಲ ಎರಡು ಕಾಲಮ್ಗಳು ಹೊಂದಿಕೆಯಾಗುತ್ತದೆ ಎಂದು ಪರಿಗಣಿಸುತ್ತದೆ ಮತ್ತು ಸಂಪೂರ್ಣ ಜಾಗವನ್ನು ತುಂಬಲು, ಅದು ಪ್ರತಿಯೊಂದರ ಗಾತ್ರವನ್ನು ಹೆಚ್ಚಿಸುತ್ತದೆ 50px. (ಇದು ಕಾಲಮ್ಗಳ ನಡುವಿನ ಜಾಗವನ್ನು ಸಹ ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ, ಅದನ್ನು ಮುಂದಿನ ವಿಭಾಗದಲ್ಲಿ ಚರ್ಚಿಸಲಾಗುವುದು.)
ಒಂದು ಅರ್ಥದಲ್ಲಿ, ವಿಂಡೋ ಗಾತ್ರವನ್ನು ಅವಲಂಬಿಸಿ ವಿಭಿನ್ನ ಸಂಖ್ಯೆಯ ಕಾಲಮ್ಗಳನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ಮತ್ತು ಕಾಲಮ್ ಅಗಲಗಳನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಲೆಕ್ಕಾಚಾರ ಮಾಡಲು ಮಾಧ್ಯಮ ಪ್ರಶ್ನೆಗಳನ್ನು ಬಳಸುವುದಕ್ಕೆ ಪರ್ಯಾಯವಾಗಿ ಇದನ್ನು ಕಾಣಬಹುದು:
@ಮಾಧ್ಯಮ (ನಿಮಿಷ-ಅಗಲ:400px) (ಲೇಖನ (ಕಾಲಮ್-ಎಣಿಕೆ: 2; ) ) @media (ಕನಿಷ್ಠ-ಅಗಲ:600px) (ಲೇಖನ (ಕಾಲಮ್-ಎಣಿಕೆ: 3; ) ) ...
ನಾನು ಪರ್ಯಾಯದ ಬಗ್ಗೆ ಮಾತನಾಡುತ್ತಿರುವುದು ಇದು ಎರಡನೇ ಬಾರಿಗೆ - ಮತ್ತು ಏಕೆ ಎಂಬುದು ಇಲ್ಲಿದೆ.
ಎಣಿಕೆ vs. ಅಗಲ
ಮೇಲಿನ ವಿವರಣೆಯಿಂದ ಈಗಾಗಲೇ ಸ್ಪಷ್ಟವಾಗಿರಬೇಕು, ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಅಗಲವನ್ನು ಹೊಂದಿಸಲು ವಿವರಣೆಯು ಎರಡು ಮಾರ್ಗಗಳನ್ನು ಒದಗಿಸುತ್ತದೆ (ಮೂಲಕ, ಇದು ಎಲ್ಲಾ ಕಾಲಮ್‌ಗಳಿಗೆ ಒಂದೇ ಆಗಿರುತ್ತದೆ!):- ಕಾಲಮ್ ಎಣಿಕೆನೀವು ವಿಷಯವನ್ನು ವಿಭಜಿಸಲು ಬಯಸುವ ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆಯನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ, ಆದರೆ ಕಾಲಮ್ಗಳ ಅಗಲವನ್ನು ಬ್ರೌಸರ್‌ನಿಂದ ನಿರ್ಧರಿಸಲಾಗುತ್ತದೆ, ಲಭ್ಯವಿರುವ ಸ್ಥಳವನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ.
- ಕಾಲಮ್-ಅಗಲಇದು ಹಿಮ್ಮುಖ ಭಾಗದಿಂದ ಬರುತ್ತದೆ: ಕಾಲಮ್ಗಳು ಸರಿಸುಮಾರು ಏನಾಗಿರಬೇಕು ಎಂಬುದನ್ನು ಇದು ಸೂಚಿಸುತ್ತದೆ, ಆದಾಗ್ಯೂ, ಇದು ಅವರ ಸಂಖ್ಯೆಯ ಲೆಕ್ಕಾಚಾರವನ್ನು ಬ್ರೌಸರ್‌ನ ವಿವೇಚನೆಗೆ ಬಿಡುತ್ತದೆ.
ಕಾಲಮ್ಗಳು: 12ಎಮ್; /* ಕಾಲಮ್-ಅಗಲ: 12ಎಮ್; ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; */ ಕಾಲಮ್ಗಳು: 2; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2; */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ 12ಎಮ್; /* ಕಾಲಮ್-ಅಗಲ: 12ಎಮ್; ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; */ ಕಾಲಮ್ಗಳು: 2 ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2; */
ನೀವು ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಸೂಕ್ತ ಅಗಲ ಎರಡನ್ನೂ ನಿರ್ದಿಷ್ಟಪಡಿಸಿದರೆ ಏನಾಗುತ್ತದೆ? ನಿರ್ದಿಷ್ಟತೆಯ ಪ್ರಕಾರ, ಈ ಸಂದರ್ಭದಲ್ಲಿ ಕಾಲಮ್ ಎಣಿಕೆಗರಿಷ್ಠ ಸಂಖ್ಯೆಯ ಕಾಲಮ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತದೆ:
ಲೇಖನ (ಕಾಲಮ್ಗಳು: 150px 3; /* ಕಾಲಮ್-ಅಗಲ: 150px; ಕಾಲಮ್-ಎಣಿಕೆ: 3; */ )
ವಾಸ್ತವವಾಗಿ, CSS3 ಕುರಿತು ನನ್ನ ಕೆಲವು ಲೇಖನಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ವೆಬ್ ಮಾನದಂಡಗಳ ಅಭಿವೃದ್ಧಿಯನ್ನು ಅನುಸರಿಸಿ (ಉದಾಹರಣೆಗೆ ನೋಡಿ,), ವೆಬ್ ಡೆವಲಪರ್‌ಗಳಿಗೆ ತೆರೆಯುವ ಅವಕಾಶಗಳಿಂದ ನೀವು ಕಡಿಮೆ ಪ್ರೇರಿತರಾಗಿಲ್ಲ ಎಂದು ನಾನು ಭಾವಿಸುತ್ತೇನೆ. ವಿಷಯ ನಿಯೋಜನೆಯನ್ನು ನಿರ್ವಹಿಸಲು ಹೊಂದಿಕೊಳ್ಳುವ, ಹೊಂದಿಕೊಳ್ಳುವ ಮತ್ತು ಶಕ್ತಿಯುತ ಸಾಧನಗಳು ಹತ್ತಿರವಾಗುತ್ತಿವೆ ಮತ್ತು ಹೆಚ್ಚು ಪ್ರವೇಶಿಸಬಹುದಾಗಿದೆ. ಮತ್ತು ಸಂಕೀರ್ಣ ಸಮಸ್ಯೆಗಳನ್ನು ಪರಿಹರಿಸುವುದು ಸುಲಭವಾಗುತ್ತಿದೆ.
ಸಂವಾದಾತ್ಮಕ
ietestdrive.com ನಲ್ಲಿ CSS3 ಮಲ್ಟಿ-ಕಾಲಮ್ ಹೇಗೆ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಎಂಬುದರ ಕುರಿತು ನೀವು ಆಡಬಹುದು:
ಪ್ರಯತ್ನಿಸಿ, ಪ್ರಯೋಗ. ಬ್ರೌಸರ್ ಡೆವಲಪರ್‌ಗಳಿಗೆ ದೋಷಗಳನ್ನು ವರದಿ ಮಾಡಿ. ಮತ್ತು ಹಳೆಯ (ಮತ್ತು ತೋರಿಕೆಯಲ್ಲಿ ಆಧುನಿಕ, ಆದರೆ ಇನ್ನೂ ಸಂಪೂರ್ಣವಾಗಿ ಪ್ರಮಾಣಿತ-ಕಂಪ್ಲೈಂಟ್ ಅಲ್ಲ) ಬ್ರೌಸರ್‌ಗಳ ಬಳಕೆದಾರರು ಏನನ್ನು ನೋಡುತ್ತಾರೆ ಎಂಬುದರ ಕುರಿತು ಯೋಚಿಸಲು ಮರೆಯಬೇಡಿ-ಉದಾಹರಣೆಗೆ, ನೀವು jQuery ಅಂಕಣಕಾರಕ್ಕಾಗಿ ಪ್ಲಗಿನ್ ಅನ್ನು ಬಳಸಬಹುದು. ಹೊಂದಿಕೊಳ್ಳುವಿಕೆ ಮತ್ತು ಸಣ್ಣ ಮತ್ತು ದೊಡ್ಡ ಪರದೆಯ ವೀಕ್ಷಕರನ್ನು ನೆನಪಿಡಿ.
ಹಲವಾರು ಕಾಲಮ್ಗಳಲ್ಲಿ ಪುಟದಲ್ಲಿ ಪಠ್ಯವನ್ನು ಹೇಗೆ ಜೋಡಿಸುವುದು? ಮತ್ತು ಇದನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಮಾಡಬಹುದೇ? ಖಂಡಿತವಾಗಿ, ವೆಬ್ ಅಭಿವೃದ್ಧಿಯಲ್ಲಿ ತೊಡಗಿರುವ ನಿಮ್ಮಲ್ಲಿ ಹಲವರು ಈ ಸಮಸ್ಯೆಯನ್ನು ಎದುರಿಸಿದ್ದಾರೆ - ಮತ್ತು ಟ್ರಿಕಿ ಶೈಲಿಗಳು ಅಥವಾ ಹೆಚ್ಚುವರಿ ಜಾವಾಸ್ಕ್ರಿಪ್ಟ್ ಲೈಬ್ರರಿಗಳ ಬಳಕೆಯ ಅಗತ್ಯವಿರುವ ಸಂಕೀರ್ಣ ಪರಿಹಾರಗಳಿಗೆ (ಉದಾಹರಣೆಗೆ, jQuery ಗಾಗಿ ಅಂಕಣಕಾರ ಪ್ಲಗಿನ್ ಅನ್ನು ನೋಡಿ).
ಬಹು-ಕಾಲಮ್ ಕಂಟೆಂಟ್ ಲೇಔಟ್ (ಸಾಮಾನ್ಯ ಬಹು-ಕಾಲಮ್ ಪುಟ ವಿನ್ಯಾಸದ ಕಾರ್ಯದೊಂದಿಗೆ ಗೊಂದಲಕ್ಕೀಡಾಗಬಾರದು, ಇದು ಗ್ರಿಡ್‌ನಲ್ಲಿ ಬ್ಲಾಕ್‌ಗಳನ್ನು ಜೋಡಿಸುವ ಸಮಸ್ಯೆಗೆ ಹತ್ತಿರದಲ್ಲಿದೆ) ದೀರ್ಘಕಾಲದವರೆಗೆ ವೆಬ್ ಮಾನದಂಡಗಳ ಜಗತ್ತಿನಲ್ಲಿ ತನ್ನ ದಾರಿಯನ್ನು ಮಾಡುತ್ತಿದೆ. ಮತ್ತು, ಅಂತಿಮವಾಗಿ, ಅನುಗುಣವಾದ CSS3 ಮಲ್ಟಿ ಮಾಡ್ಯೂಲ್-ಕಾಲಮ್ ಲೇಔಟ್ ರೂಪದಲ್ಲಿ ಅಭ್ಯರ್ಥಿಯ ಶಿಫಾರಸು ಸ್ಥಿತಿಯನ್ನು ತಲುಪಿಲ್ಲ, ಆದರೆ ಬ್ರೌಸರ್‌ಗಳಲ್ಲಿ ಸಾಕಷ್ಟು ವ್ಯಾಪಕ ಬೆಂಬಲವನ್ನು ಸಹ ಪಡೆದುಕೊಂಡಿದೆ: ಎಲ್ಲೋ ಪೂರ್ವಪ್ರತ್ಯಯಗಳೊಂದಿಗೆ (-moz- ಅಥವಾ -webkit-) ಮತ್ತು ಎಲ್ಲೋ ಪ್ರಸ್ತುತ (ಒಪೇರಾ 11.1+) ಮತ್ತು ಯೋಜಿತ ಆವೃತ್ತಿಗಳು (IE10+), ಮತ್ತು ತಕ್ಷಣವೇ ಪೂರ್ವಪ್ರತ್ಯಯಗಳಿಲ್ಲದೆ.
ಕಾಮೆಂಟ್ ಮಾಡಿ
ಇಂಟರ್ನೆಟ್ ಎಕ್ಸ್‌ಪ್ಲೋರರ್ 10 ರ ಸಂದರ್ಭದಲ್ಲಿ, HTML/CSS/JS ಅನ್ನು ಬಳಸಿಕೊಂಡು ವಿಂಡೋಸ್ 8 ಗಾಗಿ ಮೆಟ್ರೋ ಶೈಲಿಯ ಅಪ್ಲಿಕೇಶನ್‌ಗಳನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸುವಾಗ ನೀವು CSS3 ಬಹು-ಕಾಲಮ್ ಅನ್ನು ಬಳಸಬಹುದು ಎಂದು ಇದು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಅರ್ಥೈಸುತ್ತದೆ.
ಈ ಲೇಖನದ ಉದ್ದೇಶಗಳಿಗಾಗಿ, ಕೋಡ್ ಅನ್ನು ಗೊಂದಲಗೊಳಿಸಲು ನಾನು ಬ್ರೌಸರ್ ಪೂರ್ವಪ್ರತ್ಯಯಗಳನ್ನು ಬಳಸುವುದಿಲ್ಲ, ಆದರೆ ನಿಜ ಜೀವನದ ಬಳಕೆಯಲ್ಲಿ, Firefox, Safari ಮತ್ತು Chrome ಗೆ ಪೂರ್ವಪ್ರತ್ಯಯ ಬೆಂಬಲವನ್ನು ಸೇರಿಸಲು ಮರೆಯಬೇಡಿ.
ಇನ್ನೂ ಎರಡು ಪ್ರಮುಖ ವಿವರಗಳನ್ನು ನಾನು ತಕ್ಷಣ ಗಮನಿಸುತ್ತೇನೆ.
ಮೊದಲನೆಯದಾಗಿ, ಹೆಚ್ಚಿನ ಸಂದರ್ಭಗಳಲ್ಲಿ, ಪಠ್ಯಕ್ಕಾಗಿ ಬಹು-ಕಾಲಮ್ ವಿನ್ಯಾಸದ ಬಳಕೆಯನ್ನು ಪ್ರಗತಿಶೀಲ ವರ್ಧನೆಯ ಹಾದಿಯಲ್ಲಿ ಸೈಟ್ ವಿಷಯದ ಪ್ರದರ್ಶನದ ಅಭಿವೃದ್ಧಿ ಎಂದು ಪರಿಗಣಿಸಬಹುದು, ಅದರೊಳಗೆ ಹೆಚ್ಚು ಆಧುನಿಕ ಸೈಟ್‌ಗಳ ಬಳಕೆದಾರರು ಹೆಚ್ಚಿನ ಗುಡಿಗಳನ್ನು ಸ್ವೀಕರಿಸುತ್ತಾರೆ:
ಎರಡನೆಯದಾಗಿ, ಬಹು-ಕಾಲಮ್ ಪ್ರದರ್ಶನವು ಮಾಧ್ಯಮ ಪ್ರಶ್ನೆಗಳ (ಮತ್ತು ಸ್ಪಂದಿಸುವ ವಿನ್ಯಾಸ ಕಲ್ಪನೆಗಳು) ಸಾಮರ್ಥ್ಯಗಳೊಂದಿಗೆ ಚೆನ್ನಾಗಿ ಹೊಂದಿಕೊಳ್ಳುತ್ತದೆ, ಉದಾಹರಣೆಗೆ, ವಿಭಿನ್ನ ಪರದೆಯ ಗಾತ್ರಗಳಲ್ಲಿ ನೀವು ವಿಭಿನ್ನ ಸಂಖ್ಯೆಯ ಕಾಲಮ್ಗಳಲ್ಲಿ ಪಠ್ಯವನ್ನು ಫಾರ್ಮ್ಯಾಟ್ ಮಾಡಬಹುದು:
ಮತ್ತು ಪರಿಚಯದಲ್ಲಿ ನಾನು ಕೊನೆಯದಾಗಿ ಗಮನಿಸಲು ಬಯಸುತ್ತೇನೆ, ಆದ್ದರಿಂದ ಈ ಬಗ್ಗೆ ಮತ್ತಷ್ಟು ವಾಸಿಸಬಾರದು ಮತ್ತು ತಾಂತ್ರಿಕ ವಿವರಗಳಿಗೆ ಸ್ಪಷ್ಟ ಆತ್ಮಸಾಕ್ಷಿಯೊಂದಿಗೆ ಮುಂದುವರಿಯಿರಿ: ಬಹು-ಕಾಲಮ್ ಪಠ್ಯ ವಿನ್ಯಾಸವನ್ನು ಬಳಸುವಾಗ, ಅಂತಹ ವ್ಯವಸ್ಥೆಯು ಸಹ ಊಹಿಸುತ್ತದೆ ಎಂಬುದನ್ನು ನೆನಪಿನಲ್ಲಿಡಬೇಕು. ಒಂದು ನಿರ್ದಿಷ್ಟ ಓದುವ ಕ್ರಮ (ಯುರೋಪಿಯನ್ ಭಾಷೆಗಳಿಗೆ, ಎಡದಿಂದ ಬಲಕ್ಕೆ). ಆದ್ದರಿಂದ, ನೋಟವನ್ನು ಒಂದು ಕಾಲಮ್‌ನಿಂದ ಇನ್ನೊಂದಕ್ಕೆ ಸರಿಸಲು, ಸಾಧ್ಯವಾದಷ್ಟು ಕಡಿಮೆ ಹೆಚ್ಚುವರಿ ಕ್ರಿಯೆಗಳನ್ನು ನಿರ್ವಹಿಸುವುದು ಅವಶ್ಯಕ, ವಿಶೇಷವಾಗಿ ಲಂಬ ಸುರುಳಿಗಳಿಗೆ ಬಂದಾಗ:
ಈ ಅರ್ಥದಲ್ಲಿ, ಕಾಲಮ್ಗಳ ಸಮತಲ ಸ್ವರೂಪವು ಸಮತಲ ಸ್ಕ್ರೋಲಿಂಗ್‌ನೊಂದಿಗೆ ಉತ್ತಮವಾಗಿ ಸಂಯೋಜಿಸಲ್ಪಟ್ಟಿದೆ (ಹಲವು Win8 ಅಪ್ಲಿಕೇಶನ್‌ಗಳಲ್ಲಿ ಬಳಸಿದಂತೆ - ಉದಾಹರಣೆಗೆ, ಇದು USA Today ಅಪ್ಲಿಕೇಶನ್‌ನಲ್ಲಿ ಸ್ಪಷ್ಟವಾಗಿ ಗೋಚರಿಸುತ್ತದೆ):
ಸಾಮಾನ್ಯವಾಗಿ, ಸ್ಪೀಕರ್‌ಗಳು ಉತ್ತಮವಾಗಿವೆ, ಆದರೆ ಬಳಕೆದಾರರ ಅನುಭವದ ಬಗ್ಗೆ ಮರೆಯಬೇಡಿ. ಮತ್ತು ಈಗ ಯುದ್ಧದಲ್ಲಿ!
ಕಾಲಮ್ಗಳು
ಆದ್ದರಿಂದ, ನಾವು ಹಲವಾರು ಕಾಲಮ್ಗಳಲ್ಲಿ ಇರಿಸಲು ಬಯಸುವ ಪಠ್ಯವನ್ನು (ವಿಷಯ) ಹೊಂದಿದ್ದೇವೆ. ಎಲ್ಲಿಂದ ಪ್ರಾರಂಭಿಸಬೇಕು?
ಅಂತಹ ಅಂಶವನ್ನು ಬಹು-ಕಾಲಮ್ ಆಗಿ ಪರಿವರ್ತಿಸಲು, ನೀವು CSS ಶೈಲಿಗಳ ಮೂಲಕ ಗುಣಲಕ್ಷಣಗಳಲ್ಲಿ ಒಂದನ್ನು ಹೊಂದಿಸಬೇಕಾಗುತ್ತದೆ: ಕಾಲಮ್-ಅಗಲಅಥವಾ ಕಾಲಮ್ ಎಣಿಕೆಬೇರೆ ಅರ್ಥಕ್ಕೆ ಸ್ವಯಂ. ಉದಾಹರಣೆಗೆ,
ಪಠ್ಯವನ್ನು ಎರಡು ಕಾಲಮ್‌ಗಳಾಗಿ ವಿಭಜಿಸಲು, ಇದನ್ನು ಮಾಡಿ:
ಲೇಖನ (ಕಾಲಮ್-ಎಣಿಕೆ: 2;)
ಬ್ರೌಸರ್ ಉಳಿದದ್ದನ್ನು ಮಾಡುತ್ತದೆ:
ಪರ್ಯಾಯ ಆಸ್ತಿ - ಕಾಲಮ್-ಅಗಲ- ಸೂಕ್ತವಾದ ಕಾಲಮ್ ಅಗಲವನ್ನು ಹೊಂದಿಸಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ:
ಲೇಖನ (ಕಾಲಮ್ ಅಗಲ: 150px; )
ಈ ಸಂದರ್ಭದಲ್ಲಿ, ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ಕಾಲಮ್ ಅಗಲಕ್ಕೆ ಹೊಂದಿಕೊಳ್ಳುವ, ಹೊರಗಿನ ಧಾರಕವನ್ನು ತುಂಬಲು ಬ್ರೌಸರ್ ಸ್ವತಃ ವಿಷಯವನ್ನು ಅಗತ್ಯವಿರುವ ಸಂಖ್ಯೆಯ ಕಾಲಮ್‌ಗಳಾಗಿ ವಿಭಜಿಸುತ್ತದೆ. ಮುಖ್ಯವಾದ ಅಂಶವೆಂದರೆ ಅದು ನಿಜವಾದ ಅಗಲವು ನಿರ್ದಿಷ್ಟಪಡಿಸಿದ ಒಂದಕ್ಕಿಂತ ಭಿನ್ನವಾಗಿರಬಹುದುಮೇಲೆ ಅಥವಾ ಕೆಳಗೆ: ಮೇಲಿನ ಚಿತ್ರದಲ್ಲಿ, ಬೂದು ಪಟ್ಟಿಯು ನಿಖರವಾಗಿ 150px ಅಗಲವಿದೆ - ಮತ್ತು, ನೀವು ನೋಡುವಂತೆ, ಇದು ಕಾಲಮ್ನ ನಿಜವಾದ ಅಗಲಕ್ಕಿಂತ ಚಿಕ್ಕದಾಗಿದೆ.
ಈ ನಡವಳಿಕೆಯನ್ನು ನಿರ್ದಿಷ್ಟತೆಯ ಮೂಲಕ ವ್ಯಾಖ್ಯಾನಿಸಲಾಗಿದೆ ಮತ್ತು ಸ್ಪಂದಿಸುವ ಮಾರ್ಕ್ಅಪ್ ಅನ್ನು ಅಭಿವೃದ್ಧಿಪಡಿಸುವಾಗ (ಸ್ವಯಂಚಾಲಿತವಾಗಿ) ಹೆಚ್ಚಿನ ನಮ್ಯತೆಯನ್ನು ಅನುಮತಿಸುತ್ತದೆ:
ಉದಾಹರಣೆಗೆ, ನೀವು 100px ಅಗಲವಿರುವ ಕಂಟೇನರ್ ಹೊಂದಿದ್ದರೆ ಮತ್ತು ನೀವು ಕಾಲಮ್ಗಳನ್ನು 45px ಅಗಲಕ್ಕೆ ಹೊಂದಿಸಿದರೆ, ಬ್ರೌಸರ್ ಕೇವಲ ಎರಡು ಕಾಲಮ್ಗಳು ಹೊಂದಿಕೆಯಾಗುತ್ತದೆ ಎಂದು ಪರಿಗಣಿಸುತ್ತದೆ ಮತ್ತು ಸಂಪೂರ್ಣ ಜಾಗವನ್ನು ತುಂಬಲು, ಅದು ಪ್ರತಿಯೊಂದರ ಗಾತ್ರವನ್ನು ಹೆಚ್ಚಿಸುತ್ತದೆ 50px. (ಇದು ಕಾಲಮ್ಗಳ ನಡುವಿನ ಜಾಗವನ್ನು ಸಹ ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ, ಅದನ್ನು ಮುಂದಿನ ವಿಭಾಗದಲ್ಲಿ ಚರ್ಚಿಸಲಾಗುವುದು.)
ಒಂದು ಅರ್ಥದಲ್ಲಿ, ವಿಂಡೋ ಗಾತ್ರವನ್ನು ಅವಲಂಬಿಸಿ ವಿಭಿನ್ನ ಸಂಖ್ಯೆಯ ಕಾಲಮ್ಗಳನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ಮತ್ತು ಕಾಲಮ್ ಅಗಲಗಳನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ಲೆಕ್ಕಾಚಾರ ಮಾಡಲು ಮಾಧ್ಯಮ ಪ್ರಶ್ನೆಗಳನ್ನು ಬಳಸುವುದಕ್ಕೆ ಪರ್ಯಾಯವಾಗಿ ಇದನ್ನು ಕಾಣಬಹುದು:
@ಮಾಧ್ಯಮ (ನಿಮಿಷ-ಅಗಲ:400px) (ಲೇಖನ (ಕಾಲಮ್-ಎಣಿಕೆ: 2; ) ) @media (ಕನಿಷ್ಠ-ಅಗಲ:600px) (ಲೇಖನ (ಕಾಲಮ್-ಎಣಿಕೆ: 3; ) ) ...
ನಾನು ಪರ್ಯಾಯದ ಬಗ್ಗೆ ಮಾತನಾಡುತ್ತಿರುವುದು ಇದು ಎರಡನೇ ಬಾರಿಗೆ - ಮತ್ತು ಏಕೆ ಎಂಬುದು ಇಲ್ಲಿದೆ.
ಎಣಿಕೆ vs. ಅಗಲ
ಮೇಲಿನ ವಿವರಣೆಯಿಂದ ಈಗಾಗಲೇ ಸ್ಪಷ್ಟವಾಗಿರಬೇಕು, ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಅಗಲವನ್ನು ಹೊಂದಿಸಲು ವಿವರಣೆಯು ಎರಡು ಮಾರ್ಗಗಳನ್ನು ಒದಗಿಸುತ್ತದೆ (ಮೂಲಕ, ಇದು ಎಲ್ಲಾ ಕಾಲಮ್‌ಗಳಿಗೆ ಒಂದೇ ಆಗಿರುತ್ತದೆ!):- ಕಾಲಮ್ ಎಣಿಕೆನೀವು ವಿಷಯವನ್ನು ವಿಭಜಿಸಲು ಬಯಸುವ ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆಯನ್ನು ನಿರ್ದಿಷ್ಟಪಡಿಸಲು ನಿಮಗೆ ಅನುಮತಿಸುತ್ತದೆ, ಆದರೆ ಕಾಲಮ್ಗಳ ಅಗಲವನ್ನು ಬ್ರೌಸರ್‌ನಿಂದ ನಿರ್ಧರಿಸಲಾಗುತ್ತದೆ, ಲಭ್ಯವಿರುವ ಸ್ಥಳವನ್ನು ಗಣನೆಗೆ ತೆಗೆದುಕೊಳ್ಳುತ್ತದೆ.
- ಕಾಲಮ್-ಅಗಲಇದು ಹಿಮ್ಮುಖ ಭಾಗದಿಂದ ಬರುತ್ತದೆ: ಕಾಲಮ್ಗಳು ಸರಿಸುಮಾರು ಏನಾಗಿರಬೇಕು ಎಂಬುದನ್ನು ಇದು ಸೂಚಿಸುತ್ತದೆ, ಆದಾಗ್ಯೂ, ಇದು ಅವರ ಸಂಖ್ಯೆಯ ಲೆಕ್ಕಾಚಾರವನ್ನು ಬ್ರೌಸರ್‌ನ ವಿವೇಚನೆಗೆ ಬಿಡುತ್ತದೆ.
ಕಾಲಮ್ಗಳು: 12ಎಮ್; /* ಕಾಲಮ್-ಅಗಲ: 12ಎಮ್; ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; */ ಕಾಲಮ್ಗಳು: 2; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2; */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; */ ಕಾಲಮ್ಗಳು: ಸ್ವಯಂ 12ಎಮ್; /* ಕಾಲಮ್-ಅಗಲ: 12ಎಮ್; ಅಂಕಣ-ಎಣಿಕೆ: ಸ್ವಯಂ; */ ಕಾಲಮ್ಗಳು: 2 ಸ್ವಯಂ; /* ಕಾಲಮ್ ಅಗಲ: ಸ್ವಯಂ; ಕಾಲಮ್-ಎಣಿಕೆ: 2; */
ನೀವು ಕಾಲಮ್ಗಳ ಸಂಖ್ಯೆ ಮತ್ತು ಸೂಕ್ತ ಅಗಲ ಎರಡನ್ನೂ ನಿರ್ದಿಷ್ಟಪಡಿಸಿದರೆ ಏನಾಗುತ್ತದೆ? ನಿರ್ದಿಷ್ಟತೆಯ ಪ್ರಕಾರ, ಈ ಸಂದರ್ಭದಲ್ಲಿ ಕಾಲಮ್ ಎಣಿಕೆಗರಿಷ್ಠ ಸಂಖ್ಯೆಯ ಕಾಲಮ್ಗಳನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತದೆ:
ಲೇಖನ (ಕಾಲಮ್ಗಳು: 150px 3; /* ಕಾಲಮ್-ಅಗಲ: 150px; ಕಾಲಮ್-ಎಣಿಕೆ: 3; */ )
ವಾಸ್ತವವಾಗಿ, CSS3 ಕುರಿತು ನನ್ನ ಕೆಲವು ಲೇಖನಗಳನ್ನು ಒಳಗೊಂಡಂತೆ ವೆಬ್ ಮಾನದಂಡಗಳ ಅಭಿವೃದ್ಧಿಯನ್ನು ಅನುಸರಿಸಿ (ಉದಾಹರಣೆಗೆ ನೋಡಿ,), ವೆಬ್ ಡೆವಲಪರ್‌ಗಳಿಗೆ ತೆರೆಯುವ ಅವಕಾಶಗಳಿಂದ ನೀವು ಕಡಿಮೆ ಪ್ರೇರಿತರಾಗಿಲ್ಲ ಎಂದು ನಾನು ಭಾವಿಸುತ್ತೇನೆ. ವಿಷಯ ನಿಯೋಜನೆಯನ್ನು ನಿರ್ವಹಿಸಲು ಹೊಂದಿಕೊಳ್ಳುವ, ಹೊಂದಿಕೊಳ್ಳುವ ಮತ್ತು ಶಕ್ತಿಯುತ ಸಾಧನಗಳು ಹತ್ತಿರವಾಗುತ್ತಿವೆ ಮತ್ತು ಹೆಚ್ಚು ಪ್ರವೇಶಿಸಬಹುದಾಗಿದೆ. ಮತ್ತು ಸಂಕೀರ್ಣ ಸಮಸ್ಯೆಗಳನ್ನು ಪರಿಹರಿಸುವುದು ಸುಲಭವಾಗುತ್ತಿದೆ.
ಸಂವಾದಾತ್ಮಕ
ietestdrive.com ನಲ್ಲಿ CSS3 ಮಲ್ಟಿ-ಕಾಲಮ್ ಹೇಗೆ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ ಎಂಬುದರ ಕುರಿತು ನೀವು ಆಡಬಹುದು:
ಪ್ರಯತ್ನಿಸಿ, ಪ್ರಯೋಗ. ಬ್ರೌಸರ್ ಡೆವಲಪರ್‌ಗಳಿಗೆ ದೋಷಗಳನ್ನು ವರದಿ ಮಾಡಿ. ಮತ್ತು ಹಳೆಯ (ಮತ್ತು ತೋರಿಕೆಯಲ್ಲಿ ಆಧುನಿಕ, ಆದರೆ ಇನ್ನೂ ಸಂಪೂರ್ಣವಾಗಿ ಪ್ರಮಾಣಿತ-ಕಂಪ್ಲೈಂಟ್ ಅಲ್ಲ) ಬ್ರೌಸರ್‌ಗಳ ಬಳಕೆದಾರರು ಏನನ್ನು ನೋಡುತ್ತಾರೆ ಎಂಬುದರ ಕುರಿತು ಯೋಚಿಸಲು ಮರೆಯಬೇಡಿ-ಉದಾಹರಣೆಗೆ, ನೀವು jQuery ಅಂಕಣಕಾರಕ್ಕಾಗಿ ಪ್ಲಗಿನ್ ಅನ್ನು ಬಳಸಬಹುದು. ಹೊಂದಿಕೊಳ್ಳುವಿಕೆ ಮತ್ತು ಸಣ್ಣ ಮತ್ತು ದೊಡ್ಡ ಪರದೆಯ ವೀಕ್ಷಕರನ್ನು ನೆನಪಿಡಿ.