2x2 ಟೇಬಲ್ ಅನ್ನು ಹೇಗೆ ನಿರ್ಮಿಸುವುದು

ನೀವು ಸಾಲುಗಳು ಮತ್ತು ಕಾಲಮ್ಗಳ ಮೂಲಭೂತ ಅಂಶಗಳನ್ನು ಒಮ್ಮೆ ಅರ್ಥಮಾಡಿಕೊಂಡಾಗ HTML ಕೋಷ್ಟಕಗಳು ಸುಲಭವಾಗಿ ರಚಿಸಲ್ಪಡುತ್ತವೆ - ಮತ್ತು ನೀವು ಮೇಜಿನ ಬಳಕೆಯನ್ನು ಬಳಸುವಾಗ ಮತ್ತು ನೀವು ಅವುಗಳನ್ನು ತಪ್ಪಿಸಬೇಕಾದರೆ ಸರಿಯಾಗಿ ಅರ್ಥಮಾಡಿಕೊಂಡಾಗ ಒಮ್ಮೆ ಅರ್ಥಮಾಡಿಕೊಳ್ಳಬಹುದು.

ಟೇಬಲ್ಸ್ ಮತ್ತು ವೆಬ್ ವಿನ್ಯಾಸದ ಸಂಕ್ಷಿಪ್ತ ಇತಿಹಾಸ

ಅನೇಕ ವರ್ಷಗಳ ಹಿಂದೆ, ಸಿಎಸ್ಎಸ್ ಮತ್ತು ವೆಬ್ ಮಾನದಂಡಗಳನ್ನು ಸ್ವೀಕರಿಸಲು ಮೊದಲು, ವೆಬ್ ವಿನ್ಯಾಸಕರು ಎಚ್ಟಿಎಮ್ಎಲ್ <ಟೇಬಲ್> ಎಲಿಮೆಂಟ್ ಅನ್ನು ಸೈಟ್ಗಳಿಗೆ ಪುಟ ವಿನ್ಯಾಸವನ್ನು ಸೃಷ್ಟಿಸಿದರು. ವೆಬ್ಸೈಟ್ ವಿನ್ಯಾಸಗಳು "ಸ್ಲೈಸ್" ಆಗಿದ್ದು, ಒಂದು ಪಝಲ್ನಂತಹ ಸಣ್ಣ ತುಣುಕುಗಳಾಗಿರುತ್ತವೆ ಮತ್ತು ನಂತರ ಬ್ರೌಸರ್ನಲ್ಲಿ ನಿರೂಪಿಸಲು ಎಚ್ಟಿಎಮ್ಎಲ್ ಮೇಜಿನೊಂದಿಗೆ ಸಂಯೋಜಿಸಲ್ಪಡುತ್ತವೆ. ಇದು ಬಹಳ ಸಂಕೀರ್ಣವಾದ ಪ್ರಕ್ರಿಯೆಯಾಗಿದ್ದು ಅದು ಹೆಚ್ಚಿನ ಎಚ್ಟಿಎಮ್ಎಲ್ ಮಾರ್ಕ್ಅಪ್ ಅನ್ನು ರಚಿಸಿತು ಮತ್ತು ನಮ್ಮ ವೆಬ್ಸೈಟ್ಗಳು ಬಹು-ಪರದೆಯ ಜಗತ್ತಿನಲ್ಲಿ ಇಂದು ಬಳಸಿಕೊಳ್ಳುವುದಿಲ್ಲ. ವೆಬ್ಪುಟದ ದೃಷ್ಟಿಗೋಚರ ಮತ್ತು ವಿನ್ಯಾಸಕ್ಕಾಗಿ ಸಿಎಸ್ಎಸ್ ಸ್ವೀಕರಿಸಿದ ವಿಧಾನವಾಗಿರುವುದರಿಂದ, ಇದಕ್ಕಾಗಿ ಕೋಷ್ಟಕಗಳ ಬಳಕೆ ದೂರವಿತ್ತು ಮತ್ತು ಹಲವು ವೆಬ್ ವಿನ್ಯಾಸಕರು ತಪ್ಪಾಗಿ "ಕೋಷ್ಟಕಗಳು ಕೆಟ್ಟವು" ಎಂದು ತಪ್ಪಾಗಿ ನಂಬಿದ್ದರು. ಅದು ಮತ್ತು ಸುಳ್ಳು. ಲೇಔಟ್ಗಾಗಿ ಟೇಬಲ್ಸ್ ಕೆಟ್ಟದಾಗಿದೆ, ಆದರೆ ರೈಲು ವಿನ್ಯಾಸದ ಕ್ಯಾಲೆಂಡರ್ನಂತಹ ಕೋಷ್ಟಕ ಡೇಟಾವನ್ನು ಪ್ರದರ್ಶಿಸಲು ಅವುಗಳೆಂದರೆ ವೆಬ್ ವಿನ್ಯಾಸ ಮತ್ತು HTML ನಲ್ಲಿ ಸ್ಥಾನವಿದೆ. ಆ ವಿಷಯಕ್ಕಾಗಿ, ಟೇಬಲ್ ಬಳಸಿ ಇನ್ನೂ ಸ್ವೀಕಾರಾರ್ಹ ಮತ್ತು ಉತ್ತಮ ವಿಧಾನವಾಗಿದೆ.

