不考虑兼容,可以使用transform:scale(.5,.5)样式,就是把元素缩小0.5倍。例子如下:
.content{position:relative
}
.content:before{
content: ''
position: absolute
width: 200%
height: 1px
bottom: 0
border-bottom: 1px solid #d6e4ed
-webkit-transform-origin: 0 0
transform-origin: 0 0
-webkit-transform: scale(.5,.5)
transform: scale(.5,.5)
-webkit-box-sizing: border-box
box-sizing: border-box
}
大致原理是:通过CSS3插入一个伪元素,该元素宽度为父级2倍,高度为1px,然后通过css3缩放将其缩小一倍,从未实现一个0.5px的边框。
CSS设置div边框颜色宽度和高度步骤如下:
1、新建一个html文件,创建一个类名为wrap的div。
2、先通过css类选择器选择到div来控制div的宽度和高度和背景颜色(没有边框时方便看出来div的大小)。
3、通过div 的border属性控制边框颜色,设置border的宽度为2px,线型为实线,颜色为蓝色。
4、这样就可以设置div边框颜色宽度和高度,如下图:
扩展资料:
css border属性:
border 简写属性在一个声明设置所有的边框属性。
可以按顺序设置如下属性:
border-width,border-style,border-color
如果不设置其中的某个值,也不会出问题,比如 border:solid #ff0000也是允许的。