首页 > 其他 > 详细

6月23号=》201页-205页

时间:2014-06-24 14:00:12      阅读:300      评论:0      收藏:0      [点我收藏+]

8.2.3  CSS3提供的图片边框

    CSS3为图片边框提供了如下属性。

    border-image:该属性的值比较复杂,应该遵守如下格式:

      <border-image-source>  <border-image-slice>[/<border-image-width>]?  <border-image-repeat>

    上面语法格式可以分为4个部分:

      border-image-source:指定边框图片。该值可以是none(没有边框图片)或使用url()函数指定图片。

      border-image-slice:该属性可以指定1~4个数值或百分比数值,这4个数值用于控制如何对图片进行切割。

                  假设指定了10 20 30 40,这4个数值分别指定切割边框图片时上边框为10像素,右边框

                  为20像素,下边框为30像素,左边框为40像素。如果只指定了一个值,那么4个边框的宽度都等于该值。

      border-image-width:该属性用于指定图片边框的宽度。该属性值可指定1~4个长度值、数值、百分比值或auto。

      border-image-repeat:该属性用于指定边框图片的覆盖方式,支持stretch(拉伸覆盖)、repeat(平铺覆盖)、round(取整平铺)三种

                  覆盖方式。该属性可指定两个值,分别代表横向、纵向覆盖方式。

      代码示范:

        //为该div指定图片边框,且边框宽度为27px

        div{

          border-image:url(图片路径) 27;

        }

 

        //为该div指定图片边框,且指定边框宽27px,默认是拉伸边框图片

        div{

          border-image:url(图片路径) 27/27px;

        }

 

8.3  补丁相关属性

  8.3.1  内补丁相关属性

      内补丁相关属性有如下几个。

        padding:该属性可以同时设置上、下、左、右4个边的内补丁距离。如果只为该属性设置了一个长度,则该值将作为

              上、下、左、右4个边的内补丁距离。

        padding-top:设置上边的内补丁距离。

        padding-right:设置右边的内补丁距离。

        padding-bottoom:设置下边的内补丁距离。

        padding-left:设置左边的内补丁距离。

6月23号=》201页-205页,布布扣,bubuko.com

6月23号=》201页-205页

原文:http://www.cnblogs.com/duzuoyan/p/3804884.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!