آموزش مقدماتیHTMLوCSS(جلسه 10:تعیین موقعیت محتوا – بخش۲)
1398/02/26 09:28 , میلاد صاحب نظر

آموزش مقدماتیHTMLوCSS(جلسه 10:تعیین موقعیت محتوا – بخش۲)

در جلسه قبل وارد مبحث تعیین موقعیت محتوا شدیم و توضیح دادیم که می‌توانیم این کار را با استفاده از floatها انجام دهیم و همراه با حل مثال به توضیح آن‌ها پرداختیم. در این جلسه این مبحث را تکمیل می‌کنیم. با ما همراه باشید!

۱- ساختن اولین صفحه وب قسمت اول ۷-باز کردن Box Model قسمت اول ۱۳-تنظیمات پشت زمینه قسمت اول ۱۹-ایجاد فرم‌ها قسمت اول
۲-ساختن اولین صفحه وب قسمت دوم ۸-باز کردن Box Model قسمت دوم ۱۴-تنظیمات پشت زمینه قسمت دوم ۲۰-ایجاد فرم‌ها قسمت دوم
۳-آشنایی با HTML  قسمت اول ۹-تنظیم موقعیت محتوا قسمت اول ۱۵-ایجاد لیست‌ها قسمت اول ۲۱-سازماندهی اطلاعات با جداول قسمت اول
۴-آشنایی با HTML قسمت دوم ۱۰-تنظیم موقعیت محتوا قسمت دوم ۱۶-ایجاد لیست‌ها قسمت دوم ۲۲-سازماندهی اطلاعات با جداول قسمت دوم
۵-آشنایی با CSS قسمت اول ۱۱-کار با Typography قسمت اول ۱۷-افزودن رسانه قسمت اول ۲۳-نوشتن بهترین کد
۶-آشنایی با CSS قسمت دوم ۱۲-کار با Typography قسمت دوم ۱۸-افزودن رسانه قسمت دوم  

تعیین موقعیت با Inline-Block

علاوه بر استفاده از floatها، روش دیگری که می‌توانیم با استفاده از آن محتوا را تعیین موقعیت کنیم، استفاده از ویژگی display همراه با مقدار inline-block است. روش inline-block همان‌طور که قبلاً هم گفته شد، عمدتاً برای طراحی صفحات یا برای قرار دادن عنصرها در کنار یکدیگر در یک خط مفید است و استفاده می‌شود.

به یاد داشته باشید که مقدار inline-block برای ویژگی display، عنصرها را درون یک خط نمایش می‌دهد و همچنین به شما اجازه می‌دهد تا تمام ویژگی‌های box model از جمله border، padding، width، height و margin را بپذیرید.

استفاده از عنصرهای inline-block برای ما امکانی فراهم می‌کند تا به صورت کامل از box model استفاده کنیم، بدون اینکه نگران پاک کردن floatها باشیم.

تمرین inline-block

در جلسه قبلی یک مثال سه ستونه برای floatها به کار بردیم، از همان برای inline-block هم استفاده می‌کنیم. ابتدا کد HTML را همان چیزی که بود نگه می‌داریم:

<header>...</header>
<section>...</section>
<section>...</section>
<section>...</section>
<footer>...</footer>

حالا به جای float کردن سه عنصر <section>، مقادیر display آن‌ها را به inline-block تغییر می‌دهیم و ویژگی‌های margin و width‌را همان چیزی که قبلاً بودند باقی می‌گذاریم. کد CSS ما به شکل زیر خواهد بود:

section {
  display: inline-block;
  margin: 0 1.5%;
  width: 30%;
}

متأسفانه، این کد به تنهایی زیاد مشکل را حل نمی‌کند و آخرین عنصر <section> به یک ردیف جدید انتقال داده می‌شود. به یاد داشته باشید، چون عنصرهای inline-block در یک خط و در کنار هم نمایش داده شده‌اند، پس بین آن‌ها فضا وجود دارد.

وقتی سایز هر فضا به مقدار width و مقادیر margin افقی تمام عنصرهای درون ردیف اضافه شوند، عرض کلی خیلی زیاد می‌شود و در نتیجه آخرین عنصر <section> به یک ردیف جدید منتقل می‌شود. برای اینکه تمام عنصرهای <section> در یک ردیف نمایش داده شوند، فضای خالی بین هر عنصر <section> باید حذف شود.

حذف فضاها بین عنصرهای inline-block

