توسط مثال های موجود در این فایل می تونید زیبایی و طراحی نوین رو به وب سایت خودتون هدیه کنید
آموزش استفاده
- قبل از تگ </head> کد زیر را قرار دهید :
<link rel="stylesheet" type="text/css" href="css/demo.css" /> <link rel="stylesheet" type="text/css" href="css/style.css" /> <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700,300|Sancreek|Raleway:100' rel='stylesheet' type='text/css' /> <script type="text/javascript" src="js/modernizr.custom.79639.js"></script> <!--[if lte IE 8]><style>.support-note .note-ie{display:block;}</style><![endif]--> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.lettering.js"></script> <script> $(document).ready(function() { $(".cs-text-cut").lettering('words'); }); </script> - بعد از تگ <body> کد زیر را قرار دهید :
<div class="container"> <header> <h1>Creative <strong>Web Typography</strong> Styles</h1> <h2>Fun with text styles and effects</h2> <nav class="codrops-demos"> <a class="current-demo" href="index.html">Demo 1</a> <a href="index2.html">Demo 2</a> <a href="index3.html">Demo 3</a> <a href="index4.html">Demo 4</a> <a href="index5.html">Demo 5</a> <a href="index6.html">Demo 6</a> <a href="index7.html">Demo 7</a> <a href="index8.html">Demo 8</a> </nav> <div class="support-note"><!-- let's check browser support with modernizr --> <span class="no-csstransforms">CSS transforms are not supported in your browser</span> <span class="no-csstransitions">CSS transitions are not supported in your browser</span> <span class="note-ie">Sorry, only modern browsers.</span> </div> </header> <section class="main"> <h2 class="cs-text"> <span class="cs-text-cut">Smooth</span> <span class="cs-text-mid">Operator</span> <span class="cs-text-cut">Smooth</span> </h2> </section> </div>
افکت های مفیدی بودن. ممنون از شما…
خواهش میکنم ایمان جان
با سلام
خیلی ممنون خیلی جالبن !
مرسی علی جان
همیشه من رو ذوق زده کردی!!!
مرسی سجاد جان لطف داری