首页建站经验 CSS3让HTML表单更加吸引眼球

CSS3让HTML表单更加吸引眼球

admin admin 2020-05-20 13:05:06 阅读() 评论()

　　越来越多的WEB设计师开始关注CSS3过度效果的使用， 过度效果不仅可以美化网站界面，自定义动画，而且还可以代替Javascript，增加搜索引擎的友好度。 　　下面为大家演示如何能…

　　越来越多的WEB设计师开始关注CSS3过度效果的使用， 过度效果不仅可以美化网站界面，自定义动画，而且还可以代替Javascript，增加搜索引擎的友好度。

　　下面为大家演示如何能够建立在HTML5中输入字段的动画效果。 尤其是CSS3的:valid伪类，它是比以往任何时候都更容易自定义文本输入。

　　启动文件

　　首先我们需要准备一个空白的index.html文件。

<html lang="en-US"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>CSS3 Animated Form Inputstitle> <meta name="author" content="Jake Rocheleau"> <link rel="shortcut icon" href="http://designshack.net/favicon.ico"> <link rel="icon" href="http://designshack.net/favicon.ico"> <link rel="stylesheet" type="text/css" media="all" href="styles.css"> <link rel="stylesheet" type="text/css" media="all" href="http://fonts.googleapis.com/css?family=Skranji:400,700|Oxygen:400,700"> head>


　　提交按钮不会有什么效果，但会重新加载页面。建议不要链接到后端的PHP或Ruby脚本对数据进行处理，或者甚至通过Ajax连接。

本文来自网络，不代表1号站长-站长学院|资讯交流平台立场。转载请注明出处： https://www.1cn.cc/jianzhan/jingyan/14679.html
打赏 赞
标签:
上一篇站长创业新主张：小而精赚钱胜过大而全
下一篇 网站编辑方向路 走在脚下为选择
admin

作者: admin

这里可以再内容模板定义一些文字和说明，也可以调用对应作者的简介！或者做一些网站的描述之类的文字或者HTML！

为您推荐

评论列表()

    联系我们

    联系我们

    0898-88888888

    在线咨询: QQ交谈

    邮箱: email@wangzhan.com

    工作时间：周一至周五，9:00-17:30，节假日休息

    关注微信
    微信扫一扫关注我们

    微信扫一扫关注我们

    关注微博