درس ها Lessons

• کلاس CSS چیست چگونه یک پس زمینه را با آن رنگ آمیزی کنیم What is a CSS Class how do we color a background with it

• چگونه با استفاده از کدهای جاسازی شده گوگل مپ را به وب سایت خود اضافه کنیم How to add Google Maps to your website using embed codes

• چگونه وب سایت خود را با دامنه خود در اینترنت به صورت زنده قرار دهید How to put your website live on the internet with your own domain

• مروری سریع بر نحوه عملکرد Bootstrap Grid Layout در VS Code Quick overview of how the Bootstrap Grid Layout works in VS Code

• کلاس پروژه 04 - دکمه سفارشی Class Project 04 - Custom Button

• چگونه یک تصویر پس زمینه بزرگ به طراحی سایت اضافه کنیم How to add a large background image to a website design

• بازنشانی CSS صفر کردن اریک مایر در مقابل عادی سازی چیست؟ What is a CSS reset zeroing eric meyers vs normalize

• HTML5 و CSS3 در طراحی وب چیست؟ What is HTML5 & CSS3 in web design

• چگونه کوئری های رسانه بوت استرپ را در CSS خود دوباره ایجاد کنید How to re-create the Bootstrap media queries in your own CSS

• نحوه ایجاد یک گرادیان پس زمینه کامل در CSS وب سایت How to make a full background gradient on a website CSS

• چگونه 2 تگ div با اندازه های مختلف در یک ردیف html css flexbox داشته باشیم How to have 2 div tags of different sizes in the same row html css flexbox

• طراحی سایت ریسپانسیو به چه معناست What does responsive website design mean

• چگونه یک تگ div را به یک لینک غول پیکر قابل کلیک در بوت استرپ 4 تبدیل کنیم How to make a div tag a giant clickable link in Bootstrap 4

• چگونه در بوت استرپ 4 عرض های ناهموار ایجاد کنیم How to create uneven col widths in Bootstrap 4

• راه اندازی پروژه طراحی وب جدید ما و بحث در مورد موضوعات ما Setting up our new web design project & discussing our topics

• نحوه ایجاد یک ناوبری متن ساده وب سایت در HTML و CSS How to create a simple website text navigation in HTML & CSS

• مقدمه: ملزومات طراحی وب پاسخگو - HTML5 CSS3 Bootstrap Introduction: Responsive Web Design Essentials - HTML5 CSS3 Bootstrap

• تفاوت بین اندازه فونت PX و EM و REM چیست؟ What is the difference between PX & EM & REM font sizes

• حداقل ارتفاع در مقایسه با ارتفاع برای تگ div چقدر است What is a min-height compared to height for a div tag

• نحوه ایجاد یک دکمه منوی ناوبری کشویی ساده HTML CSS How to create a simple dropdown navigation menu button HTML CSS

• چگونه تگ های متن و div را در یک وب سایت بوت استرپ 4 وسط قرار دهیم How to center text & div tags in a Bootstrap 4 website

• نحوه اضافه کردن تیک باکس علامت چک به فرم HTML How to add check mark tick box to a HTML form

• نحوه قرار دادن کارت های بوت استرپ در یک خط با استفاده از عرشه ها و ستون های گروه کارت How to put Bootstrap cards on one line using card groups decks & columns

• وب سایت خود را به صورت زنده با استفاده از پسوند Visual Studio Code تست کنید Test your website live using a Visual Studio Code extension

• نحوه اضافه کردن سایه به جعبه یا کارت در بوت استرپ 4 How to add a drop shadow to a box or card in Bootstrap 4

• نحوه ساخت منوی برگر 3 خط ناوبری موبایل برای یک وب سایت How to make a burger menu 3 line mobile navigation for a website

• افزودن یک تصویر col کامل در بوت استرپ 4 و رنگ آمیزی پس زمینه col Adding a full col image in bootstrap 4 & color the background of col

• چگونه یک جعبه ظرف DIV کامل را به یک پیوند قابل کلیک تبدیل کنیم How to make an entire DIV container box a clickable link

• کلاس پروژه 04 - دکمه سفارشی تکمیل شد Class Project 04 - Custom Button COMPLETE

• نحوه استایل css به بیش از یک تگ کلاس در یک کلاس ترکیبی زمان How to css style more than one class tag at a time compound classes

• استفاده مجدد از کلاس دکمه در مسیریابی Reusing a button class in the navigation

• چه ویرایشگر کدی باید از VS Code Sublime Dreamweaver Atom Brackets استفاده کنم What code editor should I be using VS Code Sublime Dreamweaver Atom Brackets

• تصاویر پاسخگو با تراکم پیکسلی نسبت پیکسل dppx در طراحی وب چیست What is pixel density responsive images pixel ratio dppx in webdesign

• پروژه کلاس 3 - سربرگ Flexbox کامل شد Class Project 3 - Flexbox Header COMPLETE

• نحوه نصب بوت استرپ 4 روی وب سایت با استفاده از کد ویژوال استودیو How to install Bootstrap 4 on a website using Visual Studio Code

• پاورقی اصلی مقاله هدر تگ HTML5 چیست What is HTML5 tag header nav section article main footer

• میانبرهای مفید ترفندهایی برای سرعت بخشیدن به گردش کار در VS Code Useful shortcuts tips tricks to speed workflow in VS Code

• چگونه با استفاده از mailto در HTML یک دکمه ایمیل ساده به یک وب سایت اضافه کنیم How to add a simple email button to a website using mailto in HTML

• مروری بر آنچه Bootstrap 4 در طراحی وب سایت است Overview of what Bootstrap 4 is in website design

• چگونه با استفاده از Bootstrap 4 همه چیز را در وب سایت خود روشن و خاموش کنیم How to turn things on & off on your website using Bootstrap 4

• چرا نمی توانم حاشیه یا بالشتک را به پایین بالای عناصر تگ Inline vs block اضافه کنم Why can’t I add margin or padding to the top bottom of my a tag Inline vs block elements

• چگونه در بوت استرپ 4 تصاویر را پاسخگو و کشدار کنیم How to make images responsive stretchy in Bootstrap 4

• در دوره آموزشی ملزومات طراحی وب ما چه اتفاقی می افتد What next in our web design essentials course

• نحوه صادرات تصاویر ریسپانسیو برای وب سایت از XD Photoshop Illustrator How to export responsive images for website from XD Photoshop Illustrator

• Class Project 01 – Div Tags Class Project 01 – Div Tags

• افزودن منوی کرکره‌ای CSS ما به وب‌سایت دوچرخه‌های غرش Adding our CSS dropdown menu to the roar bikes website

• چه زمانی از یک تصویر svg به جای jpg یا png در طراحی وب استفاده می کنید When would you use an svg image instead of jpg or png in web design

• نحوه ویرایش چرخ فلک بوت استرپ خاموش برای محو شدن زمان بندی موبایل How to edit Bootstrap carousel off for mobile timing fade

• کلاس پروژه 05 – طراحی سربرگ Class Project 05 – Header design

• فاصله ارتفاع خط بین پاراگراف ها به نام فاصله بعد Line height space between paragraphs aka space after

• مروری سریع بر نحوه عملکرد Bootstrap CSS Styles در VS Code Quick overview of how Bootstrap CSS Styles works in VS Code

• چگونه div ها را در داخل یکدیگر در HTML و CSS قرار دهیم How to nested divs inside of each other in HTML & CSS

• چگونه یک استایل css را به خط اول تگ p در یک وب سایت اضافه کنیم How to add a css style to the first line of a p tag on a website

• چگونه یک دکمه گرد رادیویی با نقطه در وسط به وب سایت فرم HTML اضافه کنیم How to add a radio button round button with dot in middle to HTML form website

• نحوه اضافه کردن یک سایه css به برچسب های div دکمه وب سایت و عنوان فونت های متن How to add a css drop shadow to a website button div tags and text fonts headings

• نحوه ساخت لینک قابل کلیک در html و تغییر رنگ How to make a clickable link in html & change the color

• نحوه ایجاد یک شیوه نامه آبشاری جداگانه در HTML و CSS How to create a separate cascading style sheet in HTML & CSS

• نحوه اضافه کردن یک قانون افقی با استفاده از HTML5 و CSS3 در VS Code How to add a horizontal rule using HTML5 & CSS3 in VS Code

• نحوه انتخاب و نصب فونت های گوگل در وب سایت HTML CSS خود How to choose & install google fonts on your HTML CSS website

• نحوه روشن و خاموش کردن موارد برای وب‌سایت‌های ریسپانسیو تبلت و دسکتاپ موبایل How to turn things on and off for mobile tablet & desktop responsive websites

• با استفاده از flexbox بدون حاشیه بیرونی، بین تگ‌های div فاصله یکنواخت اضافه کنید Add even space between div tags using flexbox with no outside margins

• کلاس پروژه 05 - طراحی سربرگ کامل شد Class Project 05 – Header design COMPLETE

• چگونه می توان پاورقی هدر را تمام عرض اما داخل را در مرکز قرار داد How to make the header footer full width but the inside centered

• نحوه تغییر چیدمان یک وب سایت واکنش گرا برای موبایل در مقابل دسکتاپ How to change the layout of a responsive website for mobile vs desktop

• چگونه یک تصویر را در HTML با استفاده از CSS در مرکز قرار دهیم How to center an image img in HTML using CSS

• چگونه یک تگ div را با استفاده از HTML و CSS در VS Code شفاف کنیم How make a div tag transparent using HTML & CSS in VS Code

• چگونه با استفاده از 100% عرض در HTML و CSS، تصاویر واکنشگرا را به وب سایت اضافه کنیم How to add responsive images to website using 100% width in HTML & CSS

• نحوه اضافه کردن سایه به متن و جعبه در بوت استرپ 4 How to add shadows to text & boxes in Bootstrap 4

• نحوه ایجاد یک منوی ساده پاسخگو برای موبایل فقط با استفاده از CSS How to make a simple responsive mobile menu using CSS only

• لوگوی خود را به منوی ناوبری وب سایت بوت استرپ 4 اضافه کنید Add your own logo to the bootstrap 4 website navigation menu

• چگونه با استفاده از تگ های Div ساختار به وب سایت خود اضافه کنید How to add structure to your website using Div Tags

• عنوان و توضیحات در سر یک صفحه وب چیست؟ What is the title and description for in the head of a web page

• نحوه اتصال 2 صفحه لینک در طراحی وب HTML How to connect link 2 pages in HTML web design

• چگونه عناصر ساختار html5 را به وب سایت html خود اضافه کنیم How to add html5 structure elements to your html website

• ایجاد و آزمایش اولین صفحه وب HTML ما Creating & testing our first HTML web page

• چگونه محتوا را به صورت عمودی در یک تگ div html با استفاده از flexbox css مرکز کنیم How to vertically center content in a html div tag using flexbox css

• مروری سریع بر نحوه عملکرد اجزای Bootstrap در VS Code Quick overview of how Bootstrap Components works in VS Code

• نحوه استایل دادن به کادرهای متن و چک باکس ها در HTML وب سایت How to style form text boxes & check boxes in a website HTML

• کارت هایمان را تمام می کنیم Finishing up our cards

• نحوه استفاده از جعبه حاشیه با اندازه جعبه از Flexbox در VS Code و طراحی وب How to use box-sizing border-box from Flexbox in VS Code & web design

• نحوه رنگ آمیزی پس زمینه یک صفحه وب با استفاده از تگ body html How to color the background of a webpage using the body html tag

• نحوه تغییر رنگ شناور و متحرک کردن دکمه من در HTML و CSS How to change hover color & animate my button in HTML & CSS

• چگونه یک منوی فرم کشویی برای یک وب سایت در HTML ایجاد کنید How to you make a drop down form menu for a website in HTML

• نحوه تغییر رنگ اندازه طرح‌بندی وب‌سایت در اندازه‌های مختلف با استفاده از پرسش‌های رسانه How to change a website layout size color when at different sizes using media queries

• چگونه تگ های خاص در HTML را برای اعمال css در استفاده از کلاس های شبه هدف قرار دهیم How to target specific tags in HTML to apply css to using Pseudo Classes

• گرفتن برچسب های div روی یک خط با استفاده از Flexbox در HTML و CSS Getting div tags onto one line using Flexbox in HTML & CSS

• چگونه تگ‌های div را با استفاده از HTML5 CSS3 Flexbox روی خطوط جداگانه قرار دهیم How to make div tags wrap onto separate lines using HTML5 CSS3 Flexbox

• نحوه تغییر اندازه و رنگ دکمه های پیش فرض Bootstrap 4 How to change the default Bootstrap 4 buttons size & color

• نحوه اضافه کردن گوشه های گرد به یک دکمه یا تگ div در HTML و CSS How to add rounded corners to a button or div tag in HTML & CSS

• نحوه استفاده از Google Chrome Inspect - حذف سبک های بوت استرپ نادیده گرفته شده How to use Google Chrome Inspect - Removing Overriding Bootstrap styles

• نحوه استفاده از Bootstrap Layout Grid Experiment 1 How to use Bootstrap Layout Grid Experiment 1

• نحوه تغییر اندازه رنگ نوع فونت پیش فرض در وب سایت با استفاده از HTML و CSS How to change the default font type color size on a website using HTML & CSS

• نحوه اضافه کردن تصاویر به وب سایت با استفاده از HTML what is alt How to add an images to a website using HTML what is alt

