CSS3 简介

1.CSS3 概述

  • CSS3 是CSS2 的升级版本,它在CSS2 的基础上,新增了很多强大的新功能,从而解决一些实际 面临的问题。

  • CSS3 在未来会按照模块化的方式去发展: https://www.w3.org/Style/CSS/current-work.html

  • CSS3 的新特性如下:

    • 新增了更加实用的选择器,例如:动态伪类选择器、目标伪类选择器、伪元素选择器等等。
    • 新增了更好的视觉效果,例如:圆角、阴影、渐变等。
    • 新增了丰富的背景效果,例如:支持多个背景图片,同时新增了若干个背景相关的属性。
    • 新增了全新的布局方案 ------ 弹性盒子。
    • 新增了Web字体,可以显示用户电脑上没有安装的字体。
    • 增强了颜色,例如: HSL 、HSLA 、RGBA 几种新的颜色模式,新增opacity 属性来控制透明度。
    • 增加了2D和3D变换,例如:旋转、扭曲、缩放、位移等。
    • 增加动画与过渡效果,让效果的变换更具流线性、平滑性。

2. CSS3私有前缀

查询CSS3兼容性的网站:https://caniuse.com/

  • 常见浏览器私有前缀
    • Chrome 浏览器:-webkit-
    • Safari 浏览器: -webkit-
    • Firefox 浏览器:-moz-
    • Edge 浏览器:-webkit-
    • 旧 Opera 浏览器:-o-
    • 旧 IE 浏览器:-ms-
相关推荐
Jackson__9 分钟前
为了拯救我的腰椎和颈椎,我做了款浏览器插件!
前端·javascript·开源
闲猫14 分钟前
Python FastAPI + SQLAlchemy 入门教程:从零搭建你的第一个 Web 应用
前端·python·fastapi
林小帅38 分钟前
NestJS v11 + Prisma v7 ESM 迁移配置解析
前端·javascript·后端
IT_陈寒1 小时前
React的setState竟然不是立刻生效的,害我调试半天
前端·人工智能·后端
简简单单就是我_hehe1 小时前
前端埋点日志解决方案:完整 User-Agent 解析工具实现,爬虫识别、设备品牌、操作系统、浏览器版本全解析(附完整源码)
前端·爬虫
William_Xu2 小时前
Vue 2 与 Vue 3 生命周期对比
前端
Hilaku2 小时前
为什么你的大文件断点续传,一遇到弱网就崩溃?
前端·javascript·程序员
胡哈3 小时前
React Compiler:让开发者忘掉 memo 这件事
前端·react.js
xiyueyezibile3 小时前
“自迭代” Skill 的 team-pitfalls 的演进
前端·后端·ai编程
林恒smileZAZ3 小时前
`Array(100).map(() => 1)` 为什么全为空?
前端·javascript