less freamwork
DESCRIPTION
TRANSCRIPT
less freamwork
1
محبوب ورک فریمless
less freamwork
2
: پله پله؟/ 1 چیه ورک فریمراه cssمشکل/ 2 چه ورک فریم این و ؟ چیه
؟ داره حلیمیکنه؟/ 3 کار طور چه ورک فریم اینمثال/ 4 با همراه ورک فریم دستوراتورک/ 5 فریم این با کوچولو پروژه یه
مینویسیم
less freamwork
3
اصال ورک فریم؟؟ چیه
less freamwork
4
میخواد cssمشکل ورک فریم این که چیه؟ کنه حل
کدهای کارآزمودهسایت css
less freamwork
5
حل این lessراه حل واسه؟ چیه مشکل
Css میشه نویسی برنامه زبان یک شبیهباال پذیری انعطاف و بیشتر قدرت با هایی قابلیت با
less freamwork
6
Less طور چهکارمیکنه؟
less freamwork
7
آدرس به اصلی سایت از ورک فریم دانلود. .www lesscss org لینک
. .www lesscss ir لینک
پوشه به شده دانلود ورک فریم انتقالپروژه
1
2
پسوند با ای صفحه در ها استایل نوشتنname.less
صفحه به ورک فریم کردن htmlمتصل 4
3
less freamwork
8
ورک فریم دستورات ساختار
less freamwork
9
متغیرها
less freamwork
10
و متغیر تعریف روشخروجی
@nice-blue: #5B83AD; @light-blue: @nice-blue + #111;
#header { color: @light-blue; }
#header { color: #6c94be; }
less freamwork
11
Mixin) سادهتوابع)پارامتری
در کاربردی cssتابع چه؟؟ (داره ورود ) صفحه مثال
less freamwork
12
تعریف ساده mixinروش
.bordered { border-top: dotted 1px black; border-bottom: solid 2px black; }
#menu a { color: #111; .bordered; }
.post a { color: red; .bordered; }
less freamwork
13
خروجی
#menu a { color: #111; border-top: dotted 1px black; border-bottom: solid 2px black; }
.post a { color: red; border-top: dotted 1px black; border-bottom: solid 2px black; }
less freamwork
14
Mixin پارامتری
#header { .border-radius(4px); }
.button { .border-radius(6px); }
less freamwork
15
تو در تو استفاده#header { color: black; }
#header .navigation { font-size: 12px; }
#header .logo { width: 300px; }
#header .logo:hover { text-decoration: none; }
less freamwork
16
زیر LESSدر مشابه میتوان را باال کد } header#نوشت:
color: black;
.navigation { font-size: 12px; } .logo { width: 300px; &:hover { text-decoration: none } }
}
less freamwork
17
: ها رنگ با کار توابع
lighten(@color, 10%);darken(@color, 10%);
fadein(@color, 10%)fadeout(@color, 10%);fade(@color, 50%);
mix(@color1, @color2);
less freamwork
18
چیه : ورک فریم فهمیدیم اول قدممشکل : دوم رو cssقدم ورک فریم حل راه و
یادگرفتیمکار : طور چه ورک فریم یادگرفتیم سوم قدم
میکنهرو : ورک فریم این دستورات چهارم قدم
یادگرفتیم؟؟؟ آخر قدم