روش‌های زیادی برای حذف فضای بین عنصرهای inline-block وجود دارند و برخی از آن‌ها پیچیده‌تر از بقیه هستند. ما روی دو مورد از آسان‌ترین روش‌ها تمرکز می‌کنیم که هر دو داخل HTML اتفاق می‌افتند.

اولین راه حل این است که تگ آغازین هر عنصر <section> جدید را در همان خطی قرار دهید که تگ‌ بستن و انتهایی عنصر <section> قبلی قرار دارد. به جای اینکه از یک خط جدید برای هر عنصر استفاده کنید، عنصرها را در یک خط پایان داده و دوباره آغاز می‌کنیم. کد HTML به شکل زیر خواهد بود:

<header>...</header>
<section>
  ...
</section><section>
  ...
</section><section>
  ...
</section>
<footer>...</footer>

نوشتن عنصرهای inline-block به این شکل اطمینان می‌دهد که فضای بین عنصرهای inline-block درون کد HTML وجود نداشته باشند. در نتیجه، وقتی صفحه رندر می‌شود فضا ظاهر نخواهد شد.

روش دیگر برای حذف فضای خالی بین عنصرهای inline-block باز کردن یک کامنت HTML دقیقاً بعد از تگ انتهایی یک عنصر inline-block است. سپس، قبل از رسیدن به تگ ابتدایی عنصر inline-block  بعدی، سریعاً کامنت HTML را ببندید.

انجام این کار به عنصرهای inline-block امکان می‌دهد تا در خط‌های مجزای HTML شروع و پایان یابند و همه فضاهای بین عنصرها با استفاده از کامنت‌ها از بین می‌روند. کد نهایی به شکل زیر است:

<header>...</header>
<section>
  ...
</section><!--
--><section>
  ...
</section><!--
--><section>
  ...
 </section>
 <footer>...</footer>

هیچ‌کدام از این گزینه‌ها عالی نیستند، اما به کار می‌آیند. بهتر است برای نظم و زیبایی بیشتر از روش کامنت‌ها استفاده کنید، اما اینکه از کدام روش استفاده کنید کاملاً به خود شما بستگی دارد.

ایجاد طرح‌های (layout) قابل استفاده مجدد

وقتی یک وبسایت می‌سازید، همیشه بهتر است استایل‌های ماژولاری بنویسید که بتوانید دوباره در جایی دیگر از آن‌ها استفاده کنید و طرح‌های قابل استفاده مجدد از جمله بهترین کدهای قابل استفاده مجدد محسوب می‌شوند. طرح‌ها را می‌توان یا با استفاده از floatها و یا عنصرهای inline-block ایجاد کرد، اما کدام برای شما بهتر است و چرا؟

اینکه برای طراحی ساختار یک صفحه بهتر است از floatها استفاده شود یا عنصرهای inline-block به خود شما بستگی دارد.

روشی که ما در این مثال برای ایجاد Grid یا طراحی یک صفحه به کار می‌بریم، استفاده از عنصرهای inline-block است و سپس از floatها برای قرار دادن محتوا در اطراف یک عنصر مورد نظر استفاده می‌کنید (گفتیم عنصر خاص چون floatها برای استفاده در تصاویر طراحی شده‌اند). در کل، کار کردن با عنصرهای inline-block خیلی راحت‌تر است.

با این حساب، از هر چیزی که برای شما بهتر است استفاده کنید. اگر کار کردن با یک روش برای شما آسان‌تر از کار کردن با روش دیگر است، خب تعارف نکنید و کار خودتان را بکنید.

در حال حاضر مشخصات CSS جدیدی در کار هستند (به خصوص ویژگی‌های مرتبط با flex- و grid-) که کمک می‌کنند به بهترین نحو صفحات را طراحی کنیم. در جستجوی این روش‌ها باشید تا هر وقت پیش آمدند آن‌ها را تشخیص دهید.

تمرین

