استايل css3 برای متن

          Admin 
            بازدید : 739
          سه شنبه 22 اسفند 1391
           نظرات (0)
        

امروز آموزش استفاده از 10 استایل سی اس اس (css3) برای متون و مطالب سایت قرار داده شده است. به آموزش های زیر توجه کنید.

١- سه بعدی كردن متن ها: [3D text effect]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

text-shadow: 0 1px 0 #ccc,0 2px 0 #c9c9c9,0 3px 0 #bbb,0 4px 0 #b9b9b9,0 5px 0 #aaa,0 6px 1px rgba(0,0,0,.1),0 0 5px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.3),0 3px 5px rgba(0,0,0,.2),0 5px 10px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.2),0 20px 20px rgba(0,0,0,.15);

2- استايلی ديگر برای سه بعدی كردن متون: [3D text effect]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color:rgba(255,255,0,.7) ;font-weight: bold;text-shadow: 1px 1px rgba(255,128,0,.7),2px 2px rgba(255,128,0,.7),3px 3px rgba(255,128,0,.7),4px 4px rgba(255,128,0,.7),5px 5px rgba(255,128,0,.7);

3- ايجاد افكت سكته مغزی برای متون: [Stroke effect]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color: white;text-shadow: -1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;

4- استایل ترکیبی برای متون: [Combining text effect]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

-webkit-text-stroke: 1px black;color: white; text-shadow:3px 3px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;

5- افکت تار کردن متون: [Blur text]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color: transparent;text-shadow: #fff 0 0 5px;

6- افکت فتوشاپ برجسته متن: [Photoshop Emboss]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color:#ccc;text-shadow: -1px -1px white, 1px 1px #333

7- سایه دادن به مطالب: [Text Shadow]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color: #4393BB;text-shadow: #FDFD20 1px 1px 10px;

8- درخشان کردن مطالب: [Glow text effect]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color: #000;text-shadow: 0px 0px 8px #0F0;

9- استایلی دیگر برای درخشان کردن مطالب: [Glow text effect]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

color: #FFF;text-shadow: 0px 0px 8px #0FF,0px 0px 10px #0F0;

10- ایجاد نوشته سایه ای: [Shadow text]

jDesign

برای اينكه بتوانيد چنين استايلی به متون در وب سايت خود دهيد از كد زير استفاده كنيد:

text-shadow:1px 1px 0 #CCC,2px 2px 0 #CCC,3px 3px 0 #444,4px 4px 0 #444,5px 5px 0 #444,6px 6px 0 #444;

ارسال نظر برای این مطلب