ಸಿಎಸ್ಎಸ್ ಆಸ್ತಿ ವ್ಯಾಖ್ಯಾನ

ವೆಬ್ಸೈಟ್ನ ದೃಶ್ಯ ಶೈಲಿ ಮತ್ತು ವಿನ್ಯಾಸವನ್ನು ಸಿಎಸ್ಎಸ್ ಅಥವಾ ಕ್ಯಾಸ್ಕೇಡಿಂಗ್ ಸ್ಟೈಲ್ ಶೀಟ್ಸ್ನಿಂದ ನಿರ್ದೇಶಿಸಲಾಗಿದೆ. ಇವು ವೆಬ್ಪುಟದ ಎಚ್ಟಿಎಮ್ಎಲ್ ಮಾರ್ಕ್ಅಪ್ ಅನ್ನು ರೂಪಿಸುತ್ತವೆ, ವೆಬ್ ಮಾರ್ಕ್ಅಪ್ಗಳನ್ನು ಆ ಮಾರ್ಕ್ಅಪ್ನ ಫಲಿತಾಂಶಗಳನ್ನು ಹೇಗೆ ಪ್ರದರ್ಶಿಸಬೇಕು ಎಂಬುದರ ಸೂಚನೆಗಳನ್ನು ಒದಗಿಸುತ್ತವೆ. ಸಿಎಸ್ಎಸ್ ಒಂದು ಪುಟದ ಲೇಔಟ್, ಜೊತೆಗೆ ಬಣ್ಣ, ಹಿನ್ನೆಲೆ ಚಿತ್ರಗಳನ್ನು, ಮುದ್ರಣಕಲೆ ಮತ್ತು ಹೆಚ್ಚು ನಿಭಾಯಿಸುತ್ತದೆ.

ನೀವು ಸಿಎಸ್ಎಸ್ ಫೈಲ್ ನೋಡಿದರೆ, ಯಾವುದೇ ಮಾರ್ಕ್ಅಪ್ ಅಥವಾ ಕೋಡಿಂಗ್ ಭಾಷೆ ಇಷ್ಟಪಡುವಿರಿ ಎಂದು ನೀವು ನೋಡುತ್ತೀರಿ, ಈ ಫೈಲ್ಗಳು ಅವರಿಗೆ ನಿರ್ದಿಷ್ಟ ಸಿಂಟ್ಯಾಕ್ಸ್ ಅನ್ನು ಹೊಂದಿವೆ. ಪ್ರತಿಯೊಂದು ಸ್ಟೈಲ್ ಶೀಟ್ ಹಲವಾರು ಸಿಎಸ್ಎಸ್ ನಿಯಮಗಳಿಂದ ಮಾಡಲ್ಪಟ್ಟಿದೆ. ಈ ನಿಯಮಗಳು, ಪೂರ್ಣವಾಗಿ ತೆಗೆದುಕೊಂಡಾಗ, ಯಾವ ಸೈಟ್ಗಳು ಶೈಲಿಗಳಾಗಿವೆ.

ಒಂದು ಸಿಎಸ್ಎಸ್ ನಿಯಮದ ಭಾಗಗಳು

ಸೆಲೆಕ್ಟರ್ ಮತ್ತು ಘೋಷಣೆ - ಸಿಎಸ್ಎಸ್ ನಿಯಮ ಎರಡು ವಿಭಿನ್ನ ಭಾಗಗಳಿಂದ ಮಾಡಲ್ಪಟ್ಟಿದೆ. ಸೆಲೆಕ್ಟರ್ ಒಂದು ಪುಟದಲ್ಲಿ ಶೈಲಿಯಲ್ಲಿದೆ ಎಂಬುದನ್ನು ನಿರ್ಧರಿಸುತ್ತದೆ ಮತ್ತು ಘೋಷಣೆ ಅದನ್ನು ಹೇಗೆ ವಿನ್ಯಾಸಗೊಳಿಸಬೇಕೆಂದು ನಿರ್ಧರಿಸುತ್ತದೆ. ಉದಾಹರಣೆಗೆ:

p {
ಬಣ್ಣ: # 000;
}