حالا که درک کاملی از طراحی‌های قابل استفاده مجدد دارید، زمان آن رسیده که یکی از آن‌ها را در وبسایت Styles Conference استفاده کنیم.

  1. برای وبسایت Styles Conference، ما با استفاده از عنصرهای inline-block یک طراحی قابل استفاده مجدد سه ستونی ایجاد می‌کنیم. این کار را به روشی انجام می‌دهیم که به ما اجازه می‌دهد سه ستون با عرض برابر یا دو ستون که کل عرض بین آن‌ها تقسیم شده است (دو سوم برای یکی و یک سوم برای دیگری) داشته باشیم.
    برای شروع، ما کلاس‌هایی ایجاد می‌کنیم که عرض این ستون‌ها را تعریف می‌کنند. د کلاسی که ایجاد می‌کنیم عبارت‌اند از col-1-3 برای یک سوم و col-2-3 برای دو سوم. درون بخش grid از فایل css، این کلاس‌ و عرض‌های متناظر آن‌ها را تعریف می‌کنیم.
    .col-1-3 {
      width: 33.33%;
    }
    .col-2-3 {
      width: 66.66%;
    }
    ​
  2. ما می‌خواهیم هر دو ستون‌ها به شکل عنصرهای inline-block نمایش داده شوند. باید اطمینان حاصل کنیم که حالت عمودی هر ستون روی top تنظیم شده باشد.
    اجازه دهید دو Selector جدید ایجاد کنیم که دارای استایل‌های ویژگی display و vertical-alignment مشترک باشند.
    .col-1-3,
    .col-2-3 {
      display: inline-block;
      vertical-align: top;
    }​

    دوباره به سراغ CSS می‌رویم، ما دو کلاس selector به نام‌های col-1-3 و col-2-3 ایجاد کردیم که با یک ویرگول از هم جدا شده‌اند. ویرگول در انتهای اولین selector مشخص می‌کند که یک selector دیگر نیز قرار است ایجاد شود. پس از دومین Selector یک آکولاد باز (}) قرار گرفته است که مشخص می‌کند قرار است تعریف استایل‌ها بیان شوند. با استفاده از selectorهای مجزا شده با ویرگول، می‌توانیم استایل‌های یکسان را هر دفعه به چندین Selector پیوند بزنیم.

  3. می‌خواهیم در بین هر کدام از ستون‌ها کمی فضای خالی ایجاد کنیم تا به مجزا شدن محتوا کمک کند. می‌توانیم این کار را با قرار دادن padding افقی روی هر کدام از ستون‌ها انجام دهیم.
    این روش خوب عمل می‌کند. به هر حال، وقتی دو ستون در کنار یکدیگر قرار می‌گیرند، عرض فضای بین آن‌ها دو برابر فضای خارج از ستون‌ها که تا لبه ردیف ادامه می‌یابد، خواهد بود. برای ایجاد تعادل بین آن‌ها، ما همه ستون‌هایمان را درون یک grid قرار می‌دهیم و همان padding ستون‌ها را به آن Grid‌ نیز اضافه می‌کنیم.
    اجازه دهید از کلاسی به نام grid برای شناسایی grid استفاده کنیم و سپس همان padding افقی مشابه را برای کلاس‌های col-1-3، grid و col-2-3 اعمال می‌کنیم. Selectorها را با استفاده از ویرگول از هم مجزا می‌کنیم و کد CSS ما به شکل زیر خواهد بود:
    .grid,
    .col-1-3,
    .col-2-3 {
      padding-left: 15px;
      padding-right: 15px;
    }
    ​
  4. وقتی در حال تنظیم padding افقی هستیم، باید مراقب باشیم. یادتان هست که در جلسه قبلی یک عنصر محدود کننده (container) ایجاد کردیم که به عنوان کلاس container نام‌گذاری شد و تمام محتوا را در مرکز یک صفحه موجود در یک عنصر با عرض ۹۶۰ پیکسل قرار می‌داد. در حال حاضر اگر بخواهیم یک عنصر با کلاس grid را درون یک عنصر با کلاس container قرار دهیم، paddingهای افقی آن‌ها به یکدیگر اضافه می‌شوند و ستون‌های ما دارای عرض متناسب با بقیه صفحه نخواهند بود.
    ما نمی‌خواهیم این اتفاق بیفتد، پس در عوض، باید برخی از استایل‌های مجموعه قوانین container با مجموعه قوانین Grid به اشتراک بگذاریم. به طور دقیق‌تر، ما باید ویژگی و مقادیر width (تا مطمئن شویم که صفحه ما در  عرض ۹۶۰ پیکسل ثابت باقی بماند) و ویژگی و مقادیر margin (برای در مرکز قرار دادن هر عنصر دارای کلاس grid در صفحه) را به اشتراک بگذاریم.
    این کار را با تجزیه مجموعه قوانین قدیمی container به شکل زیر انجام می‌دهیم:
    .container,
    .grid {
      margin: 0 auto;
      width: 960px;
    }
    .container {
      padding-left: 30px;
      padding-right: 30px;
    }
    ​

    حالا هر عنصر دارای کلاس container یا grid دارای عرض ۹۶۰ پیکسل خواهد بود و در مرکز صفحه قرار خواهد گرفت. علاوه بر این، ما با منتقل کردن padding افقی موجود به یک مجموعه قوانین جدید و مجزا، آن را برای هر عنصری که دارای کلاس container باشد ذخیره کرده‌ایم.

  5. بسیار خب – تمام کارهای سختی که برای به دست آوردن استایل‌های grid‌ قابل استفاده مجددمان لازم بود انجام شوند را انجام دادیم. حالا وقت آن است که روی HTML کار کنیم و ببینیم این کلاس‌ها چگونه کار می‌کنند.
    کارمان را با تیزرهای موجود در صفحه اصلی که داخل فایل html قرار دارد شروع می‌کنیم و آن‌ها را به سه ستون تقسیم می‌کنیم. در حال حاضر، تیزرها در یک عنصر <section> که دارای کلاس container است قرار دارند. ما می‌خواهیم آن کلاس را از container به grid تغییر دهیم تا بتوانیم شروع به قرار دادن ستون‌ها درون آن کنیم.
    <section class="grid">
      ...
    </section>
    ​
  6. سپس، می‌خواهیم یک کلاس col-1-3 به هر عنصر <section> موجود در عنصر <section> دارای کلاس grid اضافه کنیم.
    <section class="grid">
    
      <section class="col-1-3">
        ...
      </section>
    
      <section class="col-1-3">
        ...
      </section>
      
      <section class="col-1-3">
        ...
      </section>
    
    </section>
    ​
  7. و در آخر، چون هر کدام از ستون‌هایمان یک عنصر inline-block است، می‌خواهیم مطمئن شویم که حتماً فضای خالی بین آن‌ها را حذف می‌کنیم. پس از کامنت‌ها برای این کار استفاده می‌کنیم و کمی هم یادداشت به جا می‌گذاریم که به بخش بعدی اشاره کند و به این شکل نظم و خوانایی کدمان افزایش یابد.
    <section class="grid">
      
      <!-- Speakers -->
      
      <section class="col-1-3">
        ...
      </section><!--
      
      Schedule
      
      --><section class="col-1-3">
        ...
      </section><!--
      
      Venue
      
      --><section class="col-1-3">
        ...
      </section>
    
    </section>
    ​

