.border-thin { border-style: solid; border-width: 1px; } 运行效果: border-width 属性的可选值如下: 值 描述 thin 定义较细的边框 medium 默认值,定义中等宽度的边框 thick 定义较粗的边框 length 使用数值加单位的形式设置具体的边框宽度,例如 2px inherit 从父元素继承边框的宽度 3. 边框颜色border-col...
.thin-border{ border-width: thin; } .medium-border{ border-width: medium; } .thick-border{ border-width: thick; } 10px Border Width 10% Border Width Thin Border Medium Border Thick Border 效果如下: 如果设计稿给的四个边的边框宽度都不一样,怎么办?那就需要自定义这个写法啦。 统一按...
border=thin设置与border-thin none相同;如果最初未设置边框颜色,则其默认值与文本颜色相同。因此,此属性不仅将 width 设置为thin,而且还清除以前设置的任何样式或颜色值。 如果未指定颜色,则使用文本颜色。 示例 下面的示例使用border属性指定复合边框属性。此示例通过调用内嵌(全局)样式表来修改border属性: ...
CSS:border边框的巧用 边框,是项目中最常用的属性之一,我们写过的最多的应该是border: 1px solid xxx了吧。那么,我们有没有想过它的出现不止存在于此呢? 下面我们就来讨论一下,一些不常用却很有用的特性。 border-width 先来认识一下border-width,除了数值之外的几个关键词: thin:对应数值1px。 medium(默认...
上面的示例中,给一段文字加了不同的边框,只是为了说明边框线的颜色、粗细是可变的。第一个边框的CSS代码是:style="border:thin solid red";“border”后面的三个参数的含义是:边框线的宽度是:thin(细线);边框线的类型:solid(实线);边框线的颜色:red(红色)。我们定义边框,实际上就是设定这三个参数值。
如果不设置其中的某个值,也不会出问题,例如 border: solid red; 也是允许的。 border-width 可设置的值有 : thin ( 细边框 ) , medium ( 默认,中等边框 ) , thick ( 粗边框 )length (允许自定义边框宽度 ) 规则为: border-width: 上右下 左或border-width: 上 左右 下或border-width: 上下 左右或...
1. border-width（边框宽度）边框宽度定义了边框的粗细。这个值可以是具体的长度单位（如 px、em、rem、% 等），或者是相对单位（如 thin、medium、thick）。不过，在实际应用中，具体长度单位更为常用。例如：css复制代码 2. border-style（边框样式）边框样式定义了边框的外观。常见的边框样式有 solid（实线）、...
除了指定具体的边框宽度值,也可以使用这三个关键词:thin,medium和thick。 虽然乍看起来单个属性的方式没必要,但有极少数的情况下,当它是有利的,例如当你需要在特定的事件发生时更新边的部分属性。 也许你需要在用户将鼠标悬停在一个特定的元素上时改变这个元素的边框颜色。使用复合属性需要重复像素值和边的样式。
其中,border-width用于设置边框的宽度,border-style用于设置边框的样式,border-color用于设置边框的颜色。这三个属性值可以单独设置,也可以组合在一起设置。 1.1 border-width属性值 border-width属性用于设置边框的宽度,可以接受的属性值有以下几种: - thin:细边框 - medium:中等边框 - thick:粗边框 -具体像素值:...
- thin:设定为0.5px,一般在移动端等小屏幕的场合下使用; - medium:设定为1px,是浏览器默认值; - thick:设定为2px,较为粗细。 6. Border-color属性取值 Border-color属性是边框颜色的属性之一,其具体取值包括: - 十六进制颜色值:如“#000000”表示黑色; - 预定义颜色名:如green表示绿色; - RGB颜色值:如“...