前端CSS使用经验记录

本文记录在前端开发中经常使用的一些样式处理。

  1. div中文本换行展示

    white-space:normal;

  2. 禁止页面选中复制

    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;
    user-select: none;

  3. 圆角边框

    border-radius:15px;

  4. CSS3动画效果

    div{
    animation: myfirst 5s;
    -moz-animation: myfirst 5s; /* Firefox /
    -webkit-animation: myfirst 5s; /     Safari 和 Chrome /
    -o-animation: myfirst 5s; /     Opera */
    }

    @keyframes myfirst
    {
    from {background: red;}
    to {background: yellow;}
    }

    @-moz-keyframes myfirst /* Firefox */
    { from {background: red;}
    o {background: yellow;}
    }

    @-webkit-keyframes myfirst /* Safari 和 Chrome */
    { from {background: red;}
    to {background: yellow;}
    }

    @-o-keyframes myfirst /* Opera */
    { from {background: red;}
    to {background: yellow;}
    }

  5. CSS3过度效果
属性 描述
transition 简写属性，用于在一个属性中设置四个过渡属性。
transition-property 规定应用过渡的 CSS 属性的名称。
transition-duration 定义过渡效果花费的时间。默认是 0。
transition-timing-function 规定过渡效果的时间曲线。默认是 "ease"。
transition-delay 规定过渡效果何时开始。默认是 0。
前端 css

如果觉得我的文章对您有用，请随意打赏。

您的支持将是我最大的动力！