ಇದು ಸಿಎಸ್ಎಸ್ ನಿಯಮವಾಗಿದೆ. ಆಯ್ದ ಭಾಗವು "p", ಇದು "ಪ್ಯಾರಾಗಳು" ಗಾಗಿ ಒಂದು ಅಂಶ ಆಯ್ಕೆಯಾಗಿದೆ. ಆದ್ದರಿಂದ, ಸೈಟ್ನಲ್ಲಿನ ಎಲ್ಲಾ ಪ್ಯಾರಾಗಳನ್ನು ಆಯ್ಕೆಮಾಡಿ ಮತ್ತು ಅವುಗಳನ್ನು ಈ ಶೈಲಿಗೆ ಒದಗಿಸಿ (ನಿಮ್ಮ CSS ಡಾಕ್ಯುಮೆಂಟ್ನಲ್ಲಿ ಬೇರೆಡೆ ನಿರ್ದಿಷ್ಟವಾದ ಶೈಲಿಗಳಿಂದ ಗುರಿಯಾಗಿಸಲ್ಪಟ್ಟಿರುವ ಪ್ಯಾರಾಗಳು ಇಲ್ಲದಿದ್ದರೆ).

"ಬಣ್ಣ: # 000;" ಎಂದು ಹೇಳುವ ನಿಯಮದ ಭಾಗ ಘೋಷಣೆ ಎಂದು ಕರೆಯಲಾಗುತ್ತದೆ. ಆ ಘೋಷಣೆ ಎರಡು ತುಣುಕುಗಳಿಂದ ಮಾಡಲ್ಪಟ್ಟಿದೆ - ಆಸ್ತಿ ಮತ್ತು ಮೌಲ್ಯ.

ಆಸ್ತಿಯು ಈ ಘೋಷಣೆಯ "ಬಣ್ಣ" ತುಣುಕು. ಸೆಲೆಕ್ಟರ್ನ ಯಾವ ಅಂಶವು ದೃಷ್ಟಿಗೋಚರವಾಗಿ ಬದಲಾಗುವುದೆಂದು ಇದು ಆದೇಶಿಸುತ್ತದೆ.

ಮೌಲ್ಯವು ಆಯ್ಕೆ ಮಾಡಿದ CSS ಆಸ್ತಿಯನ್ನು ಬದಲಾಯಿಸುತ್ತದೆ. ನಮ್ಮ ಉದಾಹರಣೆಯಲ್ಲಿ, ನಾವು # 000 ನ ಹೆಕ್ಸ್ ಮೌಲ್ಯವನ್ನು ಬಳಸುತ್ತೇವೆ, ಇದು "ಕಪ್ಪು" ಗಾಗಿ ಸಿಎಸ್ಎಸ್ ಸಂಕ್ಷಿಪ್ತ ರೂಪವಾಗಿದೆ.

ಆದ್ದರಿಂದ ಈ ಸಿಎಸ್ಎಸ್ ನಿಯಮವನ್ನು ಬಳಸಿ, ನಮ್ಮ ಪುಟವು ಪ್ಯಾಟರ್ಗಳನ್ನು ಕಪ್ಪು ಬಣ್ಣದ ಫಾಂಟ್ನಲ್ಲಿ ಪ್ರದರ್ಶಿಸುತ್ತದೆ.

ಸಿಎಸ್ಎಸ್ ಆಸ್ತಿ ಬೇಸಿಕ್ಸ್