ಆದ್ದರಿಂದ ನೀವು ಟೇಬಲ್ ಅನ್ನು ಹೇಗೆ ವಿನ್ಯಾಸಗೊಳಿಸುತ್ತೀರಿ? ಸರಳವಾಗಿ 2x2 ಕೋಷ್ಟಕವನ್ನು ರಚಿಸುವ ಮೂಲಕ ಪ್ರಾರಂಭಿಸೋಣ. ಇದು 2 ಕಾಲಮ್ಗಳನ್ನು ಹೊಂದಿರುತ್ತದೆ (ಇವು ಲಂಬ ಬ್ಲಾಕ್ಗಳು) ಮತ್ತು 2 ಸಾಲುಗಳು (ಸಮತಲ ಬ್ಲಾಕ್ಗಳು). ನೀವು 2x2 ಟೇಬಲ್ ಅನ್ನು ಕಟ್ಟಿದ ನಂತರ, ಹೆಚ್ಚುವರಿ ಸಾಲುಗಳು ಅಥವಾ ಕಾಲಮ್ಗಳನ್ನು ಸೇರಿಸುವ ಮೂಲಕ ನೀವು ಸರಳವಾಗಿ ಯಾವುದೇ ಗಾತ್ರದ ಟೇಬಲ್ ಅನ್ನು ರಚಿಸಬಹುದು.

ತೊಂದರೆ: ಸರಾಸರಿ

ಸಮಯ ಅಗತ್ಯವಿದೆ: 10 ನಿಮಿಷಗಳು

