ಸಿಎಸ್ಎಸ್ ನೆರಳು: ಮಾಡಲು ಹೇಗೆ

ಕತ್ತಲೆ ಇಲ್ಲದೆ ನೆರಳಿನಲ್ಲಿ ಇಲ್ಲದೇ ಬೆಳಕು ಸ್ವರೂಪವಿರುತ್ತದೆ. ಸಹ ಮೂಲ ಎಂಬ ಮಹಿಳೆಯರಿಗೆ ಮೇಕಪ್ ಸಾಧನ "ನೆರಳು." ನಿಮ್ಮ ಪುಟಗಳಿಗೆ ಸೌಂದರ್ಯ ತರಲು ಬಯಸಿದರೆ, ನೀವು ಬಲ ಮಹತ್ವ ನೀಡಲು ಅಗತ್ಯವಿದೆ - ಸಿಎಸ್ಎಸ್ ನೆರಳು ಎಲ್ಲಿ ಅಗತ್ಯವಿದೆಯೇ ಅಲ್ಲಿ ಸೇರಿಸಿ.

ಕೆಳಗೆ ವಸ್ತು ನೀವು ನೆರಳು ಅನುಸ್ಥಾಪಿಸಲು ಅಥವಾ ಸಿಎಸ್ಎಸ್ ಕೋಡ್ ಬಳಸಿ ಚಿತ್ರಗಳನ್ನು ನಿರ್ಬಂಧಿಸಲು ಹೇಗೆ ತಿಳಿಯಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ.

ಸಿಎಸ್ಎಸ್ ನೆರಳು. ವಾಕ್ಯ

ಒಂದು ಬ್ಲಾಕ್ ಮತ್ತು ನೆರಳು - - ಈ ಸ್ವತಃ ಒಂದು ನೆರಳು ಅಲ್ಲಿ ಬಾಕ್ಸ್ ವಾಸ್ತವವಾಗಿ ಬಾಕ್ಸ್ ನೆರಳು.

ಕೋಡ್ ಕಟ್ಟುಪಟ್ಟಿಗಳು ಬರೆಯಲಾಗಿದೆ:

