[分享]css3实用方法总结推荐

CSS3是前端开发中经常会用到的技术，它可以用于美化页面、布局、动画等方面。下面将介绍几种常用的CSS3方法。1. borderradius 圆角 borderradius: 10px; 这个属性可以...

CSS3是前端开发中经常会用到的技术，它可以用于美化页面、布局、动画等方面。下面将介绍几种常用的CSS3方法。

1. border-radius 圆角

 border-radius: 10px; 

这个属性可以为元素的边框添加圆角，也可以为每个角设置不同的半径。在实际开发中，我们可以用它来实现圆形头像、圆角按钮等效果。

2. box-shadow 盒子阴影

 box-shadow: 3px 3px 5px #666; 

这个属性可以为元素添加阴影效果，并可以设置阴影的偏移量、模糊度、颜色等参数。在实际开发中，我们可以用它来为各种元素添加立体感、深度感等效果。

3. transform 变换

 transform: rotate(45deg); 

这个属性可以实现元素的旋转、缩放、移动等功能。在实际开发中，我们可以用它来实现3D效果、图片翻转等效果。

4. transition 过渡

 transition: all 0.5s ease; 

这个属性可以实现元素属性的平滑过渡，常用于实现鼠标悬停效果、页面切换效果等。在实际开发中，我们需要注意设置过渡时间和过渡曲线，以达到最佳效果。

5. @media 媒体查询

 @media (max-width: 768px) {
        /* 在窗口宽度小于等于768px时应用的样式 */
    } 

这个属性可以根据设备的宽度、高度、分辨率等参数来动态调整样式表的呈现。在实际开发中，我们可以用它来实现响应式布局，即根据设备类型和尺寸自适应地展示页面。