ನೀವು ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಬರೆಯುವಾಗ, ನೀವು ಸರಿಯಾಗಿ ನೋಡಿದಂತೆ ಅವುಗಳನ್ನು ಸರಳವಾಗಿ ಮಾಡಲು ಸಾಧ್ಯವಿಲ್ಲ. ನಿದರ್ಶನಗಳಿಗಾಗಿ, "ಬಣ್ಣ" ಒಂದು ನಿಜವಾದ ಸಿಎಸ್ಎಸ್ ಆಸ್ತಿಯಾಗಿದೆ, ಆದ್ದರಿಂದ ನೀವು ಅದನ್ನು ಬಳಸಬಹುದು. ಈ ಆಸ್ತಿ ಒಂದು ಅಂಶದ ಪಠ್ಯದ ಬಣ್ಣವನ್ನು ನಿರ್ಧರಿಸುತ್ತದೆ. ನೀವು "ಪಠ್ಯ-ಬಣ್ಣ" ಅಥವಾ "ಫಾಂಟ್-ಬಣ್ಣ" ಅನ್ನು ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳಾಗಿ ಬಳಸಲು ಪ್ರಯತ್ನಿಸಿದರೆ, ಅವುಗಳು ವಿಫಲವಾಗುತ್ತವೆ ಏಕೆಂದರೆ ಅವುಗಳು ಸಿಎಸ್ಎಸ್ ಭಾಷೆಯ ನಿಜವಾದ ಭಾಗಗಳು ಅಲ್ಲ.

ಇನ್ನೊಂದು ಉದಾಹರಣೆಯೆಂದರೆ "ಹಿನ್ನೆಲೆ-ಚಿತ್ರ" ಸ್ವತ್ತು. ಈ ಗುಣಲಕ್ಷಣವು ಹಿನ್ನೆಲೆಗೆ ಬಳಸಬಹುದಾದ ಚಿತ್ರವನ್ನು ಹೊಂದಿಸುತ್ತದೆ, ಹೀಗೆ:

. ಲಾಲೋ {
background-image: url (/images/company-logo.png);
}

ನೀವು "ಹಿನ್ನೆಲೆ-ಚಿತ್ರ" ಅಥವಾ "ಹಿನ್ನೆಲೆ-ಗ್ರಾಫಿಕ್" ಅನ್ನು ಒಂದು ಆಸ್ತಿಯಾಗಿ ಬಳಸಲು ಪ್ರಯತ್ನಿಸಿದರೆ, ಅವುಗಳು ವಿಫಲಗೊಳ್ಳುತ್ತವೆ, ಏಕೆಂದರೆ ಅವುಗಳು ಮತ್ತೊಮ್ಮೆ ನಿಜವಾದ ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳಲ್ಲ.

ಕೆಲವು ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳು

ನೀವು ಸೈಟ್ಗೆ ಶೈಲಿ ನೀಡಲು ಬಳಸಬಹುದಾದ ಹಲವಾರು CSS ಗುಣಲಕ್ಷಣಗಳಿವೆ. ಕೆಲವು ಉದಾಹರಣೆಗಳು ಹೀಗಿವೆ:

ಈ ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳು ಉದಾಹರಣೆಗಳಾಗಿ ಬಳಸಲು ಶ್ರೇಷ್ಠವಾದವುಗಳಾಗಿವೆ, ಏಕೆಂದರೆ ಅವುಗಳು ಎಲ್ಲರೂ ಸರಳವಾಗಿರುತ್ತವೆ ಮತ್ತು ನಿಮಗೆ ಸಿಎಸ್ಎಸ್ ತಿಳಿದಿಲ್ಲವಾದರೂ ಸಹ, ನೀವು ಅವರ ಹೆಸರುಗಳ ಆಧಾರದ ಮೇಲೆ ಏನು ಮಾಡಬಹುದೆಂದು ಊಹಿಸಬಹುದು.

ಇತರ ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳನ್ನು ನೀವು ಎದುರಿಸಬಹುದು ಮತ್ತು ಅವುಗಳು ಅವುಗಳ ಹೆಸರುಗಳ ಆಧಾರದ ಮೇಲೆ ಹೇಗೆ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತವೆ ಎನ್ನುವುದನ್ನು ಸ್ಪಷ್ಟವಾಗಿಲ್ಲದಿರಬಹುದು:

ನೀವು ವೆಬ್ ವಿನ್ಯಾಸವನ್ನು ಆಳವಾಗಿ ಪಡೆದುಕೊಳ್ಳುತ್ತಿದ್ದಂತೆ, ಈ ಎಲ್ಲಾ ಗುಣಲಕ್ಷಣಗಳನ್ನು ಮತ್ತು ಹೆಚ್ಚಿನದನ್ನು ನೀವು ಎದುರಿಸುತ್ತೀರಿ (ಮತ್ತು ಬಳಸಲು)!

