hi,你好!欢迎访问本站!登录
本站由简数采集腾讯云宝塔系统阿里云强势驱动
当前位置:首页 - HTML - 正文 请牢记本站网址www.sosophp.cn

css边框款式有若干种【html5教程】

2019-11-26HTML搜搜PHP网57°c
A+ A-
多样的边框款式,能够雄厚我们网页的界面,进步用户体验。css边框款式,罕见的有实线、虚线、双线、点线等等一些边框款式。

下面我们就给经由过程简朴的代码示例,给人人总结一些罕见的边框款式!

代码以下:

<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
    <title></title>
    <style type="text/css">
        h1{width: 500px;}
        h1.abc {border-style: none;}
        h1.dotted {border-style: dotted;}
        h1.dashed {border-style: dashed;}
        h1.solid {border-style: solid;}
        h1.double {border-style: double;}
        h1.groove {border-style: groove;}
        h1.ridge {border-style: ridge;}
        h1.inset {border-style: inset;}
        h1.outset {border-style: outset;}
        h1.hidden {border-style: hidden;}
    </style>

</head>
<body>
<h1 class="none">无边框</h1>
<h1 class="dotted">点状边框</h1>
<h1 class="dashed">虚线边框</h1>
<h1 class="solid">实线边框</h1>
<h1 class="double">双线边框</h1>
<h1 class="groove">3D 凹槽边框</h1>
<h1 class="ridge">3D 垄状边框</h1>
<h1 class="inset">3D inset 边框</h1>
<h1 class="outset">3D outset 边框</h1>
<h1 class="hidden">隐蔽边框</h1>
</body>
</html>

边框款式以下:

border-style 属性用于设置元素一切边框的款式,或许单独地为各边设置边框款式。

注:只有当这个值不是 none 时边框才能够涌现。

本篇文章就是关于css边框款式的总结款式引见,愿望对须要的朋侪有所协助!

以上就是css边框款式有若干种的细致内容,更多请关注ki4网别的相干文章!

  选择打赏方式
微信赞助

打赏

QQ钱包

打赏

支付宝赞助

打赏

  选择分享方式
  移步手机端
css边框款式有若干种【html5教程】

1、打开你手机的二维码扫描APP
2、扫描左则的二维码
3、点击扫描获得的网址
4、可以在手机端阅读此文章
标签: