رفتن به مطلب
مرورگر پیشنهادی آرساکیا گیم مرورگر های تحت موتور کرومیوم می‌باشد، برای دانلود روی مرورگر انتخابی خود کلیک کنید
Google Chrome Microsoft Edge Ungoogled Chromium Brave Opera GX Opera

اچ تی ام ال و سی اس اس - پارت دو


Integer

ارسال‌های توصیه شده

بسمالله رحمان رحیم

سلاممممممممممممممممممم عرض میکنم به شما زیبایان

با پارت دوم HTML و CSS چی هستند در خدمت شما هستیم گلان

خب اول از همه میخوایم یک نگاهی به Java Script کنیم

 

1- جاوا اسکریپت چیست؟

جاوا اسکریپت یک زبان تحت وب قدرتمند هستش که با استفاده از اون در صفحات وب میتونید کارای بزرگی انجام بدین

خیلی ها فکر میکنن HTML و CSS رو یاد گرفتن دیگه برنامه نویسن و...

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

(به استایل دهی ها و... فرانت اند میگن)

اما خب یک جا هستش که شما باید با متغیر ها (که جلوتر میفهمیم چی هستن) سرو کار داشته باشید یا مثلا بیاید و از دیتا بیس

اطلاعاتی رو بخونید طبیعتا با HTML و CSS نمیشه این کارارو انجام داد

اینجاست که زبان هایی مثل Java Script و PHP به داد ما میان

که ما در اینجا میخوایم در مورد جاوا اسکریپت صحبت کنیم و کاری به بقیه زبان ها نداریم

 

5c2322_24images.jpg

جاوا اسکریپت یک زبان به سمت سرور و به سمت کاربر هستش یعنی این زبان فول استک هستش

شما با قابلیت هایی که این زبان قدرتمند در اختیار شما میزاره میتونید کار های بسیار بسیار بزرگی انجام دهید

این زبان دارای هزارات فریمورک (کتبخونه ای از کد های از پیش تعریف شده) رو در اختیار شما میزاره که نمونه هاش

Node JS

React

Angular

JQuery

و...

شما با استفاده از این کتابخونه ها میتونید کار های بزرگتری انجام دهید

اسکریپت چی هستش؟

اسکریپت به کد هایی میگن که از تکرار شدن جلوگیری میکنن (حالا تا جایی که یادمه...)

به کد های جاوا اسکریپت هم اسکریپت میگن مثلا

document.querySelector('p')

اصلا به تیکه اسکریپت بالا دقتی نکنید فقط تستی بودش

الان به این یک اسکریپت میگن

 

بعضی از زبان ها به این شکل هستن که برای اینکه بگیم اقا این خط کد دیگه تمومه و اجراش کن

باید یک سیمیکالن (;) بزاریم در اخر هر دستور

با گذاشتن سیمیکالن میگیم که دیگه این کد تموم شد و اجراش میکنه

(کد ها از بالا به پایین خط به خط اجرا میشن)

 

2- برخی از کد های سی اس اس

فرمت فایل های سی اس اس css. هستند مثال:

style.css

اول از همه باید یک طوری به سند اچ تی ام المون بفهمونیم دیگه آقا این سی اس اس هایی که مینویسیم واسه ی تگ های تو هستن

(به کد های سی اس اس استایل میگن)

برای اینکار باید در Head سند اچ تی ام المون کد زیر رو بنویسیم

<"Link rel="stylesheet" href="style.css>

در صورتی که فایل اچ تی ام ال و سی اس اس در یک جا بودند باید این قطعه کد رو نوشتشا اینم بگم

حالا در ادامه این رو هم یاد خواهم داد که چطوری بگیم یه پوشه برو عقب یا برو جلو و این فایل رو سلکت کن

خب دیگه شروع کنیم

سلکتور ها:

برای سلکت کردن تگ ها باید اسمشون رو بنویسیم

مثلا میخوایم همه ی (همه ی) تگ های P که در قبل توضیح دادم رو انتخاب کنیم و استایل بدیم بهش

باید بنویسیم

p {color: red;}

(چون هنوز کلاس و آیدی رو یاد ندادم همینو فلا داشته باشید)