بررسی کد: در خط سوم ما یک کامنت گذاشته‌ایم که نوشته است Speakers که یعنی بخش بعدی Speaker است. در انتهای خط هفتم، ما بلافاصله پس از تگ بستن </section> یک کامنت باز کرده‌ایم. درون آن کامنت، در خط نهم ما نوشته‌ایم که بخش بعدی بخش schedule خواهد بود.

سپس کامنت را در ابتدای خط یازدهم بسته‌ایم، دقیقاً قبل از تگ باز <section>. این ساختار کامنت مشترک دوباره در خط‌های ۱۳ تا هفدهم بین دو عنصر <section> دقیقاً قبل از بخش Venue ظاهر می‌شود.

در همه آن‌ها، ما تمام فضاهای خالی بین ستون‌ها را با کامنت پر کرده‌ایم و در عین حال از آن کامنت‌ها برای مشخص کردن بخش‌ها نیز استفاده کرده‌ایم.

حالا یک grid سه ستونی قابل استفاده مجدد داریم که از چندین تنظیمات مختلف پشتیبانی کرده و از هر دو ستون‌های با عرض یک سوم و دو سوم هم استفاده می‌کند. صفحه اصلی ما دارای سه ستون است، که تمام تیزرهای مختلف را از هم جدا می‌کند.

طراحی سه ستونه صفحه اصلی سایت

شکل ۱۰.۱. صفحه اصلی سایت Styles Conference ما حالا شامل یک طراحی سه ستونی است

دمو و کد منبع

در زیر، می‌توانید وبسایت Styles Conference را در وضعیت فعلی‌اش مشاهده کنید و همچنین می‌توانید کد منبع وضعیت فعلی وبسایت را نیز دانلود کنید.

لینک مشاهده وبسایت Styles Conference                    کد منبع وبسایت Styles Conference

عنصرهای دارای موقعیت‌های منحصر به فرد

