CSS బొర్డర్-ఇమేజ్-సైల్ అట్రిబ్యూట్
- పూర్వ పేజీ border-image-repeat
- తదుపరి పేజీ border-image-source
నిర్వచనం మరియు వినియోగం
border-image-slice అంశం చిత్ర సరిహద్దు లోపలి సరిహద్దును నిర్వచిస్తుంది.
మరింత చూడండి:
CSS3 శిక్షణా పత్రికCSS3 బార్డర్
ఉదాహరణ
చిత్ర సరిహద్దు లోపలి సరిహద్దును నిర్వచించండి:
div { border-image-source: url(border.png); border-image-slice: 50% 50%; }
CSS సంకేతాలు
border-image-slice: number|%|fill;
పేర్కొన్న ప్రత్యామ్నాయం:ఈ అంశం చిత్రం పై, కుడి, క్రింద, ఎడమ సరిహద్దు లోని లోపలి సరిహద్దు సరిహద్దును నిర్వచిస్తుంది. చిత్రం తొమ్మిది ప్రాంతాలుగా విభజించబడుతుంది: నాలుగు మూలలు, నాలుగు సరిహద్దులు మరియు ఒక మధ్య ప్రాంతం. ఫిల్ పదం ఉపయోగించకపోతే మధ్య చిత్ర భాగం తొలగించబడుతుంది. నాలుగవ విలువను పసిగట్టకుండా ఉంటే రెండవ విలువతో అదే విలువ ఉంటుంది. మూడవ విలువను పసిగట్టకుండా ఉంటే మొదటి విలువతో అదే విలువ ఉంటుంది. రెండవ విలువను పసిగట్టకుండా ఉంటే మొదటి విలువతో అదే విలువ ఉంటుంది.
అంశం విలువ
విలువ | వివరణ |
---|---|
number | సంఖ్యాకరణం, చిత్రంలోని పిక్సెల్స్ (రాగ్రాఫ్ చిత్రంలో ఉంటే) లేదా వెక్టర్ కోఆర్డినేట్స్ (వెక్టర్ చిత్రంలో ఉంటే). |
% | చిత్ర పరిమాణానికి సంబంధించిన శాతములు: చిత్ర వెడల్పు అడుగున ప్రసారం ప్రభావితం చేస్తుంది, అడుగున ప్రభావితం చేస్తుంది. |
fill | కింది సరిహద్దు చిత్రాన్ని ఉంచుకోండి. |
సాంకేతిక వివరాలు
అప్రమేయ విలువ: | 100% |
---|---|
పారంపర్యం: | no |
వెర్షన్: | CSS3 |
JavaScript సంకేతాలు: | object.style.borderImageSlice="50% 50%" |
బ్రౌజర్ మద్దతు
పట్టికలోని సంఖ్యలు ఈ అంశాన్ని పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ వెర్షన్ ను పేర్కొంది.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
చూడండి border-image అంశం。
- పూర్వ పేజీ border-image-repeat
- తదుపరి పేజీ border-image-source