分享24个超赞的CSS+html5代码片段

2015-5-2 / 0 评论 PHP / Mrxn

本文共计 1442 字,感谢您的耐心浏览与评论.

分享24个超赞的CSS+html5代码片段,如果你做模板用上其中一些CSS片段,我保证你的模板会美上很多的!

CodePen是一个网站前端设计开发平台,是一个针对网站前端代码设计的开发工具,提供多种效果的网站前端代码设计工具和丰富的案例特效代码。用户可以在各种现成的demo基础上Fork后开发自己的前端设计,也可以把你的Demo设计分享给其他人。

都是一些前端的设计,有些特效非常漂亮炫酷,有些是自适应的扁平化布局设计,有些是纯CSS实现的图标,有些令人惊艳的切换旋转效果。你可以自己去慢慢发现这些Demo的美妙之处。

Pure CSS3 MacBook Air with Thunderbird Display and Keyboard

Demo

CSS3 Working Clock

 

    这是个CSS3实现的时钟效果,使用的是CSS3动画特效,没有任何图片和JS.


     5409578f000193df05000270.jpg 


Demo


    CSS3 Pricing Table


    540957ca000182dc05000270.jpg


Demo


    CSS Loader


    540957e90001730c05000270.jpg

    

Demo


    Twitter Button Concept

    540958030001f17205000270.jpg


Demo


    CSS3 Loading Animation

    540958a300011d2505000270.jpg


Demo


    Pure CSS3 Vertical Menu with Hover Effect

    540958d70001eccf05000270.jpg


Demo


    CSS3 Stamp effect using radial gradients

    54095ac9000161fa05000270.jpg


Demo


    I Love Blur

    54095ae80001748e05000270.jpg


Demo


    Social Navigation

    54095b5a0001022a05000270.jpg


Demo


    Login

    54095b6b0001650805000270.jpg


Demo


    Calendar

    54095be50001c6cd05000270.jpg


Demo

    Social Footer

    54095c0d0001a02805000270.jpg


Demo


    Parallax Landscape

    54095c680001f95e05000270.jpg


Demo


    CSS3 Thermometer

    54095c8c0001c2e105000270.jpg


Demo


    CSS-Only Responsive Layout with Smooth Transitions

    54095cb400018f1a05000270.jpg


Demo


    Flat CSS3 Weather Widget

    54095d0900016c9405000270.jpg


Demo


    Flat Responsive Sliding Boxes

    54095ea300016db705000270.jpg


Demo


    Tiny CSS3 Round Breadcrumb

    54095f280001241705000270.jpg


Demo


    CSS3 Hover Effect using :after Psuedo Element

    54095f3a000105aa05000270.jpg


Demo


    Flat UI Elements

    54095f570001a85a05000270.jpg


Demo


    CSS Flat Button Shapes

    54095fa200016af805000231.jpg


Demo


    Email UI

    54095fb3000121cc05000231.jpg


Demo


    Flat Icons CSS


    54095fc60001e4f205000231.jpg

Demo



标签: 编程 代码 php

转载:转载请注明原文链接 - 分享24个超赞的CSS+html5代码片段


0条回应:“分享24个超赞的CSS+html5代码片段”


发表评论

{view_code_no}