css3 border-image-source属性笔记

原创 PHP笔记  2017-11-26 17:37  阅读 1,128 views 次

定义及用法

在php中,border-image-source属性是用来指定边框要使用的图像,如果值设置为"none"或者图像无法显示,边框样式会被使用。

语法格式:

border-image-source: url('图像地址') / none;

实例:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>css3 border-image-source属性笔记</title>
<style>
.source{background-color:#6ee;border: 30px solid transparent;
border-image-source: url('https://www.ggbiji.com/wp-content/uploads/2017/11/border-image.png');
border-image-repeat: repeat;border-image-slice:30;}
</style>
<head/>
<body>
<div class="source">
css3 border-image-source属性演示!
</div>
<p>图片原型:</p>
<img src="https://www.ggbiji.com/wp-content/uploads/2017/11/border-image.png">
</body>
</html>

运行结果:

css3 border-image-source属性笔记

相关属性——>css3 border-image边框图片属性笔记(可以使用border-image属性来设置所有 的border-image-*属性)

更多css属性——>css属性大全

本文地址:https://www.ggbiji.com/border-image-source.html
版权声明:本文为 PHP笔记 原创/整理文章,欢迎分享,转载请注明出处!

发表评论


表情