zoukankan      html  css  js  c++  java
  • css设计指南-笔记7

    CSS3 过渡

    过渡属性

    transition-property			//过渡的css属性名,如color、width
    transition-duration			//过渡的持续时间,如2s、500ms
    transition-timing-function	//过渡的调速函数,如linear、ease-in、ease-out、ease-in-out
    transition-delay			//过渡开始前的延迟时间
    
    简写
    transition: color 2s ease-in 100ms;
    

    第一条规则设定属性的初始状态和过渡参数
    第二条规则设定事件发生时属性的目标状态

    用户单击输入字段后,输入框的边框颜色会从黑色变化为绿色,过渡周期为2s
    input {border-color:black; transition:border-color 2s;}
    input:focus {border-color:green;}
    //注意厂商前缀
    

    通常过渡动画是由用户鼠标悬停的:hover伪类规则和表单元素获得焦点时的:focus伪类规则触发

    用css创造三角形

    div {
    	border: 12px solid;
    	border-color: transparent red transparent transparent;
    	height: 0;
    	 0;'
    }
  • 相关阅读:
    java第一次作业
    第十一次作业
    第十次作业
    第九次作业
    第八次作业
    第七次作业
    第六次作业
    第五次作业
    实验四,实验五
    Java_实验二
  • 原文地址:https://www.cnblogs.com/u14e/p/5207322.html
Copyright © 2011-2022 走看看