border使用

border属性 border-width  border-style  border-color  inherit

border-style的值：none  dotted（点线）  dashed（虚线）  solid（实线） double（双线）  groove（凹槽）  ridge（凸起）  inset outset   inherit

div {
    border: 1px solid #ff0000;
}
div {
    border-bottom: 1px solid #ff0000;
}

 

CSS3新增的有border-radius  box-shadow  border-image

border-radius可以用em、px、%来指定圆角大小  也可以四个角单独指定

div {
    border-radius: 50%;
}
div {
    border-top-left-radius:2em;
    border-top-right-radius:2em;
    border-bottom-right-radius:2em;
    border-bottom-left-radius:2em;
}

box-shadow  水平阴影  垂直阴影  阴影长度  阴影颜色

div {
    box-shadow: 10px 10px 5px #ff0000;
}

border-image 请参阅 http://www.w3school.com.cn/tiy/t.asp?f=css3_border-image

转载于:https://www.cnblogs.com/webyun/p/8392360.html