m0_74816049 2022-11-25 22:40 采纳率: 50%
浏览 6

html css代码有人可以帮我解释吗

刚学CSS,这一段看不懂,有没有人帮我解释一下这几段的意思,觉得太多了也可以只看一小段

*{
    margin:0px;
    padding:0px;
    }
div{
    width:1500px;
    margin:auto;    
    }
body{ background:#ffffff;}
#content{
    height: 864px;
}
#name{
    width: 700px;
    height:100px;
    position: relative;
    top: 140px;
    left: -300px;
}
#name p{
    font-size: 90px;
    font-family: 黑体;
    line-height:90px;
    text-align:center;
    font-weight:bold;
    color: #1B2754;
}
#tishi{
    border-radius: 15px;
    width: 200px;
    height: 70px;
    background-color: #D994AB;
    position: relative;
    top: 170px;
    left:-485px;
}
#tishi a{
    text-decoration: none;
}
#tishi p{
    font-size: 25px;
    font-family: 黑体;
    line-height:70px;
    text-align:center;
    font-weight:bold;
    color:#FEEFE1;
}
#tishi p:hover{
                animation: moveone 1s infinite;
                -webkit-animation: moveone 1s infinite;
                -webkit-animation-fill-mode: forwards;
            }
            @keyframes moveone{
                0%{color: #FEEFE1;
                transform: translateY(4px);}
                50%{color:#1B2754;
                transform: translateY(-4px);
                }
                100%{color: #FEEFE1;
                transform: translateY(0px);
                }}
            @-webkit-keyframes moveone{
                0%{color: #FEEFE1;
                transform: translateY(5px);}
                50%{color:#1B2754;
                transform: translateY(-5px);
                }
                100%{color:#FEEFE1;
                transform: translateY(0px);
                }    
#tishi p:visited{
    color: #FEEFE1; ;
}



  • 写回答

1条回答 默认 最新

  • 黛琳ghz 2022年度博客之星前端领域TOP 8 2022-11-25 23:51
    关注

    你应该是想问这段代码吧?!首先这个一个动画效果,具体可以看下图。
    使用@keyframes规则,你可以创建动画。
    创建动画是通过逐步改变从一个CSS样式设定到另一个。
    在动画过程中,您可以更改CSS样式的设定多次。
    指定的变化时发生时使用%,或关键字"from"和"to",这是和0%到100%相同。
    0%是开头动画,100%是当动画完成。
    为了获得最佳的浏览器支持,您应该始终定义为0%和100%的选择器。
    注意: 使用animation属性来控制动画的外观,还使用选择器绑定动画。
    然后webkit代表chrome、safari私有属性;表示能够在以webkit为内核的浏览器中正常使用

    img


    img

    评论

报告相同问题?

问题事件

  • 修改了问题 11月25日
  • 创建了问题 11月25日

悬赏问题

  • ¥15 关于#python#的问题:求帮写python代码
  • ¥20 MATLAB画图图形出现上下震荡的线条
  • ¥15 LiBeAs的带隙等于0.997eV,计算阴离子的N和P
  • ¥15 关于#windows#的问题:怎么用WIN 11系统的电脑 克隆WIN NT3.51-4.0系统的硬盘
  • ¥15 来真人,不要ai!matlab有关常微分方程的问题求解决,
  • ¥15 perl MISA分析p3_in脚本出错
  • ¥15 k8s部署jupyterlab,jupyterlab保存不了文件
  • ¥15 ubuntu虚拟机打包apk错误
  • ¥199 rust编程架构设计的方案 有偿
  • ¥15 回答4f系统的像差计算