css3有哪些新特性?(包含哪些模块)

css3有哪些新特性?包含哪些模块?以下是整理的21个css3新特性:

1.新增选择器

p:nth-child(n){color: rgba(255, 0, 0, 0.75)}

2.新增伪元素

::before 和 ::after

3.弹性盒模型

display: flex;

4.多列布局

column-count: 5;

5.媒体查询

@media (max-width: 480px) {.box: {column-count: 1;}}

6.个性化字体

@font-face{font-family: BorderWeb; src:url(BORDERW0.eot);}

7.颜色透明度

color: rgba(255, 0, 0, 0.75);

8.圆角

border-radius: 5px;

9.渐变

background:linear-gradient(red, green, blue);

10.阴影

box-shadow:3px 3px 3px rgba(0, 64, 128, 0.3);

11.倒影

box-reflect: below 2px;

12.文字装饰

text-stroke-color: red;

13.文字溢出

text-overflow:ellipsis;

14.背景效果

background-size: 100px 100px;

15.边框效果

border-image:url(bt_blue.png) 0 10;

16.旋转

transform: rotate(20deg);

17.倾斜

transform: skew(150deg, -10deg);

18.位移

transform: translate(20px, 20px);

19.缩放

transform: scale(.5);

20.平滑过渡

transition: all .3s ease-in .1s;

21.动画

@keyframes anim-1 {50% {border-radius: 50%;}} animation: anim-1 1s;

相关推荐
tao3556679 小时前
【用AI学前端】准备工作
前端·人工智能
利刃大大10 小时前
【Vue】自定义指令directives && 指令钩子 && IntersectionObserver
前端·javascript·vue.js
共享家952716 小时前
搭建 AI 聊天机器人:”我的人生我做主“
前端·javascript·css·python·pycharm·html·状态模式
Halo_tjn17 小时前
基于封装的专项 知识点
java·前端·python·算法
m0_7482299920 小时前
Vue2 vs Vue3:核心差异全解析
前端·javascript·vue.js
C澒20 小时前
前端监控系统的最佳实践
前端·安全·运维开发
xiaoxue..20 小时前
React 手写实现的 KeepAlive 组件
前端·javascript·react.js·面试
hhy_smile20 小时前
Class in Python
java·前端·python
小邓吖21 小时前
自己做了一个工具网站
前端·分布式·后端·中间件·架构·golang
南风知我意95721 小时前
【前端面试2】基础面试(杂项)
前端·面试·职场和发展