border-images 属性

主要用border-images 属性来制作自适应按钮和tab标签&自适应边框。

例子:

border-images:url("img.png") 0 15 0 15 round;

/*0 15 0 15 指的是:图片边框向内偏移 上0,右15 ,下0 ,左15*/

如图:

上面例子使用的图片为:

向内偏移图例:

属性值

描述  
border-image-source 用在边框的图片的路径。  
border-image-slice 图片边框向内偏移。  
border-image-width 图片边框的宽度。  
border-image-outset 边框图像区域超出边框的量。  
border-image-repeat 图像边框是否应平铺(repeated)、铺满(rounded)或拉伸(stretched)。

CSS边框属性二---border-images的更多相关文章

  1. CSS .css边框属性(border)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. CSS边框属性一---border-radius

    1.CSS outline 属性 outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用. p { outline:#00FF00 dotted thick; } ...

  3. CSS边框属性

    边框 圆角 border-radius border-top-left-radius border-top-right-radius border-bottom-left-radlius border ...

  4. CSS边框-属性详解

    图解CSS padding.margin.border属性 W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层 ...

  5. 第2章 css边框属性

    圆角效果 border-radius border-radius是向元素添加圆角边框. 使用方法: border-radius:10px; /* 所有角都使用半径为10px的圆角 */ border- ...

  6. CSS 边框(border)实例

    CSS 边框(border)实例:元素的边框 (border) 是围绕元素内容和内边距的一条或多条线. CSS border 属性允许你规定元素边框的样式.宽度和颜色. CSS 边框属性属性 描述bo ...

  7. CSS核心属性

    学习目标 1.css浮动属性详解 2.Css文本属性 3.Css列表属性 4.Css背景属性 5.Css边框属性 一.Css浮动属性详解 无论多么复杂的布局,其基本出发点均是:"如何在一行显 ...

  8. css之属性部分

    这篇写的是今天的学习到的属性,一共20个. 属性再多,但也要会使用,会在使用时可以记起它,才能起到它为我们所需要的作用. 样式属性 1.border CSS边框属性允许你指定一个元素边框的样式和颜色. ...

  9. CSS 边框

    CSS 边框属性 CSS边框属性允许你指定一个元素边框的样式和颜色. 边框样式 边框样式属性指定要显示什么样的边界.  border-style属性用来定义边框的样式 border-style 值: ...

随机推荐

  1. NOIP2000 进制转换

    题一   进制转换              (18分)  问题描述      我们可以用这样的方式来表示一个十进制数: 将每个阿拉伯数字乘以一个以该数字所处位置的(值减1)为指数,以10为底数的幂之 ...

  2. 活用maven使web.xml可以用maven变量

    活用maven使web.xml可以用maven变量 废话不多说,直接上代码 <build> <finalName>${finalWarName}</finalName&g ...

  3. Docker系列(一)安装

    操作系统版本:Centos7 Docker版本:1.8 设置安装源 1  cat > /etc/yum.repos.d/docker.repo << -EOF 2  [dockerr ...

  4. sqlplus 连接数据库报错SP2-0642: SQL*Plus internal error state 2130, context 0:0:0

    sqlplus 连接数据库报错SP2-0642: SQL*Plus internal error state 2130, context 0:0:0 问题描述: 使用sqlplus客户端登录数据库,报 ...

  5. 10409 - Die Game

    Problem G: Die Game Life is not easy. Sometimes it is beyond your control. Now, as contestants of AC ...

  6. eclipse加入git工具

    想必如今搞互联网编程的人没有人没有听过编程协作工具git了吧,命令行以下操作很方便.功能也很的强大. 可是对于java编程的人员,eclipse肯定是他们编程的神器(肯定是首选), 那么怎样在ecli ...

  7. Hadoop与分布式开发

        hadoop上的并行应用程序开发是基于MapReduce编程框架的,MapReduce编程模型的原理是:利用一个输入的key/value对集合来产生一个输出的key/value对集合. Map ...

  8. iOS开发多线程篇---atomic nonatomic区别

    摘要 atomic和nonatomic区别用来决定编译器生成的getter和setter是否为原子操 作.atomic提供多线程安全,是描述该变量是否支持多线程的同步访问,如果选择了atomic 那么 ...

  9. 监控mysql索引使用效率的脚本

      SELECT  t.table_schema AS db,  t.table_name   AS tab_name,  s.index_name   AS index_name,  s.colum ...

  10. binutil 工具-----C分析工工具

    binutils-- a tools set * ld - the GNU linker. * as - the GNU assembler. * addr2line - Converts addre ...