هر از گاهی می‌خواهیم موقعیت یک عنصر را دقیقاً مشخص کنیم، اما floatها یا عنصرهای inline-block نمی‌توانند این کار را انجام دهند. Floatها که یک عنصر را از جریان یک صفحه حذف می‌کنند، گاهی نتایج ناخواسته به بار می‌آورند چون عنصرهای اطراف در اطراف عنصر float شده قرار می‌گیرند.

عنصرهای inline-block مگر در مواردی که بخواهیم ستون ایجاد کنیم، خیلی سخت می‌توانند در مکان مورد نظر و مناسب قرار گیرند. برای این وضعیت‌ها می‌توانیم از ویژگی position همراه با ویژگی‌های box offset استفاده کنیم.

ویژگی property مشخص می‌کند که یک عنصر چگونه در یک صفحه موقعیت گیری می‌کند و آیا درون جریان نرمال یک سند ظاهر می‌شود یا خیر.

این ویژگی همراه با ویژگی‌های box offset (یعنی ویژگی‌های bottom، right، top و left) استفاده می‌شود که با جا به جا کردن عنصرها به جهت‌های مختلف، دقیقاً مشخص می‌کند که یک عنصر در کجا قرار می‌گیرد.

به صورت پیش‌فرض هر عنصر دارای مقدار static‌ برای ویژگی position است، که یعنی این عنصر در جریان نرمال یک سند قرار دارد و هیچ ویژگی box offset نمی‌پذیرد.

مقدار Static در اکثر مواقع با مقدارهای relative یا absolute بازنویسی می‌شود که در بخش بعدی تست می‌شوند.

تعیین موقعیت relative

مقدار relative برای ویژگی position به عنصرها امکان می‌دهد تا درون جریان نرمال یک صفحه ظاهر شوند و در صورت نیاز فضای کافی برای یک عنصر باقی می‌گذارد، اما به عنصرهای دیگر اجازه احاطه کردن آن را نمی‌دهد. به هر حال، این روش همچنین امکانی فراهم می‌کند تا موقعیت نمایش عنصر با ویژگی‌های box offset تغییر یابد.

برای مثال، کدهای HTML و CSS زیر را در نظر بگیرید:

HTML

<div>...</div>
<div class="offset">...</div>
<div>...</div>

CSS

div {
  height: 100px;
  width: 100px;
}
.offset {
  left: 20px;
  position: relative;
  top: 20px;
}

در این کد دومین عنصر <div>، عنصر دارای کلاس offset دارای مقداری Relative برای ویژگی position و دو ویژگی box offset (یعنی left و top) می‌باشد. این کار موقعیت اولیه عنصر را حفظ می‌کند و عنصرهای دیگر اجازه ورود به این فضا را ندارند.

علاوه بر این، ویژگی‌های box offset عنصر را تعیین موقعیت مجدد می‌کنند و آن را ۲۰ پیکسل از چپ و ۲۰ پیکسل از بالای موقعیت اصلی جا به جا می‌کنند.

وقتی عنصر را با استفاده از ویژگی‌های box offset تعیین موقعیت می‌کنیم، عنصر به جای اینکه عنصر زیرین خودش را به سمت پایین حرکت دهد (مانند کاری که ویژگی‌های margin و padding انجام می‌دهند)، با آن عنصر تداخل می‌یابد.

تعیین موقعیت absolute

مقدار absolute برای ویژگی position با مقدار relative فرق می‌کند، به این شکل که اگر عنصری دارای مقدار absolute برای position باشد در جریان نرمال یک سند ظاهر نمی‌شود و فضا و موقعیت اولیه عنصر تعیین موقعیت شده با Absolute حفظ نمی‌شد.

علاوه بر این، عنصرهای تعیین موقعیت شده با absolute متناسب با نزدیک‌ترین عنصر والد تعیین موقعیت شده با Relative جا به جا می‌شوند. اگر یک عنصر والد تعیین موقعیت شده با relative وجود نداشته باشد، عنصر تعیین موقعیت شده با absolute متناسب با عنصر <body> تعیین موقعیت می‌شود.

این‌ها اطلاعات زیاد و خوبی بودند. اجازه دهید به چگونگی عملکرد آن‌ها در کد توجه کنیم:

HTML

<section>
  <div class="offset">...</div>
</section>

CSS

section {
  position: relative;
}
div {
  position: absolute;
  right: 20px;
  top: 20px;
}