• نحوه ایجاد یک html شاخص و css به سبک How to create an index html & style css

• لوگوی خود را به منوی ناوبری وب سایت بوت استرپ 4 1 اضافه کنید Add your own logo to the bootstrap 4 website navigation menu 1

• نحوه سفارشی سازی نوار ناوبری وب سایت در بوت استرپ 4 How to customize the website navbar in bootstrap 4

• چگونه یک ناوبری بوت استرپ 4 ثابت چسبنده را به طراحی وب سایت خود اضافه کنید How to add a sticky fixed bootstrap 4 navigation to your website design

• نحوه اضافه کردن حاشیه و گوشه های گرد به جعبه در Bootstrap How to add a border & rounded corners to a box in Bootstrap

• نحوه اضافه کردن padding و حاشیه با استفاده از Bootstrap 4 در VS Code How to add padding & margins using Bootstrap 4 in VS Code

• نحوه استفاده از srcset برای تغییر تصاویر در HTML برای وب سایت واکنش گرا How to use srcset to change images in HTML for responsive website

• چگونه با استفاده از فونت Awesome VS Code به وب سایت خود آیکون اضافه کنید How to add icons to your website using font awesome VS Code

• نحوه سفارشی سازی سبک های css پیش فرض Bootstrap 4 How to customize the default Bootstrap 4 css styles

• چگونه با استفاده از VS Code کد خود را برای وجود خطا در HTML بررسی کنیم How to check your code for errors in HTML using VS Code

• چگونه یک تصویر پس زمینه کشیده به یک وب سایت اضافه کنیم How to add a stretching background image to a website

• کلاس پروژه 02 – پاورقی Class Project 02 – Footer

• چگونه وب سایت خود را بر روی تبلت یا تلفن همراه از Visual Studio Code تست کنید How to test your website on a tablet or mobile phone from Visual Studio Code

• نحوه اتصال Visual Studio VS Code از طریق sftp به میزبان bluehost How to connect Visual Studio VS Code via sftp to host bluehost

• نحوه ایجاد 100% هدر و عرض ناهموار در بوت استرپ 4 How to make 100% header & uneven widths in Bootstrap 4

• چگونه یک فرم ساده php را در وب سایت HTML خود کار کنیم How to make a simple php form work on your HTML website

• نحوه استفاده از تگ span یا کلاس span در HTML برای تغییر متن How to use a span tag or span class in HTML to change text

• نحوه تغییر منوی منو از دسکتاپ به تلفن همراه How to switch a menu nav from desktop to mobile phone

• نحوه تغییر اندازه و رنگ فونت h1 p در HTML CSS How to change the font style size & color of h1 p in HTML CSS

• ساختار این دوره طراحی وب چگونه است How is this web design course structured

• نحوه پین ​​کردن ناوبری به بالای یک وب سایت ثابت ناوبری How to pin the navigation to the top of a website fixed nav

• جاوا اسکریپت در مقابل جی کوئری در طراحی وب سایت چیست؟ What is Javascript vs Jquery in website web design

• پروژه کلاس 3 - سربرگ Flexbox Class Project 3 - Flexbox Header

• نحوه تغییر استایل های پیش فرض Bootstrap 4 Nav How to change the default styles for Bootstrap 4 nav

• بلاک کردن تصاویر سطح آیات تصاویر پس زمینه در HTML و CSS Block level images verses background images in HTML & CSS

• Class Project 02 - Footer CompLETE Class Project 02 - Footer COMPLETE

• افزودن متن و برچسب‌های مکان‌نما به وب‌سایت فیلدهای متنی در HTML را تشکیل می‌دهد Adding placeholder text and labels to website form text fields in HTML

• نحوه تغییر طرح بوت استرپ بسته به موبایل یا دسکتاپ How to change layout of Bootstrap depending on mobile or desktop

• چگونه یک جعبه متن بزرگ چند خطی را در فرم HTML اضافه کنیم How to add a large multi line text box in a HTML form

• برای دوره طراحی وب چه چیزی دانلود کنیم What to download for the web design course

• نحوه صادرات svg png jpg از XD Photoshop Illustrator برای طراحی وب سایت How to export svg png jpg from XD Photoshop Illustrator for website design

• تگ head vs body در مقابل html در صفحه طراحی وب چیست؟ What is the head vs body vs html tag in a web design page

• نحوه ساخت یک دکمه رنگی در VS Code با استفاده از HTML CSS How to make a colored button in VS Code using HTML CSS

• چگونه در حین ساختن از وب سایت خود نسخه پشتیبان تهیه کنید How to backup your website while you’re building