ಇಲ್ಲಿ ಹೇಗೆ ಇಲ್ಲಿದೆ:

  1. ಮೊದಲು ಟೇಬಲ್ ತೆರೆಯಿರಿ
  2. ಮೊದಲ ಸಾಲಿನ ಟ್ರಗ್ ಟ್ಯಾಗ್ನೊಂದಿಗೆ
  3. ತೆರೆಯಿರಿ
  4. Td ಟ್ಯಾಗ್
  5. ಯೊಂದಿಗೆ ಮೊದಲ ಕಾಲಮ್ ತೆರೆಯಿರಿ
  6. ಜೀವಕೋಶದ ವಿಷಯಗಳನ್ನು ಬರೆಯಿರಿ
  7. ಮೊದಲ ಕೋಶವನ್ನು ಮುಚ್ಚಿ ಮತ್ತು ಎರಡನೇ
  8. ತೆರೆಯಿರಿ
  9. ಎರಡನೇ ಜೀವಕೋಶದ ವಿಷಯಗಳನ್ನು ಬರೆಯಿರಿ
  10. ಎರಡನೇ ಕೋಶವನ್ನು ಮುಚ್ಚಿ ಮತ್ತು ಸಾಲುವನ್ನು ಮುಚ್ಚಿ
  11. ಎರಡನೆಯ ಸಾಲುವನ್ನು ಮೊದಲ
  12. ಎಂದು ಬರೆಯಿರಿ
  13. ನಂತರ ಕೋಷ್ಟಕವನ್ನು ಮುಚ್ಚಿ
  14. ನೀವು

    ಅಂಶವನ್ನು ಬಳಸಿಕೊಂಡು ನಿಮ್ಮ ಕೋಷ್ಟಕಕ್ಕೆ ಟೇಬಲ್ ಹೆಡರ್ಗಳನ್ನು ಸೇರಿಸಲು ಆಯ್ಕೆ ಮಾಡಬಹುದು. ಈ ಟೇಬಲ್ ಹೆಡರ್ಗಳು ಮೊದಲ ಟೇಬಲ್ ಸಾಲಿನಲ್ಲಿ ಅಥವಾ "ಟೇಬಲ್ ಡೇಟಾ" ತುಣುಕುಗಳನ್ನು ಬದಲಿಸುತ್ತವೆ, ಹೀಗೆ:

    ಈ ಪುಟವು ಬ್ರೌಸರ್ನಲ್ಲಿ ನಿರೂಪಿಸುವಾಗ, ಟೇಬಲ್ ಹೆಡರ್ಗಳೊಂದಿಗಿನ ಮೊದಲ ಸಾಲು, ಪೂರ್ವನಿಯೋಜಿತವಾಗಿ, ದಪ್ಪ ಪಠ್ಯದಲ್ಲಿ ಪ್ರದರ್ಶಿಸುತ್ತದೆ ಮತ್ತು ಅವುಗಳು ಗೋಚರಿಸುವ ಕೋಷ್ಟಕದಲ್ಲಿ ಕೇಂದ್ರೀಕೃತವಾಗುತ್ತವೆ.

    ಆದ್ದರಿಂದ, ಇದು HTML ನಲ್ಲಿ ಟೇಬಲ್ಗಳನ್ನು ಬಳಸುವುದು ಸರಿಯಾ?

    ಹೌದು - ಲೇಔಟ್ ಉದ್ದೇಶಗಳಿಗಾಗಿ ನೀವು ಅವುಗಳನ್ನು ಬಳಸುತ್ತಿಲ್ಲದಿರುವವರೆಗೆ. ನೀವು ಕೋಷ್ಟಕ ಮಾಹಿತಿಯನ್ನು ಪ್ರದರ್ಶಿಸಲು ಬಯಸಿದಲ್ಲಿ, ಹಾಗೆ ಮಾಡಲು ಒಂದು ಕೋಷ್ಟಕವಾಗಿದೆ. ವಾಸ್ತವವಾಗಿ, ಈ ಲೆಜಿಟ್ಮೇಟ್ ಎಚ್ಟಿಎಮ್ಎಲ್ ಎಲಿಮೆಂಟ್ ಅನ್ನು ನಿವಾರಿಸಲು ಕೆಲವು ತಪ್ಪಾಗಿ ಪರಿಶುದ್ಧತೆಯಿಂದಾಗಿ ಈ ದಿನ ಮತ್ತು ವಯಸ್ಸಿನಲ್ಲಿ ಲೇಔಟ್ ಕಾರಣಗಳಿಗಾಗಿ ಅವುಗಳನ್ನು ಬಳಸುವುದರಿಂದ ಹಿಂಬದಿಯಂತೆ ಟೇಬಲ್ ಅನ್ನು ತಪ್ಪಿಸುವುದು.

    ಜೆನ್ನಿಫರ್ ಕೈರ್ನ್ ಬರೆದಿರುವುದು. 8/11/16 ರಂದು ಜೆರೆಮಿ ಗಿರಾರ್ಡ್ರಿಂದ ಸಂಪಾದಿಸಲಾಗಿದೆ

    ಹೆಸರು ಪಾತ್ರ
    ಜೆರೆಮಿ ಡಿಸೈನರ್ < td> ಜೆನ್ನಿಫರ್ ಡೆವಲಪರ್