هم مانند خیلی از زبان ها برای اتمام دادن استایل ها باید سیمیکالن رو گذاشت

استایل ها:

Color

به متن اون چیزی که سلکت کردید رنگ میده (مهم!)

مثال

p {color: aqua;}

 

Background-Color

میاد و یک رنگ بک گراند میده به اون چیزی که سلکت کردید (مهم!)

 

Width

میاد و یک عرضی رو به چیزی که سلکت کردید میده (تا زمانی که یک رنگ یا بوردر (که جلوتر یاد میگیریم) نداشته باشه معلوم نمیشه) (مهم!)

 

Height

میاد و یک طولی رو به چیزی که سلکت کردید میده (تا زمانی که یک رنگ یا بوردر (که جلوتر یاد میگیریم) نداشته باشه معلوم نمیشه) (مهم!)

 

استایل هامون هم تموم شدن

 

3- اچ تی ام ال

در پارت اول توضیح دادم سند اچ تی ام ال و اینارو

فقط یک چیزی رو یاد رفت که اونم بدنه ی اچ تی ام ال واستون بزارم واقعا عظر میخوام

بدنه ی اچ تی ام ال:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

   

</body>

</html>

این بدنه ی یک سند اچ تی ام ال هستش

فعلا توضیحی راجبشون نمیدم تا دست به کد شیم (بریم تویه برنامه کارایی رو انجام بدیم)

فقط خواستم این رو بزارم و بعد برم دیگههههه

انشالله عمری به دنیا داشتم در پارت سوم چیز های جذاب تری رو بهتون میگم

 

 

دوستان قشنگم تا پارت های بعدی شما رو به خدای بزرگ میسپارم

خدا یار و نگهداره یک یکتون

سرم بالاست

چون

خدا بالا سرمه

My Account:

FaIse.png

Narutuuzumaki.png

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

  • 2 هفته بعد...
در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

(به استایل دهی ها و... فرانت اند میگن)

*به هر چیزی که کاربر ها میبینن میگن بخش فرانت سایت یا کلاینت سایت یا سمت کاربر

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

اینجاست که زبان هایی مثل Java Script و PHP به داد ما میان

جاوااسکریپت تحت وب رو با php مقایسه میکنی برادر :(

node js رو با php مقایسه کنی بهتره 

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

که ما در اینجا میخوایم در مورد جاوا اسکریپت صحبت کنیم و کاری به بقیه زبان ها نداریم

 

تایتل که یه چیز دیگه میگفت

 

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

این زبان دارای هزارات فریمورک (کتبخونه ای از کد های از پیش تعریف شده) رو در اختیار شما میزاره که نمونه هاش

Node JS

node js نه کتابخونه است نه فریمورک اون یه ران تایمه

 

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

بعضی از زبان ها به این شکل هستن که برای اینکه بگیم اقا این خط کد دیگه تمومه و اجراش کن

باید یک سیمیکالن (;) بزاریم در اخر هر دستور

با گذاشتن سیمیکالن میگیم که دیگه این کد تموم شد و اجراش میکنه

در جاوااسکریپت این کار الزامی نیست خود انجین مرورگر انجام میده

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

(کد ها از بالا به پایین خط به خط اجرا میشن)

 

شوخی جالبی بود پسر 

با async , await اشنا هستی؟

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

Background-Color

میاد و یک رنگ بک گراند میده به اون چیزی که سلکت کردید (مهم!)

هییی...

دوست عزیز این زبان نشانه گزاری به بزرگ و کوچیک بودن حروف حساسه پس background-color*

در ۱۴۰۳/۵/۱ در 21:28، Integer گفته است:

انشالله عمری به دنیا داشتم در پارت سوم چیز های جذاب تری رو بهتون میگم

 

لطفا در اموزش های بعدی بیشتر دقت کنید دوست عزیز

زنده ایم قسطی تو ایران

 

samcoder.png

 

%5B2%5Dsamcoder.png

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید.
توجه: مطلب ارسالی شما پس از تایید مدیریت برای همه قابل رویت خواهد بود.

مهمان
ارسال پاسخ به این موضوع...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   بازگردانی قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
  • اضافه کردن...