آموزش طراحی سایت با html و css – بخش چهارم


توسط : روابط عمومی رشدانا در ۶ مرداد ۱۳۹۸

در بخش قبلی بصورت مقدماتی آموزش طراحی سایت با css و html را گفتیم در ادامه آموزش طراحی قالب سایت با html و css درباره  اصول کدنویسی با css را بحث خواهیم کرد.

لازم به ذکر است که ما در بخش های قبل ابزار  Notepad ++را برای نوشتن کد معرفی کردیم که میتوانید از این سایت دانلود کنید.

استایل نویسی در css

در بخش قبل گفتیم سه روش برای استایل دهی به تگ های html وجود دارد.

اولین روش خطی بودن بود که استایل ها درون تگ قرار دارد.

مثال:

 

آموزش طراحی سایت با html css

 

نکته:

در html اگر یک تگ زیر مجموعه تگ های دیگر باشد،این تگ را بعنوان فرزند تگ اصلی گفته میشود.

به تگ اصلی ، والد یا پدر میگویند.

تگ های فرزند کلیه خصوصیات تگ والد یا اصلی را به ارث میبرند،مگراینکه دارای خصوصیات تعریف شده ای باشند.

مثلا در مثال بالا رنگ زمینه تگ p هم قرمز است.

این روش با دو روش دیگر یعنی استایل دهی درونی و خارجی فرق دارد.

در این دو روش باید ایتدا نام هر تگ مربوطه و سپس شروع به استایل نویسی کنیم.

دومین روش استایل نویسی درونی بود.

به مثال زیر توجه کنید که دارای دو تگ p هست و میخواهیم ببینیم چجوی به این دوتگ رنگ پس زمینه بدهیم.

 

آموزش طراحی قالب سایت با html css

 

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

class در css

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

در اینضورت باید کلاس را تعریف و استایل موردنظر را به کلاس نسبت دهیم  و سپس نام کلاسی که میخواهید تگ مورد نظر از آن استایل استفاده کند را در تگ بنویسید.

در آموزش طراحی سایت با css توجه داشته باشید که ابتدای هر کلاس با نقطه (.) نشان داده می شود.

بعنوان مثال کلاس زیر را ایجاد کردیم تا از ۴ تگ داده شده بدلخواه به تگ اول و چهارم ، رنگ سبز بدهیم.

بدین منظور ابتدا کلاس دلخواه bgcolor-green تعریف می کنیم سپس استایل background-color:green را به آن می دهیم.

آموزش طراحی وب سایت با html css

مثال:

فرض کنید کلاسی به نام bgcolor-green داریم که قصد داریم این کلاس فقط برای تگ  <p>  قابل اجرا باشد.

مثال دوم برای کلاس

id یا شناسه در class

اما گاهی اوقات شما عنصری منحصر به فرد در صفحه دارید که این عنصر بایستی دارای شناسه یکتا یا منحصر به فرد باشد. در این صورت از id برای این عنصر استفاده می کنیم. ابتدای نام آی دی یا id با علامت شارپ (#) مشخص می شود.

مثال برای id در CSS

گاهی عنصر منحصر به فردی داریم که این عنصر باید دارای شناسه منحصر به فرد باشد.

در اینصورت برای این عنصر  یک id درنظر میگیریم.

ابتدای نام idرا با شارپ(#)مشخص میکنیم.

به مثال زیر توجه کنید:

مثال id برای class

در بالا ملاحظه میشود که مثلا تگ divدارای شماره سریال منحصر به فردی است پی برای آن idدر نظر گرفتیم.

توجه:  مجاز هستیم فقط برای یک عنصر شناسه درنظر بگیریم و تگ های دیگر را نمیتوان با این شناسه مقدار دهیم.

دوره آموزشی پیشنهادی

آموزش ایمیل مارکتینگ پیشرفته

Email Marketing Course

راهی دیگر برای تبلیغات موثر


  • آیا هنوز ایمیل مارکتینگ کاربرد دارد
  • آموزش انتخاب بازار هدف
  • آشنایی با ابزار های ایمیل مارکتینگ
  • آشنایی با ابزار mailchimp
  • آموزش محتوای مناسب برای ایمیل مارکتینگ
  • مزیت های بازاریابی ایمیلی نسبت به مدل های دیگر بازاریابی

  • زمان: چهارشنبه 30 مرداد 98 ساعت 16:30 الی 20
  • مدت زمان دوره : جلسه 3 تا 4 ساعته
توضیحات بیشتر و ثبت نام
آموزش فروش آنلاین و اینترنتی

Online sales techniques

فروش خاک در بیابان کار هر کسی نیست


  • آموزش فروش و تکنیکهای فروشندگی حرفه ای
  • اعتماد سازی در بحث فروش آنلاین
  • آموزش قیف فروش یا Sales Funnel
  • مزیت های رقابتی فروش آنلاین نسبت به فروش فیزیکی
  • آشنایی با پرسونای مشتری
  • تفاوت های موجود در فروش خدمات و محصولات
  • آشنایی با ابزارهای نوین بازاریابی
  • تست های شخصیتی در فروش

  • زمان: 2 شهریور ماه 98 ساعت 16:30 الی 20
  • مدت زمان دوره : یک جلسه 3 تا 4 ساعته
توضیحات بیشتر و ثبت نام
آموزش ورود به دنیای ارز دیجیتال

Cryptocurrency Course

ورود به دنیای جذاب تجارت ارزهای دیجیتال


  • بلاک‌چین چیست و چه کاربرد هایی دارد
  • تفاوت کوین و توکن
  • آشنایی با استارتاپ های مبتنی بر بلاکچین
  • تشریح کیف پول های رایج و نحوه استفاده از آنها
  • ارز دیجیتال چیست و چه کاربرد هایی دارد
  • ماینینگ چیست و آیا توجیه اقتصادی دارد؟
  • آشنایی با بیتکوین، اتریوم و ریپل
  • آشنایی با دستگاه های استخراج ارز
  • آشنایی با صرافی های ارز دیجیتال
  • قوانین معاملاتی تهیه ارز از صرافی ها

  • زمان: هم زمان با به حد نصاب رسیدن کارگاه
  • مدت زمان دوره : 3 جلسه ی 4 ساعته
توضیحات بیشتر و ثبت نام
تیم سازی، کار تیمی و رهبری تیم

Teamwork for Success

ایده های ناب، زمانی به وجود می‌آیند که افراد در یک گروه فعالیت کنند


  • ویژگی های یک تیم خوب
  • معرفی الگوها و منابع کاربردی کار تیمی
  • اصول تیم سازی حرفه ای
  • رهبری صحیح و کارتیمی
  • اصول رهبری در تیمهای کاری
  • انواع نقش های فردی در کارتیمی
  • چالش های موجود در تیم ها
  • تصمیم گیری در تیم های کاری

  • زمان: دوشنبه 22 مهر ماه 98 ساعت 16:30 الی 19:30
  • مدت زمان دوره : یک جلسه ی 4 ساعته
توضیحات بیشتر و ثبت نام
آموزش گوگل آنالیتیکس پیشرفته

Advanced Google Analytics



  • زمان: همزمان با به حد نصاب رسیدن کارگاه
  • مدت زمان دوره : یک جلسه ی 3 تا 4 ساعته
توضیحات بیشتر و ثبت نام

ورود به دنیای حرفه‌ای کارآموزی

درخواست کارآموزی

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *





دوره های پیشنهادی:
سایر دوره ها