{ಬಾಕ್ಸ್ ನೆರಳು: 11px 22px 33px 44px # 333333;}.

ಲೈನ್ ಘಟಕದ ನೆರಳು ಪಿಕ್ಸೆಲ್ ತ್ರಿಜ್ಯದ ಸ್ಟ್ಯಾಂಡರ್ಡ್ ಗೆ ನಿಗದಿಪಡಿಸಲಾಗಿದೆ ಎಂದು ತಿಳಿಸುತ್ತದೆ. ಕೆಳಗಿನಂತೆ ಡೇಟಾ ಗೂಢಲಿಪಿಕರಣ:

• 11px - ನೆರಳು ಆಫ್ಸೆಟ್ ಎಕ್ಸ್ ಅಕ್ಷದಲ್ಲಿ ಬ್ಲಾಕ್ಗೆ ಸಂಬಂಧಿಕರನ್ನು (ಸಕಾರಾತ್ಮಕ ಮೌಲ್ಯ (20px) ಬಲ ನೆರಳು, ಋಣಾತ್ಮಕ (-37px) ಬದಲಾಗುತ್ತದೆ - ಎಡಕ್ಕೆ);
• 22px - ಬ್ಲಾಕ್ Y- ಆಕ್ಸಿಸ್ ಸಂಬಂಧಿಸಿದಂತೆ (ಧನಾತ್ಮಕ ಮೌಲ್ಯ (5px) ಲೀಡ್ ನೆರಳಿನಲ್ಲಿ ಕೆಳಗೆ ಋಣಾತ್ಮಕ (-17px) ಒಂದು ಶಿಫ್ಟ್ - ಅಪ್) ನೆರಳು ಸ್ಥಳಾಂತರ;
• 33px - ಈ ಕಳಂಕ ನಿಯತಾಂಕ, ಹೆಚ್ಚಿನ ಸಂಖ್ಯೆ, ಬಲವಾದ ಪರಿಣಾಮವನ್ನು;
• 44px - ನೆರಳುಗಳು ತ್ರಿಜ್ಯವು ಮತ್ತು ನೇರವಾಗಿ ಅನುಗುಣವಾಗಿರುತ್ತದೆ;
• # 333333 - ನೆರಳಿನಲ್ಲಿ ಚಿತ್ರಿಸಲಾಗುತ್ತದೆ, ಬಣ್ಣ,.

ಕಳೆದ ಮೂರು ನಿಯತಾಂಕಗಳು ಐಚ್ಛಿಕ ಮತ್ತು ಸರಳವಾಗಿ ಸ್ಟ್ರಿಂಗ್ ಬಿಟ್ಟುಬಿಡಬಹುದು, ಅಂದರೆ {ಬಾಕ್ಸ್ ನೆರಳು: 10px 13px; } - .. ಇಂತಹ ಲೈನ್ ಸರಿಯಲ್ಲದ (ನೆರಳು ಬಣ್ಣ ಪಠ್ಯ ಬಣ್ಣ ಬ್ಲಾಕ್ನಲ್ಲಿ ಇರುತ್ತದೆ) ಆಗಿದೆ.

ಹೀಗಾಗಿ, ನಿಮ್ಮ ಸೈಟ್ನ ಪುಟಗಳಲ್ಲಿ ನೆರಳುಗಳು ಸೃಷ್ಟಿಸುವಲ್ಲಿ ಒಂದು ತೊಂದರೆ, ಆದರೆ ನೀವು ರಚಿಸಬಹುದು ಅನೇಕ ಸಂತೋಷವನ್ನು ಕಾಣುವ ಪರಿಣಾಮಗಳು! ವಿನ್ಯಾಸ, ಪ್ರತಿ ವಿವರ, ಪ್ರತಿ ವಿವರ ಪ್ರಮುಖ ಕಾರಣ, ನಿಮ್ಮ ಮಗುವು ಅನನ್ಯ, ಗಾಯಕರಾದ ಮಾಡಿ. ಇಲ್ಲಿ, ಇದು ಕಾಣುತ್ತದೆ, ವಿಶೇಷ ಏನೂ, ಆದರೆ ಇದು ಹೆಚ್ಚು ಆಸಕ್ತಿಕರ ಮತ್ತು ಆಕರ್ಷಕವಾಗಿದೆ.

ಇದು ಕೋಡಿಂಗ್ ಪ್ರಕಾರ ನೆರಳು ಸಿಎಸ್ಎಸ್ ಬ್ಲಾಕ್ ಕಾಣುತ್ತದೆ, ಕೆಲವು ವಿವರಣಾತ್ಮಕ ಉದಾಹರಣೆಗಳು ಪರಿಗಣಿಸಿ:

1. {ಬಾಕ್ಸ್ ನೆರಳು: 25px 25px;} - ಸಿಎಸ್ಎಸ್ ನೆರಳು ಅಕ್ಷಗಳ 25 ಪಿಕ್ಸೆಲ್ಗಳು ಆಫ್ಸೆಟ್.
2. {ಬಾಕ್ಸ್ ನೆರಳು: 25px 25px 10px;} - ಸಿಎಸ್ಎಸ್ ನೆರಳು ಆಫ್ಸೆಟ್ 25 ಪಿಕ್ಸೆಲ್ಗಳು ಅಂಚುಗಳು ಅಸ್ಪಷ್ಟಗೊಳಿಸಲು 10 ಪಿಕ್ಸೆಲ್ಗಳು ಅಕ್ಷಗಳು.
3. {ಬಾಕ್ಸ್ ನೆರಳು: 25px 25px 10px 5px;} - ಸಿಎಸ್ಎಸ್ ನೆರಳು ಅಕ್ಷಗಳ ಆಫ್ಸೆಟ್ 25 ಪಿಕ್ಸೆಲ್ಗಳು, ಮಸುಕು 10 ಪಿಕ್ಸೆಲ್ಗಳು ಅಂಚಿನಿಂದ ಮತ್ತು 5 ಪಿಕ್ಸೆಲ್ಗಳ ಪೂರ್ವನಿರ್ಧರಿತ ತ್ರಿಜ್ಯದ
4. {ಬಾಕ್ಸ್ ನೆರಳು: 25px 25px 10px 5px # 9e9e9e;} - 10 ಪಿಕ್ಸೆಲ್ಗಳು 25 ಪಿಕ್ಸೆಲ್ಗಳು ತೆಳುವಾಗಿದೆ ಅಂಚುಗಳ ಮೂಲಕ ಸಿಎಸ್ಎಸ್ ನೆರಳು ಆಫ್ಸೆಟ್ ಅಕ್ಷದ, 5 ಪಿಕ್ಸೆಲ್ಗಳು ಮತ್ತು ಬಣ್ಣದ ವ್ಯಾಪ್ತಿಯು ಸೂಚಿಸಿ.

ಡ್ರಾಪ್ ನೆರಳು

ರಚಿಸಲು ಹೆಚ್ಚು, ಸುಂದರ ಸೊಗಸಾದ ಮತ್ತು ಮೂಲ ಛಾಯೆಗಳು ವಿವಿಧ ಪರಿಣಾಮಗಳನ್ನು ಹೊಂದಿವೆ. ನೀವು ಒಳ ನೆರಳು ಮಾಡಬಹುದು. ಇದು "ಸೆಟ್", ಮಾನದಂಡಗಳ ಹೆಚ್ಚಿನ ವಿವರಣೆ ನಿಯತಾಂಕಗಳನ್ನು ಸೂಚಿಸಲು ಎಂದಿನಂತೆ ಹೋಗುತ್ತದೆ ಸಾಕಷ್ಟು ಕೋಡ್ ಇಲ್ಲಿದೆ:

{ಬಾಕ್ಸ್ ನೆರಳು: ಒಳಭಾಗದ 4px 2px # 9e9e9e 6px;}.

ಇದು ಬ್ಲಾಕ್ ಕೋಡ್ ಸಂಪೂರ್ಣವಾಗಿ ವಿವಿಧ ನಿಯತಾಂಕಗಳನ್ನು ಕೆಲವು ನೆರಳುಗಳು, ಅವರು (ಛಾಯೆಗಳು) ಮಾಡಲಾಗುತ್ತದೆ ಅಲ್ಪವಿರಾಮದಿಂದ ಪಟ್ಟಿ ಪ್ರತ್ಯೇಕಿಸಿ ಇಡಲಾಯಿತು ಸಾಧ್ಯ:

{ಬಾಕ್ಸ್ ನೆರಳು: -20px -10px 11px 15px # 800080, -50px -40px 5px 10px # daa520, 20px 10px 11px 15px # 0700f9, 50px 40px 5px 10px # ffa500}.

ನೆರಳು ಚಿತ್ರಗಳನ್ನು

ಘಟಕಗಳು ಜೊತೆಗೆ ಸೈಟ್ನಲ್ಲಿ ಖಂಡಿತವಾಗಿಯೂ ಚಿತ್ರಗಳು, ಫೋಟೋಗಳು, ಹಿನ್ನೆಲೆ ಇರುತ್ತದೆ - ಈ ಅಂಶಗಳನ್ನು ಎಲ್ಲಾ ಸಹ ಛಾಯಾರೂಪಗಳೊಂದಿಗೆ ಹೆಚ್ಚು ಆಸಕ್ತಿಕರ ನೋಡಲು. ನೀವು ಕ್ಯಾನ್ ಡ್ರಾ ಚಿತ್ರಗಳನ್ನು ದಿ ಪೂರ್ವ ಚಿತ್ರ ಸಂಪಾದಕರು ಮತ್ತು ಪೇಸ್ಟ್ ಅವುಗಳನ್ನು ನಲ್ಲಿ ಪುಟವನ್ನು ಈಗಾಗಲೇ ನೆರಳುಗಳು. ಆದರೆ, ಮೊದಲನೆಯದಾಗಿ, ಇದು ಯಾವಾಗಲೂ ಸಾಧ್ಯವಿದೆ ವಿವಿಧ ಕಾರಣಗಳಿಗಾಗಿ ಏಕೆಂದರೆ ಗ್ರಾಫಿಕ್ಸ್ ಕೆಲಸ ಕೌಶಲಗಳನ್ನು ಕೊರತೆ, ಎರಡನೆಯದು ಚಿತ್ರವನ್ನು ಯಾವುದೇ ಕುಶಲ ಅವನಿಗೆ, ಸೇರಿಸಲಾಗುತ್ತದೆ "ತೂಕ", ಮತ್ತು ಅದಕ್ಕೆ ಚಿತ್ರ ಚೆನ್ನಾಗಿ ಪುಟ ಲೋಡ್ ನಿಧಾನ ಮಾಡಬಹುದು ಸೇರಿದಂತೆ. ಈ ಸಂದರ್ಭದಲ್ಲಿ, ನೀವು ಒಂದು ಸಿಎಸ್ಎಸ್ ನೆರಳು ಚಿತ್ರಗಳನ್ನು ಮಾಡಬಹುದು.

ಈ ಸಮಸ್ಯೆಗೆ ಅತ್ಯಂತ ಸರಳ ಮತ್ತು syntactically ಸರಿಯಾದ ಪರಿಹಾರ - ಘಟಕ ಸೃಷ್ಟಿ, ನಿಮ್ಮ ಚಿತ್ರದಲ್ಲಿ ಹಿನ್ನೆಲೆ Kotormo ಕಾಣಿಸುತ್ತದೆ. ಮುಂದೆ, ನೀವು ಘಟಕಕ್ಕೆ ಅಗತ್ಯ ನೆರಳು ಮಾಡಲು ಮತ್ತು ಅವರು ಹಿನ್ನೆಲೆ ಇಮೇಜ್ ಪ್ರದರ್ಶಿಸಲಾಗಿದೆ:

• .block1 {ಬಾಕ್ಸ್ ನೆರಳು: ಒಳಭಾಗದ 0 0 11px 9px # 9e9e9e; ಅಗಲ: 480px; ಎತ್ತರ: 360px; ಹಿನ್ನೆಲೆ: URL (ಚಿತ್ರಗಳು / charlize_theron_2.jpg) 0 0 ಯಾವುದೇ ಪುನರಾವರ್ತಿಸಲು;}

ಈ ಉದಾಹರಣೆಯಲ್ಲಿ, ನಾವು, ಯಾವುದೇ ಅಕ್ಷಗಳ ಆಫ್ಸೆಟ್ ಒಂದು ಒಳ ನೆರಳು ರಚಿಸಲು ಮಸುಕು ತ್ರಿಜ್ಯ, ವ್ಯಾಖ್ಯಾನಿಸಲಾಗಿದೆ ಬಣ್ಣ, ಎತ್ತರ ಮತ್ತು ಬ್ಲಾಕ್ ಅಗಲ, ಮತ್ತು ಹಿನ್ನೆಲೆ (ಹಿನ್ನೆಲೆ) kuartinku ನೇಮಕ. ಪರಿಣಾಮವಾಗಿ, ನಾವು ಒಳ ನೆರಳು ಚಿತ್ರವನ್ನು ಪಡೆಯಿರಿ.

ಸಿಎಸ್ಎಸ್-ಕೋಡ್ ಬಳಸಿ ನೆರಳುಗಳು ರಚಿಸಲು ಒಪ್ಪುತ್ತೇನೆ - ಇದು ಬಹಳ ಸರಳ, ಇನ್ನೂ ಉತ್ತೇಜನಕಾರಿಯಾಗಿದೆ, ಮತ್ತು - ಉಪಯುಕ್ತ ವ್ಯಾಯಾಮ.