css3中<basic-shape>如何使用
这篇文章主要介绍了css3中
公司主营业务:成都网站设计、网站建设、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。成都创新互联是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。成都创新互联推出通化县免费做网站回馈大家。
一、
1、
然后将基本形状作为值传递给属性(如shape-outside属性或clip-path属性),这些属性用于将形状应用于元素以更改其周围的内容流,或将元素剪切到分别定义形状。
2、形状的参考框
除了元素的高度和宽度之外,元素的框模型框:边距框(margin-box),内容框(content-box),填充框(padding-box)和边框(border-box),也可用作参考来指定元素上的形状范围。参考框可以是四个框中的任何一个。
当把
二、基本形状函数
以下为当前
1、inset()
语法:
inset({1,4} [round ] )
说明:
inset()函数定义了一个插入矩形。
它需要1~4个偏移值,它们指向内部参考框边缘(上,右,下与左边界和顶点)的偏移量。这些指定了插入矩形在元素内的位置。
可选参数
2、circle()
circle( []? [at ]? )
circle()函数定义了一个插入圆
3、ellipse()
ellipse( [{2}]? [at ]? )
ellipse()函数定义了一个椭圆;
4、polygon()
polygon( [,]? [ ]# )
= |
polygon()函数定义了一个多边形
三、基本形状说明
基本形状的计算值
基本形状函数中的值按指定计算,但有例外,如:
1、包含省略的值并计算其默认值。
2、一个
3、一
形状的引用框被定义为将这些形状作为值的属性的一部分。
基本形状的插值(形状之间的动画)
对于在一个基本形状和第二个基本形状之间进行插值,将应用以下规则。shape函数中的值作为简单列表插入。列表值在可能的情况下插入为长度,百分比或计算。如果列表值不是这些类型之一但是相同(例如nonzero在两个列表中找到相同的列表位置),那么这些值会进行插值。
1、两种形状必须使用相同的参考框。
2、如果两个形状都是相同的类型,那个类型是ellipse()或者circle(),并且没有一个半径使用closest-side或farthest-side关键字,则在形状函数中的每个值之间进行插值。
3、如果两个形状都是类型inset(),则在形状函数中的每个值之间进行插值。
4、如果两个形状都是类型polygon(),则两个多边形具有相同数量的顶点,并且使用相同
5、在所有其他情况下,未指定插值。
四、浏览器兼容性
感谢你能够认真阅读完这篇文章,希望小编分享css3中
当前文章:css3中<basic-shape>如何使用
当前路径:http://myzitong.com/article/ppopog.html