ವಿಷಯ ಮಾರ್ಕೆಟಿಂಗ್

ಬ್ಲಾಗರ್: ನಿಮ್ಮ ಬ್ಲಾಗ್‌ನಲ್ಲಿ ಕೋಡ್‌ಗಾಗಿ CSS ಶೈಲಿ

ಬ್ಲಾಗರ್ ಪ್ರವೇಶದಲ್ಲಿ ನಾನು ಕೋಡ್ ಪ್ರದೇಶಗಳನ್ನು ಹೇಗೆ ಮಾಡಿದ್ದೇನೆ ಎಂದು ಸ್ನೇಹಿತರೊಬ್ಬರು ನನ್ನನ್ನು ಕೇಳಿದರು. ನನ್ನ ಬ್ಲಾಗರ್ ಟೆಂಪ್ಲೇಟ್‌ನಲ್ಲಿ CSS ಗಾಗಿ ಸ್ಟೈಲ್ ಟ್ಯಾಗ್ ಅನ್ನು ಬಳಸಿಕೊಂಡು ನಾನು ಇದನ್ನು ಮಾಡಿದ್ದೇನೆ. ನಾನು ಸೇರಿಸಿದ್ದು ಇಲ್ಲಿದೆ:

p.code {
    font-family: Courier New;
    font-size: 8pt;
    border-style: inset;
    border-width: 3px;
    padding: 5px;
    background-color: #FFFFFF;
    line-height: 100%;
    margin: 10px;
}
  1. p.code: ಇದು HTML ಅನ್ನು ಗುರಿಯಾಗಿಸುವ CSS ನಿಯಮವಾಗಿದೆ <p> ವರ್ಗ ಹೆಸರಿನ "ಕೋಡ್" ಹೊಂದಿರುವ ಅಂಶಗಳು. ಇದರರ್ಥ ಈ ವರ್ಗದೊಂದಿಗಿನ ಯಾವುದೇ ಪ್ಯಾರಾಗ್ರಾಫ್ ಅನ್ನು ಈ ಕೆಳಗಿನ ಗುಣಲಕ್ಷಣಗಳಿಗೆ ಅನುಗುಣವಾಗಿ ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗುವುದು.
  2. font-family: Courier New;: ಈ ಆಸ್ತಿ ಫಾಂಟ್ ಕುಟುಂಬವನ್ನು "ಕೊರಿಯರ್ ನ್ಯೂ" ಗೆ ಹೊಂದಿಸುತ್ತದೆ. ಉದ್ದೇಶಿತ ಅಂಶಗಳಲ್ಲಿ ಪಠ್ಯಕ್ಕಾಗಿ ಬಳಸಲಾಗುವ ಫಾಂಟ್ ಅನ್ನು ಇದು ನಿರ್ದಿಷ್ಟಪಡಿಸುತ್ತದೆ.
  3. font-size: 8pt;: ಈ ಆಸ್ತಿಯು ಫಾಂಟ್ ಗಾತ್ರವನ್ನು 8 ಅಂಕಗಳಿಗೆ ಹೊಂದಿಸುತ್ತದೆ. ಉದ್ದೇಶಿತ ಅಂಶಗಳಲ್ಲಿರುವ ಪಠ್ಯವನ್ನು ಈ ಫಾಂಟ್ ಗಾತ್ರದಲ್ಲಿ ಪ್ರದರ್ಶಿಸಲಾಗುತ್ತದೆ.
  4. border-style: inset;: ಈ ಆಸ್ತಿ ಗಡಿ ಶೈಲಿಯನ್ನು "ಇನ್‌ಸೆಟ್" ಗೆ ಹೊಂದಿಸುತ್ತದೆ. ಇದು ಉದ್ದೇಶಿತ ಅಂಶಗಳ ಸುತ್ತಲಿನ ಗಡಿಗೆ ಮುಳುಗಿದ ಅಥವಾ ಒತ್ತಿದ ನೋಟವನ್ನು ಸೃಷ್ಟಿಸುತ್ತದೆ.
  5. border-width: 3px;: ಈ ಗುಣಲಕ್ಷಣವು ಗಡಿಯ ಅಗಲವನ್ನು 3 ಪಿಕ್ಸೆಲ್‌ಗಳಿಗೆ ಹೊಂದಿಸುತ್ತದೆ. ಅಂಶಗಳ ಸುತ್ತಲಿನ ಅಂಚು 3 ಪಿಕ್ಸೆಲ್‌ಗಳ ದಪ್ಪವಾಗಿರುತ್ತದೆ.
  6. padding: 5px;: ಈ ಗುಣಲಕ್ಷಣವು ಉದ್ದೇಶಿತ ಅಂಶಗಳ ಒಳಗಿನ ವಿಷಯದ ಸುತ್ತಲೂ 5 ಪಿಕ್ಸೆಲ್‌ಗಳ ಪ್ಯಾಡಿಂಗ್ ಅನ್ನು ಸೇರಿಸುತ್ತದೆ. ಇದು ಪಠ್ಯ ಮತ್ತು ಗಡಿಯ ನಡುವಿನ ಅಂತರವನ್ನು ಒದಗಿಸುತ್ತದೆ.
  7. background-color: #FFFFFF;: ಈ ಗುಣಲಕ್ಷಣವು ಹಿನ್ನೆಲೆ ಬಣ್ಣವನ್ನು ಬಿಳಿ ಬಣ್ಣಕ್ಕೆ ಹೊಂದಿಸುತ್ತದೆ (#FFFFFF). ಉದ್ದೇಶಿತ ಅಂಶಗಳಲ್ಲಿನ ವಿಷಯವು ಬಿಳಿ ಹಿನ್ನೆಲೆಯನ್ನು ಹೊಂದಿರುತ್ತದೆ.
  8. line-height: 100%;: ಈ ಆಸ್ತಿಯು ಸಾಲಿನ ಎತ್ತರವನ್ನು ಫಾಂಟ್ ಗಾತ್ರದ 100% ಗೆ ಹೊಂದಿಸುತ್ತದೆ. ಫಾಂಟ್ ಗಾತ್ರಕ್ಕೆ ಅನುಗುಣವಾಗಿ ಪಠ್ಯ ಸಾಲುಗಳು ಅಂತರದಲ್ಲಿರುತ್ತವೆ ಎಂದು ಇದು ಖಚಿತಪಡಿಸುತ್ತದೆ.
  9. margin: 10px;: ಈ ಗುಣಲಕ್ಷಣವು ಸಂಪೂರ್ಣ ಅಂಶದ ಸುತ್ತಲೂ 10 ಪಿಕ್ಸೆಲ್‌ಗಳ ಅಂಚನ್ನು ಸೇರಿಸುತ್ತದೆ. ಇದು ಈ ಅಂಶ ಮತ್ತು ಪುಟದಲ್ಲಿನ ಇತರ ಅಂಶಗಳ ನಡುವೆ ಅಂತರವನ್ನು ಒದಗಿಸುತ್ತದೆ.

