مطالب پیشنهادی از سراسر وب

آموزش Sketch - ایجاد گرافیک های SVG واکنش گرا

دسته بندی ها: آموزش سی اس اس (CSS) ، آموزش طراحی وب ، آموزش طراحی وب واکنش گرا (Responsive) ، آموزش های لیندا (Lynda)

فرمت Scalable Vector Graphics یا SVG می تواند شامل CSS خاص خود باشد و برای نمایش در هر اندازه ای واکنش گرا باشد. در این دوره مختصر، نحوه استفاده از Sketch و CSS برای ایجاد یک فایل SVG واکنش گرا را یاد بگیرید. این دوره چگونگی ترکیب نسخه های مختلف گرافیکی را برای به حداکثر رساندن تاثیر آن بر روی اندازه های مختلف صفحه نمایش، و همچنین چگونگی صادرات فایل های SVG از Sketch را نشان می دهد. همچنین نشان می دهد که چگونه می توان یک بیت CSS اضافه کرد و گرافیک را طوری واکنش گرا کرد که شامل کوئری های مدیا باشد.

سرفصل:

  • معرفی دوره
  •  SVG واکنش گرا با Sketch
  • ساخت لوگو Multiversion در Sketch
  • ترکیب لوگوها در یک داشبورد با Sketch
  • صادرات فایل های SVG از Sketch
  • اضافه کردن CSS به یک فایل SVG
  • نمایش و مخفی کردن لوگو ها با کوئری های مدیا CSS
  • نتیجه

ترجمه با ویدابیا

ترجمه فارسی این دوره آموزشی رو همین الان از ویدابیا سفارش بده الان سفارش بده
آیا این نوشته را دوست داشتید؟
Sketch: Creating Responsive SVG Publisher:Lynda Author:Chris Converse Duration:16m 5s Level:Intermediate

Learn tips and tricks for creating responsive SVG graphics using Sketch and CSS.
Released: 9/10/2018
The Scalable Vector Graphics (SVG) format is distinctive in that it can contain its own CSS, allowing it to respond to its display size. In this concise course, learn how to use Sketch and CSS to create a responsive SVG file. Chris Converse demonstrates how to combine various versions of a graphic to maximize its impact on various screen sizes, as well as how to export SVG files from Sketch. He also shows how to add a bit of CSS and make a graphic responsive by including media queries. Upon completing the course, you'll grasp how to create a single SVG file that can change and adapt itself based on its on-screen size.
Introduction
Responsive SVG with Sketch
39s
1. Construct a Multiversion Logo in Sketch
Combine logos into a single artboard with Sketch
3m 25s
Export SVG files from Sketch
2m 56s
Adding CSS to an SVG file
3m 47s
Show and hide logos with CSS media queries
4m 56s
Conclusion
Where to go from here
22s

پیشنهاد آموزش مرتبط در فرادرس