14网页前端CSS——CSS边框属性

一:边框属性

1“;border 复合属性,如果使用该属性定义其单个参数,则其他参数的默认值将无条件覆盖各自对应的单个属性设置。

border:

   宽度      样式    颜色

2:border-color:设置或检索对象的边框颜色

      4个参数值:上 右 下 左

     1个参数值:全部的四边

     2个参数值:第一个:上下,第二个左 右。

     3个参数值:第一个:上,第二个:左 右,第三个:下。

3:border-style:设置或检索对象的边框样式

     4个参数:上 右 下 左

     1个参数:全部的四边’

     2个参数:第一个:上 下,第二个 左 右。

    3个参数:第一个:上,第二个:左 右,第三个 下。

dotted:点状轮廓   dashed:虚线轮廓   solid:实线轮廓  double:双线轮廓

4:border-width:设置或检索对象的边框宽度

      4个参数值:上 右 下 左

     1个参数值:全部的四边

     2个参数值:第一个:上下,第二个左 右。

     3个参数值:第一个:上,第二个:左 右,第三个:下。

5:border-radius:设置或检索对象使用圆角边框。

div{
    width: 200px;
    height: 200px;
    background-color: red;
    border: 5px solid green;   /*线的粗细,线的形状,颜色(乱序 无碍)*/  
    border-color: green yellow blue red;/*上 右 下 左*/
  /*  border-style: dashed;*/
    border-width: 10px 20px 30px 40px;
    border-radius:  
    
}
.ad{
    width: 200px;
    height: 200px;
    background-color: green;
    border: 5px solid red;
   /* border-radius: 50%;当宽高相等时  会变成圆形*/
    border-radius: 10px 20px 30px 40px;
    
}

   

猜你喜欢

转载自blog.csdn.net/weixin_41167340/article/details/81452835
今日推荐