ಒದಗಿಸಿದ CSS ಕೋಡ್ ವರ್ಗ "ಕೋಡ್" ನೊಂದಿಗೆ HTML ಪ್ಯಾರಾಗ್ರಾಫ್‌ಗಳಿಗೆ ಶೈಲಿಯನ್ನು ವ್ಯಾಖ್ಯಾನಿಸುತ್ತದೆ. ಇದು ಈ ಪ್ಯಾರಾಗಳಿಗೆ ಫಾಂಟ್, ಫಾಂಟ್ ಗಾತ್ರ, ಗಡಿ ಶೈಲಿ, ಗಡಿ ಅಗಲ, ಪ್ಯಾಡಿಂಗ್, ಹಿನ್ನೆಲೆ ಬಣ್ಣ, ಸಾಲಿನ ಎತ್ತರ ಮತ್ತು ಅಂಚುಗಳನ್ನು ಹೊಂದಿಸುತ್ತದೆ. ಈ ಶೈಲಿಯನ್ನು ಬ್ಲಾಗರ್ ಪೋಸ್ಟ್‌ನಲ್ಲಿ ಕೋಡ್ ತುಣುಕುಗಳು ಅಥವಾ ಪೂರ್ವ ಫಾರ್ಮ್ಯಾಟ್ ಮಾಡಿದ ಪಠ್ಯಕ್ಕೆ ನಿರ್ದಿಷ್ಟ ನೋಟವನ್ನು ನೀಡಲು ಅನ್ವಯಿಸಬಹುದು.

ಇದು ಹೇಗೆ ಕಾಣುತ್ತದೆ ಎಂಬುದು ಇಲ್ಲಿದೆ:

