2.HTML5和CSS3：用HTML5和CSS3也可以实现非常酷炫的代码，利用CSS3的新特性，可以轻松地实现漂亮的动画效果，如使用CSS3的旋转效果、缩放效果、颜色渐变效果等。
3.Canvas画布：使用Canvas画布，可以使用JavaScript绘制任何想要的图形，把酷炫的图形加入到页面中，就迎刃而解了。
首先先说一下HTML5的代码只是在原有的XHTML基础上增加了一些新的标签（还有一些新的特性，例如数据库和缓存等特性）
以下为此页面的结构代码：
<!doctype html><html>
<head>
<meta charset="utf-8">
<meta name="revised" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<meta name="robots" content="all" />
<title>页面标题</title>
</head>
<body>
<header>
<div></div><!--登陆注册区域-->
</header><!--头部[html5新标签]-->
<nav></nav><!--导航[html5新标签]-->
<div></div><!--banner-->
<div></div><!--左上-->
<div></div><!--右上-->
<div></div><!--左下-->
<div></div><!--右下-->
<footer></footer><!--底部[html5新标签]-->
</body>
</html>
注：以上为页面的大的框架，相对用HTML5新的标签更合理的，全用上了新的带有语义标签。
另外多说一下，[注册登陆]这块在html5的新标签里面没有很合适的语义化的标签，所以依然采用原有的div标签为最合理。html5只是在原有的技术的基础上更细化了，咱在制作代码的过程中没必要必须用HTML5的代码，主要看是否合理，合理的为较合适的。
多说的：不管用XHTML还是HTML5写代码，结构（HTML5）与样式（CSS）尽量要分离！
希望能帮到你！
HTML结构该鼠标点击按钮特效中每一个可点击的元素都是一个<button>按钮
CSS样式
以下是该css3点击按钮特效的通用CSS样式：
插件中通过在点击按钮时使用javascript来为它添加相应的动画CLASS来执行动画效果：
上面的CSS代码可以生成如下图的动画效果：
在“Stana”效果中，使用了html5 SVG clipPath，在它上面添加了一个transition。这个效果只能在Chrome浏览器中才能看到效果。
在“Stoja”效果中使用了CSS clip-path属性，这个效果也需要浏览器的支持才能看得到的。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）