ಪ್ರಾಪರ್ಟೀಸ್ ಮೌಲ್ಯಗಳು ಬೇಕು

ಪ್ರತಿ ಬಾರಿಯೂ ನೀವು ಆಸ್ತಿಯನ್ನು ಬಳಸಿದರೆ, ನೀವು ಅದನ್ನು ಮೌಲ್ಯವನ್ನು ನೀಡಬೇಕು - ಮತ್ತು ಕೆಲವು ಗುಣಲಕ್ಷಣಗಳು ಕೆಲವು ಮೌಲ್ಯಗಳನ್ನು ಮಾತ್ರ ಸ್ವೀಕರಿಸಬಹುದು.

"ಬಣ್ಣ" ಆಸ್ತಿಯ ನಮ್ಮ ಮೊದಲ ಉದಾಹರಣೆಯಲ್ಲಿ, ನಾವು ಬಣ್ಣ ಮೌಲ್ಯವನ್ನು ಬಳಸಬೇಕಾಗಿದೆ. ಇದು ಹೆಕ್ಸ್ ಮೌಲ್ಯ , RGBA ಮೌಲ್ಯ, ಅಥವಾ ಬಣ್ಣ ಕೀವರ್ಡ್ಗಳಾಗಿರಬಹುದು . ಆ ಮೌಲ್ಯಗಳು ಯಾವುದೇ ಕೆಲಸ ಮಾಡುತ್ತದೆ, ಹೇಗಾದರೂ, ನೀವು ಈ ಆಸ್ತಿಯೊಂದಿಗೆ "ಕತ್ತಲೆಯಾದ" ಪದವನ್ನು ಬಳಸಿದರೆ, ಆ ಪದದ ವಿವರಣಾತ್ಮಕವಾಗಿರುವುದರಿಂದ, ಅದು ಸಿಎಸ್ಎಸ್ನಲ್ಲಿ ಮಾನ್ಯತೆಯ ಮೌಲ್ಯವಲ್ಲ ಏಕೆಂದರೆ ಅದು ಏನನ್ನೂ ಮಾಡುವುದಿಲ್ಲ.

"ಹಿನ್ನೆಲೆ-ಇಮೇಜ್" ನ ನಮ್ಮ ಎರಡನೆಯ ಉದಾಹರಣೆಯಲ್ಲಿ ನಿಮ್ಮ ಸೈಟ್ನ ಫೈಲ್ಗಳಿಂದ ನಿಜವಾದ ಚಿತ್ರವನ್ನು ಪಡೆದುಕೊಳ್ಳಲು ಇಮೇಜ್ ಪಥವನ್ನು ಬಳಸಬೇಕಾಗುತ್ತದೆ. ಇದು ಅಗತ್ಯವಿರುವ ಮೌಲ್ಯ / ಸಿಂಟ್ಯಾಕ್ಸ್ ಆಗಿದೆ.

ಎಲ್ಲಾ ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳು ಅವರು ನಿರೀಕ್ಷಿಸುವ ಮೌಲ್ಯಗಳನ್ನು ಹೊಂದಿವೆ. ಉದಾಹರಣೆಗೆ:

ನೀವು ಸಿಎಸ್ಎಸ್ ಗುಣಲಕ್ಷಣಗಳ ಪಟ್ಟಿಯ ಮೂಲಕ ಹೋದರೆ, ಅವುಗಳಲ್ಲಿ ಪ್ರತಿಯೊಂದೂ ನಿರ್ದಿಷ್ಟ ಮೌಲ್ಯಗಳನ್ನು ಹೊಂದಿದ್ದು, ಅವರು ಉದ್ದೇಶಿಸಿರುವ ಶೈಲಿಗಳನ್ನು ರಚಿಸಲು ಬಳಸಲಾಗುತ್ತದೆ.

ಜೆರೆಮಿ ಗಿರಾರ್ಡ್ ಸಂಪಾದಿಸಿದ್ದಾರೆ