p.code {
ಫಾಂಟ್-ಕುಟುಂಬ: ಕೊರಿಯರ್ ಹೊಸ;
ಫಾಂಟ್ ಗಾತ್ರ: 8pt;
ಗಡಿ ಶೈಲಿ: ಒಳಹರಿವು;
ಗಡಿ ಅಗಲ: 3px;
ಪ್ಯಾಡಿಂಗ್: 5px;
ಹಿನ್ನೆಲೆ-ಬಣ್ಣ: #FFFFFF;
ಲೈನ್-ಎತ್ತರ: 100%;
ಅಂಚು: 10px;
}

ಹ್ಯಾಪಿ ಕೋಡಿಂಗ್!

Douglas Karr

Douglas Karr ನ ಸಿಎಂಒ ಆಗಿದೆ ಓಪನ್‌ಇನ್‌ಸೈಟ್‌ಗಳು ಮತ್ತು ಸ್ಥಾಪಕ Martech Zone. ಡಗ್ಲಾಸ್ ಹಲವಾರು ಯಶಸ್ವಿ ಮಾರ್ಟೆಕ್ ಸ್ಟಾರ್ಟ್‌ಅಪ್‌ಗಳಿಗೆ ಸಹಾಯ ಮಾಡಿದ್ದಾರೆ, ಮಾರ್ಟೆಕ್ ಸ್ವಾಧೀನಗಳು ಮತ್ತು ಹೂಡಿಕೆಗಳಲ್ಲಿ $5 ಬಿಲಿಯನ್‌ಗಿಂತ ಹೆಚ್ಚಿನ ಪರಿಶ್ರಮದಲ್ಲಿ ಸಹಾಯ ಮಾಡಿದ್ದಾರೆ ಮತ್ತು ಕಂಪನಿಗಳು ತಮ್ಮ ಮಾರಾಟ ಮತ್ತು ಮಾರುಕಟ್ಟೆ ತಂತ್ರಗಳನ್ನು ಕಾರ್ಯಗತಗೊಳಿಸಲು ಮತ್ತು ಸ್ವಯಂಚಾಲಿತಗೊಳಿಸಲು ಸಹಾಯ ಮಾಡುವುದನ್ನು ಮುಂದುವರೆಸಿದ್ದಾರೆ. ಡೌಗ್ಲಾಸ್ ಅಂತರಾಷ್ಟ್ರೀಯವಾಗಿ ಗುರುತಿಸಲ್ಪಟ್ಟ ಡಿಜಿಟಲ್ ರೂಪಾಂತರ ಮತ್ತು ಮಾರ್ಟೆಕ್ ತಜ್ಞ ಮತ್ತು ಸ್ಪೀಕರ್. ಡೌಗ್ಲಾಸ್ ಅವರು ಡಮ್ಮೀಸ್ ಗೈಡ್ ಮತ್ತು ವ್ಯಾಪಾರ ನಾಯಕತ್ವ ಪುಸ್ತಕದ ಪ್ರಕಟಿತ ಲೇಖಕರೂ ಆಗಿದ್ದಾರೆ.

ಸಂಬಂಧಿತ ಲೇಖನಗಳು

ಮೇಲಿನ ಬಟನ್ಗೆ ಹಿಂತಿರುಗಿ
ಮುಚ್ಚಿ

ಆಡ್‌ಬ್ಲಾಕ್ ಪತ್ತೆಯಾಗಿದೆ

Martech Zone ಜಾಹೀರಾತು ಆದಾಯ, ಅಂಗಸಂಸ್ಥೆ ಲಿಂಕ್‌ಗಳು ಮತ್ತು ಪ್ರಾಯೋಜಕತ್ವಗಳ ಮೂಲಕ ನಾವು ನಮ್ಮ ಸೈಟ್‌ನಿಂದ ಹಣಗಳಿಸುವುದರಿಂದ ಯಾವುದೇ ವೆಚ್ಚವಿಲ್ಲದೆ ಈ ವಿಷಯವನ್ನು ನಿಮಗೆ ಒದಗಿಸಲು ಸಾಧ್ಯವಾಗುತ್ತದೆ. ನೀವು ನಮ್ಮ ಸೈಟ್ ಅನ್ನು ವೀಕ್ಷಿಸಿದಾಗ ನಿಮ್ಮ ಜಾಹೀರಾತು ಬ್ಲಾಕರ್ ಅನ್ನು ನೀವು ತೆಗೆದುಹಾಕಿದರೆ ನಾವು ಪ್ರಶಂಸಿಸುತ್ತೇವೆ.