css3新增属性

    css3新增效果有:

1.边框属性:

 border-radius:圆角边框

/*设置4个角依次未左上,右上,右下,左下*/
border-radius:25% 25% 25% 25%;
/*设置所有角*/
border-radius:50%;

border-image:图片边框

border-image: url(./img/logo.png);

box-shadow:盒子阴影

 box-shadow: 1px 1px 1px 1px ;

boder-color:边框颜色

 border-color: red;

2.文本属性

text-shadow:文本阴影

text-shadow: 5px 5px 5px  green;

word-wrap:自动换行

 word-wrap:break-word;

3.背景属性

background-size:背景图片大小

background-size: 100%;
background-size: 100px 100px;

background-origin :属性规定背景图片的定位区域。背景图片可以放置于 content-box、padding-box 或 border-box 区域

4.rgba和透明度

background-color: rgba(red, green, blue, alpha);

alpha代表透明度

background-color: rgba(red, green, blue, alpha);

5.新增动画效果

1.transform变换效果:

它可以将元素实现旋转、缩放和平移的功能。

属性值:(1)transform ;(2)transform-origin:transform-origin 属性可以设置变换的起点。默认情况下,使用元素的中心作为起点

2、animation动画效果

animation 实现动画效果主要由两个部分组成:
1、通过类似 Flash 动画中的关键帧声明一个动画;
2、在 animation 属性中调用关键帧声明的动画。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值