CSS border 属性

最近写网页,用到了border属性
了解的不是很多,就整理了一下

border属性就是边框属性

实例

p{
	border:5px soild #000 ;
}

分三个点:

  1. border-width 指定边框的宽度
  2. boder-style 指定边框的样式
  3. border-color 指定边框的颜色
    还有从父级元素继承过来的inherit

border-width

可以设置一到四个值
一个值:代表所有的边框;
两个值:第一个代表上下边框,第二个代表左右边框;
三个值:第一个上边框,第二个值是左右边框,第三个值是下边框;
四个值:上 右 下 左

属性值
  • thin:定义细的边框
  • medium:默认,定义中等的边框
  • thick:定义粗的边框
  • length:允许你自定义边框的宽度
  • inherit:规定应该从父级元素继承边框宽度

border-style

border-style属性设置一个元素的四个边框的样式。此属性可以有一到四个值

一个值:代表所有的边框;
两个值:第一个代表上下边框,第二个代表左右边框;
三个值:第一个上边框,第二个值是左右边框,第三个值是下边框;
四个值:上 右 下 左

属性值
  • soild:实线
  • dotted:点状
  • double:双线
  • dashed:虚线
  • none:定义无边框
  • hidden:于none相同,应用表时除外,对于表,hidden用于解决边框冲突

border-color

border-color属性设置一个元素的四个边框颜色。此属性可以有一到四个值。

一个值:代表所有的边框;
两个值:第一个代表上下边框,第二个代表左右边框;
三个值:第一个上边框,第二个值是左右边框,第三个值是下边框;
四个值:上 右 下 左

注意请始终把 border-style 属性声明到 border-color 属性之前。元素必须在您改变其颜色之前获得边框。

属性
  • color :在CSS颜色值查找颜色值的完整列表
  • transparent:边框颜色透明,这是默认值
  • inherit:从父级元素继承
发布了10 篇原创文章 · 获赞 12 · 访问量 835

猜你喜欢

转载自blog.csdn.net/kangzinian/article/details/100134669
今日推荐