图像边框 border-image
使用方法：border-image:url('图像路径') 边距（不能带单位）/宽度 上下方式 左右方式；（四个边距，上右下左，相同时可缩写为一个）
repeat平铺 stretch拉伸  round

<style type="text/css">

		.div1{

			display: inline-block;

			margin-right: 30px;

			background: #000;

			width: 389px;

			height: 389px;

			border-style: solid;

			border-width: 100px;  /*设置边框宽度之前要先设置边框样式，不然不会显示的，这是在content外添加空间*/

			border-image:url("images/3.jpg") 100 repeat;

		}

		.div2{

			display: inline-block;

			background: darkred;

			width: 389px;

			height: 389px;

			/*直接在border-image中设置border宽度,这样实际上是占用了content的区域空间*/

			border-image:url("images/3.jpg") 100/100px repeat;

		}

	</style>

</head>

<body>

<div class="div1">CSS3新增的background-clip属性</div>

<div class="div2">CSS3新增的background-clip属性</div>

</body>

border-image用法详解的更多相关文章

  1. window.onload用法详解:

    网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行,否则可能导致无法获取对象的情况,为了避免这种情况的发生,可以使用以下两种方式: 一.将脚本代码放在网页的底端,这样在运行脚本代 ...

  2. Extjs Window用法详解 3 打印具体应用，是否关掉打印预览的界面

    Extjs Window用法详解 3 打印具体应用,是否关掉打印预览的界面   Extjs 中的按钮元素 {xtype: 'buttongroup',title: '打印',items: [me.ts ...

  3. C#中string.format用法详解

    C#中string.format用法详解 本文实例总结了C#中string.format用法.分享给大家供大家参考.具体分析如下: String.Format 方法的几种定义: String.Form ...

  4. @RequestMapping 用法详解之地址映射

    @RequestMapping 用法详解之地址映射 引言: 前段时间项目中用到了RESTful模式来开发程序,但是当用POST.PUT模式提交数据时,发现服务器端接受不到提交的数据(服务器端参数绑定没 ...

  5. linux管道命令grep命令参数及用法详解---附使用案例|grep

    功能说明:查找文件里符合条件的字符串. 语 法:grep [-abcEFGhHilLnqrsvVwxy][-A<显示列数>][-B<显示列数>][-C<显示列数>] ...

  6. mysql中event的用法详解

    一.基本概念mysql5.1版本开始引进event概念.event既“时间触发器”,与triggers的事件触发不同,event类似与linux crontab计划任务,用于时间触发.通过单独或调用存 ...

  7. CSS中伪类及伪元素用法详解

    CSS中伪类及伪元素用法详解   伪类的分类及作用: 注:该表引自W3School教程 伪元素的分类及作用: 接下来让博主通过一些生动的实例(之前的作业或小作品)来说明几种常用伪类的用法和效果,其他的 ...

  8. c++中vector的用法详解

    c++中vector的用法详解 vector(向量): C++中的一种数据结构,确切的说是一个类.它相当于一个动态的数组,当程序员无法知道自己需要的数组的规模多大时,用其来解决问题可以达到最大节约空间 ...

  9. AngularJS select中ngOptions用法详解

    AngularJS select中ngOptions用法详解   一.用法 ngOption针对不同类型的数据源有不同的用法,主要体现在数组和对象上. 数组: label for value in a ...

  10. systemctl命令用法详解

    systemctl命令用法详解系统环境:Fedora 16binpath:/bin/systemctlpackage:systemd-units systemctl enable httpd.serv ...

随机推荐

  1. 5.For loops

    for 循环语句   在需要重复执行代码的时候,for循环常常被用到.我们可以让一行代码执行10次:   for i in range(1,11): print(i)   最后一个数字11是不包含在内 ...

  2. 什么时候可以用delete替代delete[]

    针对gcc编译器 C++内存分配和释放函数 //分配单个对象 operator new(std::size_t size) //分配数组对象 operator new[](std::size_t si ...

  3. 垃圾回收（GC） 的基本算法

    GC 作为一个长久的话题,从诞生[1]至今也算是经历了六七十年了,对于很多习惯于使用 Java/Python 的同学来说,对于内存的管理可能会稍微更陌生一些,因为这些语言在语言层面就屏蔽了内存的分配和 ...

  4. ResourceBundleViewResolver

    1 springmvc中ResourceBundleViewResolver解析器的使用1.1 springmvc.xml的配置因为我配置了多个解析器,所以额外的加了order属性,value值越低, ...

  5. uImage和zImage的区别

    1.各种文件的意义 vmlinux  编译出来的最原始的内核文件,未压缩. zImage   是vmlinux经过gzip压缩后的文件. bzImage bz表示“big zImage”,不是用bzi ...

  6. 云计算之路-阿里云上：docker swarm 集群故障与异常

    在上次遭遇 docker swarm 集群故障后,我们将 docker 由 17.10.0-ce 升级为最新稳定版 docker 17.12.0-ce . 前天晚上22:00之后集群中的2个节点突然出 ...

  7. python2与python3的区别 ，小数据池 bytes 类型

    一.python2和3的区别 在python3中 在python2中 print('ab')方式打印内容()括号是必须要有的.   print 'ab' 可以加可以不加. 只有range   有ran ...

  8. 关于maven项install时报找不到符号的错误

    解决办法: 聚合工程: 1.eclipse中执行project -->clean,将项目清理一下: 2.选中聚和工程右键-->Run As-->Maven builed...--&g ...

  9. POJ3041-Asteroids-匈牙利算法

    Asteroids Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 23963   Accepted: 12989 Descr ...

  10. Django App(三) View+Template

    接着上一节(二)的内容,首先启动站点,通过界面添加Question和Choice两张表的数据,因为接下来,要向polls app里面添加views. 1.添加数据如下(这里是通过界面操作添加的数据) ...