در این مثال عنصر <section> با Relative تعیین موقعیت شده است، اما شامل هیچ ویژگی box offset نیست. در نتیجه موقعیت آن تغییر نکرده است. عنصر <div> دارای یک کلاس offset است و دارای مقدار absolute برای position است.

چون عنصر <section> نزدیک‌ترین عنصر والد تعیین موقعیت شده با relative به عنصر <div> است، عنصر <div> متناسب با عنصر <section> تعیین موقعیت می‌شود.

در صورت وجود عنصرهای تعیین موقعیت شده با relative، ویژگی‌های box offset مشخص می‌کنند که یک عنصر متناسب با خودش در کدام جهت جا به جا می‌شود.

در صورت وجود عنصرهای تعیین موقعیت شده با absolute، ویژگی‌های box offset مشخص می‌کنند که یک عنصر متناسب با نزدیک‌ترین عنصر والد تعیین موقعیت شده با relative به آن در چه جهتی جا به جا می‌شود.

در نتیجه استفاده از ویژگی‌های top و right از box offset، عنصر <div> بیست پیکسل از راست و ۲۰ پیکسل از بالای عنصر <section> ظاهر می‌شود.

چون عنصر <div> با Absolute تعیین موقعیت شده است، درون جریان نرمال صفحه قرار نمی‌گیرد و با تمام عنصرهای اطرافش تداخل پیدا می‌کند. علاوه بر این، موقعیت اصلی عنصر <div> حفظ نمی‌شود  عنصرهای دیگر می‌توانند آن فضا را اشغال کنند.

معمولاً، بیشتر تعیین موقعیت‌ها می‌توانند بدون استفاده از ویژگی position و ویژگی‌های box offset کنترل می‌شوند، اما در موارد خاص آن‌ها می‌توانند بسیار مفید باشند.

خلاصه

یاد گرفتن چگونگی تعیین موقعیت محتوا درون HTML و CSS یک قدم بزرگ به سمت تسلط بر این دو زبان است. این مبحث را به مبحث box model اضافه کنید تا به تبدیل شدن به برنامه‌نویس front – end نزدیک‌تر شوید.

در این دو جلسه (نهم و دهم) موارد زیر را پوشش دادیم:

  • Floatها چه هستند و چگونه می‌توان از آن‌ها برای تعیین موقعیت محتوا استفاده کرد
  • چگونه عنصرهای float شده را پاک و محدود کنیم
  • چگونه محتوا را با استفاده از عنصرهای inline – block تعیین موقعیت کنیم
  • چگونه فضای خالی بین عنصرهای inline-block را حذف کنیم
  • چگونه محتوا را با استفاده از عنصرهای تعیین موقعیت relative و absolute به صورت منحصر به فرد تعیین موقعیت کنیم.

در هر جلسه مهارت‌های جدیدی می‌آموزید، پس ادامه دهید. در جلسه بعد راجع به تایپوگرافی صحبت خواهیم کرد.

با MUG همراه باشید!

منبع: learn.shawyhowe 

جلسه بعد                                                     جلسه قبل

 مطالب مرتبط

تعامل با فایل‌ها در HTML5
ایجاد یک فرم HTML و قابلیت تکمیل خودکار فرم‌ها
 بهترین قالب‌های رایگان HTML5 و CSS3
۹ چیز که باید در مورد HTML5 بدانید
آموزش گام به گام #C
برنامه نویسی شیءگرا چیست؟

از آخرین دوره های آموزشی و تخفیف ها مطلع شوید

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

آخرین مطالب

آموزش جامع SQL Server (جلسه ۱۲)
آموزش جامع SQL Server (جلسه ۱۲)

دستور UPDATE در SQL Server برای تغییر داده‌های موجود در یک جدول، از دستور UPDATE به شکل زیر استفاده ...

آموزش جامع SQL Server (جلسه ۱۵)
آموزش جامع SQL Server (جلسه ۱۵)

دستور DROP TABLE در SQL Server گاهی، لازم است یک جدول که دیگر استفاده‌ای ندارد را حذف کنید. برای ...

آموزش جامع SQL Server (جلسه ۳۵: Window Functionها – بخش ۲)
آموزش جامع SQL Server (جلسه ۳۵: Window Functionها – بخش ۲)

بخش اول از آخرین مبحث دوره جامع آموزش SQL Server در جلسه قبلی بررسی شد. این مبحث که ...

آخرین دیدگاه ها

دیدگاه خود را درباره این پست بنویسید

فرم ارسال نظرات