如何在css中定义边框样式

  介绍

这篇文章将为大家详细讲解有关如何在css中定义边框样式,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

css是什么意思

css是一种用来表现HTML或XML等文件样式的计算机语言,主要是用来设计网页的样式,使网页更加美化。它也是一种定义样式结构如字体,颜色,位置等的语言,并且css样式可以直接存储于HTML网页或者单独的样式单文件中,而样式规则的优先级由css根据这个层次结构决定,从而实现级联效果,发展至今,css不仅能装饰网页,也可以配合各种脚本对于网页进行格式化。

操作环境:windows10系统,css 3, thinkpad t480电脑。

在css中,如果我们要设置边框的样式,那么我们可以借助于边框样式属性.border-style属性用于设置一个元素的四个边框的样式。此属性可以有一到四个值。

常用属性值如下:

<李>

点缀,,定义点状边框。在大多数浏览器中呈现为实线。

<李>

破灭,,定义虚线。在大多数浏览器中呈现为实线。

<李>

固体,,定义实线。

<李>

双,,定义双线。双线的宽度等于边框宽度的值。

具体示例:

& lt; ! DOCTYPE  html>   & lt; html>   & lt; head>   & lt; meta  charset=皍tf-8"祝辞,   & lt; title> php.cn,   & lt; style>   p.none {边框样式:没有;}   p.dotted {边框样式:虚线;}   p.dashed {边框样式:破灭;}   p.solid {边框样式:固体;}   p.double {边框样式:双;}   p.groove {边框样式:槽;}   p.ridge {边框样式:脊;}   p.inset {边框样式:插图;}   p.outset {边框样式:开始;}   p.hidden {边框样式:隐藏;}   & lt;/style>   & lt;/head>      & lt; body>   & lt; p 类=皀one"祝辞无边框。;/p>   & lt; p 类=癲otted"祝辞虚线边框。;/p>   & lt; p 类=癲ashed"祝辞虚线边框。;/p>   & lt; p 类=皊olid"祝辞实线边框。;/p>   & lt; p 类=癲ouble"祝辞双边框。;/p>   & lt; p 类=癵roove"祝辞,凹槽边框。;/p>   & lt; p 类=皉idge"祝辞垄状边框。;/p>   & lt; p 类=癷nset"祝辞嵌入边框。;/p>   & lt; p 类=皁utset"祝辞外凸边框。;/p>   & lt; p 类=癶idden"祝辞隐藏边框。;/p>   & lt;/body>      & lt;/html>

运行结果:

如何在css中定义边框样式

关于如何在css中定义边框样式就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看的到。

如何在css中定义边框样式