CSS border-inline এক্সপ্রেস
- পূর্ববর্তী পৃষ্ঠা border-image-width
- পরবর্তী পৃষ্ঠা border-inline-color
বিবরণ ও ব্যবহার
border-inline
বৈশিষ্ট্য হলো নিচের বৈশিষ্ট্যগুলোর সংক্ষিপ্তণ
যদি রঙ বা প্রস্থবর্ণ এর মান বাদ দেওয়া হয়, তবে ডিফল্ট মান ব্যবহার করা হবে。
CSS-র border-inline
বৈশিষ্ট্য এবং border
এইগুলোর বৈশিষ্ট্য অত্যন্ত সমান কিন্তু border-inline
属性依赖于行内方向。
注意:相关的 CSS 属性 writing-mode
、text-orientation
和 direction
定义了行内方向。这会影响一行的起始和结束位置,以及 border-inline
属性的效果。对于英文页面,行内方向是从左到右,块方向是向下。
实例
例子 1
为行内方向上的不同元素设置边框的样式、颜色和宽度:
h1 { border-inline: 5px solid red; } h2 { border-inline: 4px dotted blue; } div { border-inline: double; }
例子 2:结合 writing-mode 属性
行内方向上起始和结束位置的边框受 writing-mode
属性的影响:
div { writing-mode: vertical-rl; border-inline: hotpink dashed 8px; }
CSS 语法
border-inline: border-inline-width border-inline-style border-inline-color |initial|inherit;
属性值
值 | 描述 |
---|---|
border-inline-width |
指定行内方向上边框的宽度。 默认值为 "medium"。 |
border-inline-style |
指定行内方向上边框的样式。 默认值为 "none"。 |
border-inline-color |
指定行内方向上边框的颜色。 默认值为文本的颜色。 |
initial | 将此属性设置为其默认值。参阅 initial。 |
inherit | 从其父元素继承此属性。参阅 inherit。 |
技术细节
默认值: | medium none color |
---|---|
继承性: | 否 |
动画制作: | yes, see individual properties. Read about animatable |
版本: | CSS3 |
JavaScript 语法: | object.style.borderInline="dashed hotpink 10px" |
浏览器支持
表格中的数字表示首个完全支持该属性的浏览器版本。
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
87.0 | 87.0 | 66.0 | 14.1 | 73.0 |
相关页面
শিক্ষানুযায়ীঃCSS বর্তন
সূত্রঃCSS border এক্সপ্রেস
সূত্রঃCSS border-inline-color এক্সপ্রেস
সূত্রঃCSS border-inline-style প্রতিশব্দ
সূত্রঃCSS border-inline-width প্রতিশব্দ
সূত্রঃCSS ডাইরেকশন এট্রিবিউট
সূত্রঃCSS text-orientation অপারেশন
সূত্রঃCSS writing-mode অপারেশন
- পূর্ববর্তী পৃষ্ঠা border-image-width
- পরবর্তী পৃষ্ঠা border-inline-color