html是通过css样式border-style、border-width、border-color等属性来设置边框样式，具体实现代码如下：
1、设置html基本边框样式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#rcorners1 {
border-style: solid;
width: 200px;
}
#rcorners2 {
border-style: dashed;
width: 200px;
}
#rcorners3 {
border-style: inset;
width: 200px;
}
#rcorners4 {
border-style: dotted dashed solid double;
width: 200px;
}
</style>
</head>
<body>
<div style="margin-left: 50px">
<h1>border-radius 属性</h1>
<p>设置实线边框：</p>
<p id="rcorners1">Rounded corners!</p>
<p>设置虚线边框：</p>
<p id="rcorners2">Rounded corners!</p>
<p>设置3D边框：</p>
<p id="rcorners3">Rounded corners!</p>
<p>设置混合边框：</p>
<p id="rcorners4">Rounded corners!</p>
</div>
</body>
</html>代码释义：
border-style：设置的是边框样式，取值有如下：
dotted– 定义点线边框dashed– 定义虚线边框solid– 定义实线边框double– 定义双边框groove– 定义 3D 坡口边框。效果取决于 border-color 值ridge– 定义 3D 脊线边框。效果取决于 border-color 值inset– 定义 3D inset 边框。效果取决于 border-color 值outset– 定义 3D outset 边框。效果取决于 border-color 值none– 定义无边框hidden– 定义隐藏边框
而且还可以同时设置四个值，比如：border-style: dotted dashed solid double; 那么这里分别对应的是 上边框、右边框、下边框和左边框
2、html设置边框宽度
只需要在css样式中添加属性border-width:2px，表示设置边框宽度为2px。border-width同样也可以设置四个值，例如：border-width: 25px 10px 4px 35px; 分别表示上边框 25px，右边框 10px，下边框 4px，左边框 35px；
3、html设置边框颜色
border-color属性是用来设置边框颜色的，例如：border-color: red; 表示设置边框颜色为红色。比较神奇的是，border-color属性同样也可以设置四个值，例如：border-color: red green blue yellow;分别表示上红、右绿、下蓝、左黄。
2、3的代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#rcorners1 {
border-style: solid;
width: 200px;
border-width:5px
}
#rcorners2 {
border-style: dashed;
border-width: 5px 11px 8px 12px;
width: 200px;
height: 60px;
}
#rcorners3 {
border-style: inset;
width: 200px;
border-color: red;
}
#rcorners4 {
border-style: dotted dashed solid double;
width: 200px;
border-color: red green blue yellow;
}
</style>
</head>
<body>
<div style="margin-left: 50px">
<h1>border-radius 属性</h1>
<p>设置大小5px的实线边框：</p>
<p id="rcorners1">Rounded corners!</p>
<p>设置不同边框宽度的虚线边框：</p>
<p id="rcorners2">Rounded corners!</p>
<p>设置红色的3D边框：</p>
<p id="rcorners3">Rounded corners!</p>
<p>设置混合颜色的混合边框：</p>
<p id="rcorners4">Rounded corners!</p>
</div>
</body>
</html>这里的颜色值可以参考：https://www.itshiye.com/07/333.html，这里会详细讲解html的颜色是如何设置的。
正文完