千家信息网

css怎么设置边框样式

发表于:2025-01-18 作者:千家信息网编辑
千家信息网最后更新 2025年01月18日,这篇文章主要为大家展示了"css怎么设置边框样式",内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下"css怎么设置边框样式"这篇文章吧。一:border边框线的
千家信息网最后更新 2025年01月18日css怎么设置边框样式

这篇文章主要为大家展示了"css怎么设置边框样式",内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下"css怎么设置边框样式"这篇文章吧。

  一:border边框线的基本样式

  边框样式属性指定要显示什么样的边界

  1.border-style属性

  none:默认无边框

  dotted:定义一个点线边框

  dashed:定义一个虚线边框

  solid:定义实线边框

  double:定义两个边框。两个边框的宽度和border-width的值相同

  groove:定义3D沟槽边框。效果取决于边框的颜色值

  ridge:定义3D脊边框。效果取决于边框的颜色值

  inset:定义一个3D的嵌入边框。效果取决于边框的颜色值

  outset:定义一个3D突出边框。效果取决于边框的颜色值

  

  

  

  

  border-style属性

  

  

  

  

  无边框。

  虚线边框。

  虚线边框。

  实线边框。

  双边框。

  凹槽边框。

  垄状边框。

  嵌入边框。

  外凸边框。

  隐藏边框。

  

  

  效果图:

  1.jpg

  上例是同时设置上、下、左、右四面的边框,也可以单独设置一面的边框:border-top-style(上边框),border-bottom-style(下边框),border-left-style(左边框),border-right-style(右边框).

  2.border-width属性

  设置边框宽度,为边框指定宽度有两种方法:可以指定长度值,比如2px或0.1em(单位为px,pt,cm,em等),或者使用3个关键字之一,它们分别是thick、medium(默认值)和thin。

  

  

  

  

  border-width属性

  

  

  

  

  一些文本。

  一些文本。

  一些文本。

  

  



以上是"css怎么设置边框样式"这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!

0