1、圆角边框定义圆角边框后,可以将盒子定义为圆角的(1)长度方式盒子模型外边距
          div{
              width: 200px;
              height: 100px;
              background-color: yellowgreen;
              border-radius:3px;
                      
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-05-04 22:28:58
                            
                                1569阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            一、介绍 创建动画有多种方式,除了传统的利用setInterval来不断改变元素的属性值,和最新canvas中requestAnimationFrame以外,此处介绍三种创建动画的方式。总的来说,这三种都可以归为css3的动画方式,但是,不同的方式伸展拳脚的地方也就不一样。(注意,此处三种方式均基于JQuery) 二、创建动画的三种方式1、css() + transform 这是最简单的一种方式,            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-04-02 15:43:29
                            
                                64阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            文字阴影文字阴影的语法格式:text-shadow:水平向右的偏移值 向下的偏移值  迷糊度 阴影的颜色,水平向右的偏移值 向下的偏移值  迷糊度 阴影的颜色;可以有多个阴影,但是在实际的项目中最多一个阴影就可以了。<style>    div {        font-size: 100px;        text-align: center;        /* 水平方向向右移            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-10-23 00:51:00
                            
                                363阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            前段时间整理了CSS3中的渐变Gradient、透明度RGBA、边框圆角box-radius三个新属性的使用方法,这几次继续整理了有关于CSS3的text-shadow的使用方法。今天特意花了点时间贴上来与有共同爱好的朋友一起分享这个新属性的应用。text-shadow还没有出现时,大家在网页设计中阴影一般都是用photoshop做成图片,现在有了css3可以直接使用text-shadow属性来指            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                            精选
                                                        
                            2016-09-04 23:37:49
                            
                                859阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            ient、透明度RGBA、边框圆角box-radius三个新属性的使用方法,这几次继续整理了有关于CSS3的text-shadow的使用方法。今天特意花了点时间贴上来与有共同爱好的朋友一起分享这个新属性的应用。text-shadow还没有出现时,大家在网页设计中阴            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2022-11-28 19:31:43
                            
                                330阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            一、CSS3 动画简介二、CSS3 动画实现步骤三、动画定义四、代码示例            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-08-13 00:20:44
                            
                                3417阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            CSS3边框阴影实例:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS3边框阴影</title>
<style> 
div
{
width:300px;
height:100px;
background-co            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2015-10-15 14:16:43
                            
                                1293阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            阴影的详细用法。 转自:https://www.cnblogs.com/nyw1983/p/11348568.html ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-10-12 14:26:00
                            
                                937阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
             keyframes 有兼容性    -webkit-    -moz-   -0-   -ms-要定义属性名称    名称结合过渡一起使用   过渡完成时间(S)     缓冲描述 (linear 匀速&nb            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-03-25 18:24:14
                            
                                1495阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            CSS3动画序列(CSS3)<!DOCTYPE html><html lang="en"><head>    <meta charset="UT\            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-10-20 10:05:58
                            
                                5122阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            CSS3动画的常见属性(CSS3)<!DOCTYPE html><html lang="en"><head>    <meta charset="\            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-10-20 10:05:54
                            
                                329阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            1、使用动画:2步	1、创建动画 创建关键帧:当前元素的几个关键状态,当设置好关键帧后,动画就可以将几个关键帧连起来播放,并且使用过度的效果 语法:@keyframes 动画名称{ 0%{ css属性名:css属性值; ... } 50%{ css属性名:css属性值; ... } 100%{ cs ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-08-16 13:20:00
                            
                                1062阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            CSS3 动画 一、CSS3 动画 CSS3,我们可以创建动画,它可以取代许多网页动画图像,Flash动画,和JAVAScripts。 二、CSS3 @keyframes 规则 要创建CSS3动画,你将不得不了解@keyframes规则。 @keyframes规则是创建动画。 @keyframes规            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2018-07-24 09:51:00
                            
                                682阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            matrix(n,n,n,n,n,n) 定义 2D 转换,使用六个值的矩阵。translate(x,y) 定义 2D 转换,沿着 X 和 Y 轴移动元素。translateX(n) 定义 2D 转换,沿着 X 轴移动元素。translateY(n) 定义 2D 转换,沿着 Y 轴移动元素。scale            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2016-05-01 12:49:00
                            
                                316阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            css3动画:让小鱼摇起来<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>Document</title>    <style>        .fis            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-11-18 00:04:37
                            
                                571阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            3.5.4  动画
有人将HTML 5和CSS 3比做Flash的杀手,这是有原因的。因为除了HTML 5能够实现矢量图形制作外,使用CSS  3还可以对图像进行更细致的操作,它新增了动画功能,要实现图像的变形等功能,只需要一行CSS就可以实现了。那么结合HTML  5和JavaScript就可以将动画做得更美,效果完全可以接近Flash。但要想实现Flash的那种效果,还是需要下一定            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                            精选
                                                        
                            2011-07-25 11:16:58
                            
                                2030阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            CSS3动画实例1:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style> 
div{
width:100px;
height:100px;
background:red;            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2015-10-15 14:33:33
                            
                                1042阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            通过 CSS3,我们能够创建动画,这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。@keyframes myfirst
{
from {background: red;}
to {background: yellow;}
}
@-moz-keyframes myfirst /* Firef            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2017-06-15 13:21:24
                            
                                1547阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            是CSS3中具有颠覆性的特征之一,可通过设置多个节点来精确控制一            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-08-05 21:43:33
                            
                                1949阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            介绍 CSS3动画分为三种:过渡、变换、动画 分类 transition 作用:伪类被触发时,属性变换有过渡的时间 值: 属性 过渡时间 速度曲线 过渡延迟 属性:如width 、height、color、background-color(必选) 过渡时间:以秒为单位 (必选) 速度曲线:(非必选) ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-09-15 21:08:00
                            
                                1794阅读
                            
                                                                                    
                                2评论