بازارسال شده از ربات پرشین چت | چت و گفتگو ناشناس + دانلود فیلم و سریال
پیام ناشناس جدید:کی آموزش بازی سازی رو شروع میکنی؟
Devologist | دولوژیست | کد و برنامه نویسی پیام ناشناس جدید: کی آموزش بازی سازی رو شروع میکنی؟
پیام ناشناس جدید: کی آموزش بازی سازی رو شروع میکنی؟تا چند روز دیگه کاراشو انجام میدم
اولویتها در CSS (Specificity) به زبان ساده خب این یکی از اون چیزاست که خیلیها اولش قاطی میکننولی من برات خیلی ساده میگم: مشکل چیه؟فرض کن یه عنصر داری و چندتا CSS روش اثر گذاشتنحالا سوال: کدوم یکی اجرا بشه؟اینجاست که Specificity (اولویت) وارد بازی میشه ️ مثال ساده:p { color: blue;}.text { color: red;}
#title { color: green;}HTML:<p id="title" class="text">سلام</p>
حالا چی میشه؟ممکنه بگی: آبی؟
قرمز؟ سبز؟
جواب: سبز چرا؟چون CSS یه قانون اولویت داره:
ترتیب اولویت (خیلی مهم): id (#) → قویترین class (.) → متوسط element (p, h1, div) → ضعیفترین️ یعنی چی سادهتر؟element = پیشنهاد class = جدیتر
id = دستور قطعی
یه مثال خیلی ساده:p { color: blue; }.text { color: red; } نتیجه: قرمز میشه چون class قویتره نکته مهم:حتی اگه 10 تا element بنویسیباز هم یه id میتونه همه رو override کنه تمرین:یه عنصر بساز و همزمان بهش: element style بدهclass بده* id بده
#css #5
@devologist </>
نوع دادهها در JavaScript (string / number / boolean) خب حالا که با متغیرها آشنا شدیباید بدونی داخل این متغیرها چه چیزایی میتونیم ذخیره کنیم به این میگن: Data Types (نوع دادهها) String (متن) یعنی هر چیزی که “متن” باشهlet name = "Ali";let message = "سلام دنیا "; نکته: داخل "" یا '' نوشته میشهفرقی نداره متن باشه یا جمله
Number (عدد) برای عددها (بدون کوتیشن!)let age = 20;let price = 99.5; نکته: اگر داخل "" بذاری، میشه متن نه عدد Boolean (درست یا غلط) ️فقط دو حالت داره:
let isOnline = true;
let isLoggedIn = false;
یعنی چی؟true = درست / فعال / روشن
false = غلط / غیرفعال / خاموش مثال واقعی:let name = "Mohammad"; // string
let age = 25; // number
let isPro = true; // boolean
کاربردش تو دنیای واقعی:String → اسم کاربر، پیامها
Number → سن، قیمت، امتیاز Boolean → لاگین هست یا نه، روشن/خاموش
️ خلاصه خیلی ساده: string = متنnumber = عدد boolean = درست/غلط
تمرین:برای خودت اینا رو بساز:
اسم سن
آیا برنامهنویس هستی یا نه
#js #javascript #5
@devologist </>
* چطوری توی CSS به برندمون رنگ بپاشیم؟
میخوایم یاد بگیریم چطوری با CSS، ظاهر بیروح سایتمون رو خوشگل و رنگی کنیم. کلاً ۳ تا راه اصلی و پرکاربرد داریم که هر کدوم یه جایی به کارمون میاد. بریم که یاد بگیریم:
### ۱. استفاده از اسم رنگها (Color Names)
این دمدستترین و سادهترین راهه. مرورگرها حدود ۱۴۰ تا اسم رنگ رو میشناسن. فقط کافیه اسم انگلیسی رنگ رو بنویسی.
- مثال: `red`, `blue`, `hotpink`, `skyblue`, `gold`
- کجا استفاده کنیم؟ وقتی داری سریع یه چیزی رو تست میکنی و دقیق بودنِ تُنِ رنگ خیلی برات مهم نیست.
```css
h1 {
color: tomato; / یه قرمز خوشرنگ و گوجهای! /
}
```
---
### ۲. کدهای هِگزا (Hex Codes) 샵
این روش «نور چشمیِ» طراحها و برنامهنویسهاست! اکثر پالتهای رنگی که توی اینترنت میبینی این شکلیان.
- ساختار: با یه هشتگ (`#`) شروع میشه و ۶ تا کاراکتر داره (ترکیبی از اعداد ۰ تا ۹ و حروف A تا F).
- چطوری کار میکنه؟ دو تای اول مربوط به قرمزی (Red)، دو تای وسط سبزی (Green) و دو تای آخر آبی (Blue) هستن (همون ترکیب RGB خودمان!).
- مثال: `#ff0000` (قرمز خالص)، `#000000` (مشکی)، `#ffffff` (سفید).
یه نکته حرفهای: اگه جفتجفت کاراکترها مثل هم باشن، میتونی خلاصه بنویسیشون. مثلاً `#ff33aa` رو میتونی بنویسی `#f3a`.
```css
p {
color: #2ecc71; / یه سبزِ زمردیِ شیک /
}
```
---
### ۳. سیستم RGB و RGBA (روش علمی و دقیق) 🧪
اینجا ما با عدد بازی میکنیم. به مرورگر میگیم چقدر قرمز، چقدر سبز و چقدر آبی رو با هم قاطی کنه.
- ساختار: `rgb(red, green, blue)` که هر عدد میتونه بین ۰ تا ۲۵۵ باشه.
- حالا اون A چیه؟ اگه بنویسیم `rgba` (اون `a` مخفف Alpha هست)، میتونیم به رنگمون شفافیت بدیم. عدد چهارم بین ۰ (کاملاً شفاف) تا ۱ (کاملاً کدر) هست.
```css
div {
/ یه آبیِ آروم با ۵۰ درصد شفافیت /
background-color: rgba(52, 152, 219, 0.5);
}
```
---
### کدوم رو انتخاب کنیم؟
- اگه عجله داری: Name
- اگه میخوای حرفهای و استاندارد باشی: Hex
- اگه میخوای رنگت پشتنما (Transparent) باشه: RGBA
---
### وقت تمرینه! (دست به کد شو)
برای اینکه قشنگ یادت بمونه، همین الان این ۳ تا کار رو انجام بده:
۱. یه فایل HTML ساده بساز و یه تگ `<h1>` توش بنویس.
۲. با استفاده از اسم رنگ، رنگ متنش رو بذار روی `dodgerblue`.
۳. یه دکمه (`<button>`) بساز و با کد Hex، پسزمینهاش رو نارنجی کن (`#e67e22`).
۴. یه کادر (`<div>`) بساز و با RGBA* یه رنگ مشکی بهش بده که ۵۰ درصد شفاف باشه (یعنی پشتش دیده بشه).
#css #6@devologist </>
چطوری توی CSS به برندمون رنگ بپاشیم؟میخوایم یاد بگیریم چطوری با CSS، ظاهر بیروح سایتمون رو خوشگل و رنگی کنیم. کلاً ۳ تا راه اصلی و پرکاربرد داریم که هر کدوم یه جایی به کارمون میاد. بریم که یاد بگیریم:
### ۱. استفاده از اسم رنگها (Color Names)
این دمدستترین و سادهترین راهه. مرورگرها حدود ۱۴۰ تا اسم رنگ رو میشناسن. فقط کافیه اسم انگلیسی رنگ رو بنویسی.
- مثال: `red`, `blue`, `hotpink`, `skyblue`, `gold`
- کجا استفاده کنیم؟ وقتی داری سریع یه چیزی رو تست میکنی و دقیق بودنِ تُنِ رنگ خیلی برات مهم نیست.
```css
h1 {
color: tomato; / یه قرمز خوشرنگ و گوجهای! /
}
```
---
### ۲. کدهای هِگزا (Hex Codes) 샵
این روش «نور چشمیِ» طراحها و برنامهنویسهاست! اکثر پالتهای رنگی که توی اینترنت میبینی این شکلیان.
- ساختار: با یه هشتگ (`#`) شروع میشه و ۶ تا کاراکتر داره (ترکیبی از اعداد ۰ تا ۹ و حروف A تا F).
- چطوری کار میکنه؟ دو تای اول مربوط به قرمزی (Red)، دو تای وسط سبزی (Green) و دو تای آخر آبی (Blue) هستن (همون ترکیب RGB خودمان!).
- مثال: `#ff0000` (قرمز خالص)، `#000000` (مشکی)، `#ffffff` (سفید).
یه نکته حرفهای: اگه جفتجفت کاراکترها مثل هم باشن، میتونی خلاصه بنویسیشون. مثلاً `#ff33aa` رو میتونی بنویسی `#f3a`.```css
p {
color: #2ecc71; / یه سبزِ زمردیِ شیک /
}
```
---
### ۳. سیستم RGB و RGBA (روش علمی و دقیق) 🧪
اینجا ما با عدد بازی میکنیم. به مرورگر میگیم چقدر قرمز، چقدر سبز و چقدر آبی رو با هم قاطی کنه.
- ساختار: `rgb(red, green, blue)` که هر عدد میتونه بین ۰ تا ۲۵۵ باشه.
- حالا اون A چیه؟ اگه بنویسیم `rgba` (اون `a` مخفف Alpha هست)، میتونیم به رنگمون شفافیت بدیم. عدد چهارم بین ۰ (کاملاً شفاف) تا ۱ (کاملاً کدر) هست.
```css
div {
/ یه آبیِ آروم با ۵۰ درصد شفافیت /
background-color: rgba(52, 152, 219, 0.5);
}
```
---
###
کدوم رو انتخاب کنیم؟- اگه عجله داری: Name
- اگه میخوای حرفهای و استاندارد باشی: Hex
- اگه میخوای رنگت پشتنما (Transparent) باشه: RGBA
---
###
وقت تمرینه! (دست به کد شو)برای اینکه قشنگ یادت بمونه، همین الان این ۳ تا کار رو انجام بده:
۱. یه فایل HTML ساده بساز و یه تگ `<h1>` توش بنویس.
۲. با استفاده از اسم رنگ، رنگ متنش رو بذار روی `dodgerblue`.
۳. یه دکمه (`<button>`) بساز و با کد Hex، پسزمینهاش رو نارنجی کن (`#e67e22`).
۴. یه کادر (`<div>`) بساز و با RGBA* یه رنگ مشکی بهش بده که ۵۰ درصد شفاف باشه (یعنی پشتش دیده بشه).
#css #6@devologist </>
میخوایم ببینیم چطوری توی جاوااسکریپت مثل یه حرفهای حساب و کتاب کنیم. 🧮توی جاوااسکریپت به این علامتها میگیم *Arithmetic Operators. بریم سراغ ۴ تا اصلیهاش:
۱. جمع (+) - Addition
توی JS، این عملگر دو تا کار برامون انجام میده:
- جمع اعداد: `5 + 10` که خب مشخصه میشه `15`.
- چسبوندن متنها (Concatenation): اگه دو تا متن (String) رو با هم جمع کنی، اونا رو میچسبونه به هم!
مثال: `'Hello' + 'World'` میشه `'HelloWorld'`.
۲. تفریق (-) - Subtractionخیلی ساده یه مقدار رو از اون یکی کم میکنه.- مثال: `let balance = 100 - 40;` (حالا متغیر balance مقدارش ۶۰ هست).
۳. ضرب (*) - Multiplicationتوی دنیای کامپیوتر، ضرب رو با ستاره نشون میدیم.- مثال: `5 4` جوابش میشه `20`.
۴. تقسیم (/) - Division
از علامت اسلش برای تقسیم استفاده میکنیم.
- مثال: `10 / 2` جوابش میشه `5`.
---
یه نکتهی خیلی مهم (سوتی ندی!):
حواست باشه اگه یه عدد رو با یه متن جمع کنی، جاوااسکریپت گیج نمیشه، ولی عدد رو تبدیل به متن میکنه و میچسبونه بغل اون یکی!
مثلاً: `5 + "10"` جوابش میشه `"510"`! (به این میگن Type Coercion که بعداً مفصل در موردش حرف میزنیم).
---
بیاید کد بزنیم (مثال):
---
وقت تمرینه! (دست به کد شو)
یه اسکریپت کوچیک بنویس که کارهای زیر رو انجام بده:
1. دو تا متغیر بساز (مثلاً به اسم `num1` و `num2`) و بهشون عدد بده.
2. یه متغیر سوم بساز که حاصل ضرب اون دو تا رو تقسیم بر ۲* کنه.3. نتیجه رو با یه جمله قشنگ توی کنسول (`console.log`) چاپ کن.
#js #javascript #6@devologist </>
۱. جمع (+) - Addition
توی JS، این عملگر دو تا کار برامون انجام میده:
- جمع اعداد: `5 + 10` که خب مشخصه میشه `15`.
- چسبوندن متنها (Concatenation): اگه دو تا متن (String) رو با هم جمع کنی، اونا رو میچسبونه به هم!
مثال: `'Hello' + 'World'` میشه `'HelloWorld'`.
۲. تفریق (-) - Subtractionخیلی ساده یه مقدار رو از اون یکی کم میکنه.- مثال: `let balance = 100 - 40;` (حالا متغیر balance مقدارش ۶۰ هست).
۳. ضرب (*) - Multiplicationتوی دنیای کامپیوتر، ضرب رو با ستاره نشون میدیم.- مثال: `5 4` جوابش میشه `20`.
۴. تقسیم (/) - Division
از علامت اسلش برای تقسیم استفاده میکنیم.
- مثال: `10 / 2` جوابش میشه `5`.
---
یه نکتهی خیلی مهم (سوتی ندی!):حواست باشه اگه یه عدد رو با یه متن جمع کنی، جاوااسکریپت گیج نمیشه، ولی عدد رو تبدیل به متن میکنه و میچسبونه بغل اون یکی!
مثلاً: `5 + "10"` جوابش میشه `"510"`! (به این میگن Type Coercion که بعداً مفصل در موردش حرف میزنیم).
---
بیاید کد بزنیم (مثال):let applePrice = 20;
let orangePrice = 15;
// جمع کل
let totalPrice = applePrice + orangePrice; // 35
// تخفیف
let finalPrice = totalPrice - 5; // 30
console.log("قیمت نهایی با تخفیف: " + finalPrice);
---
وقت تمرینه! (دست به کد شو)یه اسکریپت کوچیک بنویس که کارهای زیر رو انجام بده:
1. دو تا متغیر بساز (مثلاً به اسم `num1` و `num2`) و بهشون عدد بده.
2. یه متغیر سوم بساز که حاصل ضرب اون دو تا رو تقسیم بر ۲* کنه.3. نتیجه رو با یه جمله قشنگ توی کنسول (`console.log`) چاپ کن.
#js #javascript #6@devologist </>
بعد از اینکه یاد گرفتیم چطوری تیتر بزنیم، نوبت میرسه به اصل مطلب: یعنی نوشتنِ متنها!
توی دنیای وب، شما نمیتونید همینطوری متن رو ول کنید توی صفحه ، باید به مرورگر بفهمونید که این تیکه از متن، یه "پاراگراف" هست. اینجاست که تگ `<p>` وارد بازی میشه. حرف p هم از اول کلمه Paragraph گرفته شده.
### *تگ `<p>` چیه و چیکار میکنه؟
هر وقت بخواید یه متن معمولی، یه توضیح، یا یه بدنه داستانی بنویسید، از این تگ استفاده میکنید. ساختارش هم خیلی سادهست:
`<p>متن شما اینجا قرار میگیره</p>`
یه نکته باحال (و البته کمی رو اعصاب!):*بچهها، یه فرقی بین HTML و ورد (Word) هست. توی HTML، اگه شما توی محیط کدنویسی ۱۰ تا اینتر (Enter) بزنید یا کلی فاصله (Space) بدید، مرورگر همهی اونا رو نادیده میگیره و فقط یک فاصله نشون میده!
مثلاً این کد:
فرق تگ عنوان و پاراگراف در چیه؟ببینید، تگهای `h1` تا `h6` ذاتاً متن رو ضخیم (Bold) و درشت میکنن، اما تگ `<p>` یه متن کاملاً ساده و معمولی بهتون میده. علاوه بر این، مرورگرها بهصورت خودکار قبل و بعد از هر پاراگراف یه فضای خالی (Margin) میذارن تا متنها به هم نچسبن و چشم خسته نشه.
---
وقتِ تمرینه! (دست به کد شو)
برای اینکه قشنگ دستت راه بیفته، همین الان یه فایل HTML باز کن و سعی کن ساختار زیر رو توش پیاده کنی:
۱. یه تگ `h1` بنویس و توش بنویس: "درباره من".۲. زیرش یه تگ `h2` بزن و بنویس: "علایق شخصی".۳. حالا زیر این تیتر، یک پاراگراف (`p`) بنویس و توی دو سه خط بگو به چه چیزهایی علاقه داری.۴. در آخر یه تگ `h2` دیگه بزن با عنوان "هدف من" و زیرش توی یه پاراگراف دیگه، هدفت رو از یادگیری برنامه نویسی بنویس.
نکته تمرین: حواست باشه تگها رو درست باز کنی و حتماً با علامت `/` ببندی.
#html #6@devologist </>
توی دنیای وب، شما نمیتونید همینطوری متن رو ول کنید توی صفحه ، باید به مرورگر بفهمونید که این تیکه از متن، یه "پاراگراف" هست. اینجاست که تگ `<p>` وارد بازی میشه. حرف p هم از اول کلمه Paragraph گرفته شده.
### *تگ `<p>` چیه و چیکار میکنه؟
هر وقت بخواید یه متن معمولی، یه توضیح، یا یه بدنه داستانی بنویسید، از این تگ استفاده میکنید. ساختارش هم خیلی سادهست:
`<p>متن شما اینجا قرار میگیره</p>`
یه نکته باحال (و البته کمی رو اعصاب!):*بچهها، یه فرقی بین HTML و ورد (Word) هست. توی HTML، اگه شما توی محیط کدنویسی ۱۰ تا اینتر (Enter) بزنید یا کلی فاصله (Space) بدید، مرورگر همهی اونا رو نادیده میگیره و فقط یک فاصله نشون میده!
مثلاً این کد:
<p>
سلام، من دارم
برنامه نویسی یاد میگیرم.
</p>
فرق تگ عنوان و پاراگراف در چیه؟ببینید، تگهای `h1` تا `h6` ذاتاً متن رو ضخیم (Bold) و درشت میکنن، اما تگ `<p>` یه متن کاملاً ساده و معمولی بهتون میده. علاوه بر این، مرورگرها بهصورت خودکار قبل و بعد از هر پاراگراف یه فضای خالی (Margin) میذارن تا متنها به هم نچسبن و چشم خسته نشه.
---
وقتِ تمرینه! (دست به کد شو)برای اینکه قشنگ دستت راه بیفته، همین الان یه فایل HTML باز کن و سعی کن ساختار زیر رو توش پیاده کنی:
۱. یه تگ `h1` بنویس و توش بنویس: "درباره من".۲. زیرش یه تگ `h2` بزن و بنویس: "علایق شخصی".۳. حالا زیر این تیتر، یک پاراگراف (`p`) بنویس و توی دو سه خط بگو به چه چیزهایی علاقه داری.۴. در آخر یه تگ `h2` دیگه بزن با عنوان "هدف من" و زیرش توی یه پاراگراف دیگه، هدفت رو از یادگیری برنامه نویسی بنویس.
نکته تمرین: حواست باشه تگها رو درست باز کنی و حتماً با علامت `/` ببندی.
#html #6@devologist </>