itarfand

آموزش برنامه نویسی به زبان Html

19 ارسال در این موضوع قرار دارد

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_08/vip-itarfand.PNG.44e060109967f13058a4ccba97235de2.PNG">

در این قسمت از انجمن زبان برنامه نویسی html آموزش داده می شود.

line.png

برای تست آنلاین کد ها می توانید از سایت زیر استفاده کنید:

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

line.png

از پرسیدن سوال در این تاپیک خودداری کنید.

 

 

 

 

 

 

 

 

 

 

 

 

 

0

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


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

قسمت 1 ) شروع به کار

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

نرم افزار مورد استفاده در این آموزش Visual Studio 2015 می باشد اما شما می توانید کدهای خود را در note pad بنویسید و به صورت name.html ذخیره و اجرا کنید تا خروجی آن را ببینید.

ابتدا با کلید های ctrl+alt+n صفحه website را باز کنید و یا از قسمت File بخش New گزینه Web Site را انتخاب کنید.

در صفحه باز شده گزینه ASP.Net Empty Web Site را انتخاب کنید.

itarfand-forum (48)-min.png

اکنون از قسمت Solution Explorer بر روی پروژه خود راست کلیک کنید و مانند عکس زیر Add New Item را انتخاب کنید.

itarfand-forum (49)-min.png

در صفحه باز شده گزینه HTML Page را انتخاب کنید.

itarfand-forum (50)-min.png

اکنون پروژه شما ایجاد شده است.

0

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


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

قسمت 2 ) مقدمه

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

فایل های html چگونه خوانده می شوند؟

کدهای html توسط مرورگرهای اینترنت تفسیر می شوند.

شکل کلی برنامه

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

در کد بالا کدهای قرار گرفته بین <head> و <head/> توضیحات راجع به صفحه می باشد و کدهای بین <body> و <body/> به کاربر نمایش داده می شود.

تگ چیست؟

به دستورات در این زبان تگ می گویند مانند <html> در کد بالا.

ویژگی تگ ها

هر تگ می تواند دارای یک یا چند ویژگی (Attribute) اختصاصی باشد مانند:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

نکته : زبان html به حروف بزرگ و کوچک تگ ها حساس نمی باشد و p برای P می باش.

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

در زبان html می تواد هم از " و ' استفاده کرد و این دو تفاوتی با هم ندارند.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 3) تگ های heading

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

لیست تگ های heading

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

این تگ ها برای ایجاد سر تیتر می باشند که بزرگترین آن ها h1 و کوچکترین آن ها h6 می باشد. این تگ ها متن خود را bold می کنند و به قبل و بعد آن فاصله اضافه می کنند.

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

ویژگی ها

با استفاده از کد زیر می توان این تگ را راست چین کرد.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 4) تگ p

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

این تگ فقط متن شما را Block Level می کند و تغییر دیگری در آن ایجاد نمی کند.

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

ویژگی کد دوم متن را وسط چین می کند و کد سوم انتها و ابتدا متن ها را در یک خط قرار می دهد.

0

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


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

قسمت 5) تگ body

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

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

ویژگی تگ

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

dir : استفاده از rtl در این کد باعث راست چین شدن کل صفحه می شود.

text : این ویژگی رنگ متن کل صفحه را تغییر می دهد.

bgcolor : این کد رنگ پس زمینه صفحه را تغییر می دهد.

 

0

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


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

قسمت 6) تگ font

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

این تگ برای تغییر فونت متن می باشد.

ویژگی تگ

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

face : نوع فونت متن را تعیین می کند.

size : اندازه متن را تعیین می کند.

color : رنگ متن را تعیین می کند.

0

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


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

قسمت 7) تگ های قاب بندی

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

<b> : متن را بولد می کند

<big> : متن را بزرگ می کند

<em> : متن را مورب می کند

<i> : متن را مورب می کند

<small> : متن را کوچک می کند

<strong> : متن را بولد می کند

<sub> : متن را زیرنویس دار می کند

<sup> : متن را بالانویس دار  می کند

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 8) تگ hr

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

این تگ برای خط کشیدن افقی در صفحه می باشد. این تگ از نوع empty می باشد ، یعنی پایان ندارد و تگ در درون خودش بسته می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

color : رنگ خط

size : اندازه خط بر حسب px

width : عرض خط بر حسب px  و یا درصد

 

قسمت 8.1) تگ br

این تگ عمل enter را انجام می دهد و متن به خط بعد می رود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

این تگ نیز از نوع empty می باشد.

0

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


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

قسمت 9 ) لیست ها

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

لیست ها به سه صورت مرتب ، غیر مرتب و توضیحی می باشند.

لیست مرتب

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

توسط این تگ لیس به صورت مرتب و یکی از حالت های زیر نمایش داده می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

لیست نامرتب

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

توسط این تگ لیس به صورت نامرتب و یکی از حالت های زیر نمایش داده می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

لیست توضیحی

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 10) لینک دهی

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

لینک دهی در HTML به دو صورت نسبی و مطلق می باشد.

آدرس دهی نسبی

در این نوع آدرس دهی شروع آدرس از فولد ریشه سایت می باشد.

اگر بخواهیم یک فولد به عقب برگردیم از ../ استفاده می کنیم.

آدرس دهی مطلق

در این نوع آدرس دهی از آدرس مستقیم مقصد مانند

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

 استفاده می کنیم.

لینک دهی

برای این کار از کد زیر استفاده می کنیم.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

لینک دهی داخل صفحه

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

آدرس دهی به ایمیل

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 11) تصویر دهی

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

عکس در html به صورت زیر استفاده می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

src : آدرس عکس را طبق قسمت 10 در آن قرار می گیرید.

اگر فرمت عکس png و یا gif باشد و پس زمینه نداشته باشد ، رنگ پس زمینه صفحه برای عکس نمایش داده می شود اما اگر jpg باشد پس زمینه آن سفید نمایش داده می شود.

width : عرض عکس را مشخص می کند.

height : ارتفاع عکس را مشخص می کند.

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

alt : عنوان عکس را مشخص می کند. در صورت خراب بودن آدرس عکس این متن نمایش داده می شود. همچنین موتورهای جستجو این عنوان را جستجو می کنند.

title : با استفاده از این عنوان با رفتن موس بر روی عکس متن مشخص شده نمایش داده می شود

hspace و vsapce : این دو فاصله را از عکس بالا و کناری مشخص می کند.

قرار دادن عکس ها در وسط

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 12) جدول

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

حتما باید به ازای tr از td استفاده کرد.

اگر سطر اول n ستون داشته باشد باید سطر دوم نیز n ستون داشته باشد.

به طور پیش فرض خطوط جدول نمایش داده نمی شوند. برای نمایش خطوط از کد زیر استفاده می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

کنترل اندازه جدول

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

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

دیگر ویژگی سطرها

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

cellspacing و cellpadding فاصله پیش فرض هر خانه با خانه دیگر را تغییر می دهند.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

در صورت ارتفاع دادن به یک ستون از سطر ، ارتفاع دیگر ستون ها در آن سطر نیز تغییر می کند.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

با استفاده از valign می توان موقعیت متن در حالتی که هر خانه ارتفاع دارد را تعیین کرد.

استفاده از ستون دلخواه

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

استفاده از سطر دلخواه

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

برای این کار حتما باید عدد پایینی (در این مثال 10) پاک شود و rowspan به عدد بالایی آن (در این مثال 7) داده شود.

استفاده از جدول در داخل جدول

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 13) فرم ها

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

type : نوع ورودی را مشخص می کند که می تواند رمز عبور و ایمیل ، متن و ... باشد.

size : اندازه قسمت ورودری را مشخص می کند.

maxlength : حداکثر تعداد حروف ورودری را مشخص می کند.

autocomplete : قابلیت خودکار کامل شدن توسط مرورگر را تعیین می کند.

value : مقدار نوشته شده در داخل بلاک ورود را مشخص می کند.

name : یک نام برای فیلد ورود قرار می دهد.

number : با انتخاب این عنوان در type کاربر حتما باید عدد وارد کند.

step : این کد در تگ number تعداد زیاد شدن اعداد را مشخص می کند.

url : با انتخاب این عنوان در type کاربر حتما باید آدرس اینترنتی وارد کند.

autofocus : فیلد پیش فرض انتخاب شده در لود صفحه.

readonly : فقط می توان متن را مشاهده کرد و نمی توان تغییر داد.

placeholder : این کد یک متن راهنما داخل فیلد نمایش می دهد.

required : باعث می شود که ورود آیتم مورد نظر الزامی باشد.

disabled : باعث غیر فعال شدن انتخاب می شود.

فیلد ورود متن

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

rows : ارتفاع را مشخص می کند.

cols : عرض را مشخص می کند.

دیگر نوع ورودی ها

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 با انتخاب یک name می توان جلوی انتخاب هر دو گزینه به صورت هم زمان را گرفت.

گزینه checked باعث پیش فرض انتخاب شدن گزینه می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

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

کد selected باعث پیش فرض انتخاب شدن گزینه می شود.

کد multiple باعث می شود که کاربر بتواند چند گزینه را انتخاب کند.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

گزینه checked باعث پیش فرض انتخاب شدن گزینه می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

توسط کد بالا می توان یک فایل را آپلود کرد.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

کد fieldset یک border دور فرم می اندازد.

جستجو

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

جستجو در لیست

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

Range

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

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

min : حداقل مقدار.

max : حداکثر مقدار

value : مقدار اولیه.

Color

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

این تگ برای انتخاب رنگ می باشد.

تاریخ و زمان

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

توسط این تگ ها می توانید زمان و تاریخ را از کاربر بگیرید.

رمز گذاری ارسال اطلاعات

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

توسط این کد کاربر می تواند نوع رمز گذاری اطلاعات را انتخاب کند.

لیست کلمات قابل قبول در input type

  • color
  • date
  • datetime
  • datetime-local
  • email
  • month
  • number
  • range
  • search
  • tel
  • time
  • url
  • week

لیست کلمات قابل قبول در ویژگی های input

  • autocomplete
  • autofocus
  • form
  • formaction
  • formenctype
  • formmethod
  • formnovalidate
  • formtarget
  • height and width
  • list
  • min and max
  • multiple
  • pattern (regexp)
  • placeholder
  • required
  • step
0

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


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

قسمت 14 ) تگ video و audio

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

تگ audio برای نمایش یک فایل ویدئو بدون نیاز به پلیر و افزونه می باشد.

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

width : اندازه صفحه نمایش فیلم

preload : لود شدن فیلم و ددیگر فیلم های صفحه را مشخص می کند. 

  • none : در زمان کلیک بر روی دکمه پخش فیلم لود می شود.
  • auto : تمام فیلم های صفحه لود می شوند.
  • metadata : فقط عنوان و اطلاعات فیلم لود می شود.

poster : عکس پیش زمینه فیلم قبل از نمایش آن را مشخص می کند.

controls : بخش کنترل فیلم را نمایش می دهد.

loop : در صورت پایان یافتن فیلم ، فیلم دوباره از اول شروع می شود.

autoplay : فیلم به صورت خودکار شروع به پخش می کند.

src : آدرس فیلم را مشخص می کند که می تواند چند عدد باشد که در صورت عدم پشتیبانی مرورگر از فرمت فیلم فرمت دیگر آن لود شود.

type : فرمت فیلم را مشخص می کند.

 

audio

این تگ برای برای پخش صوت می باشد.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

تمام خصوصیت های تگ ویدئو برای این تگ نیز عمل می کند.

 

0

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


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

قسمت 15 ) تگ svg

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png">

این تگ برای رسم اشکال مختلف می باشد. با استفاده از این تگ کیفیت شکل های قرار داده شده با تغییر zoom صفحه تغییر نمی کند و با کیفیت اولیه می ماند.

مثال:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

circle : برای کشیدن دایره

cx : موقعیت x شکل

cy : موقعیت y شکل

r : شعاع

stroke-width : اندازه هاشیه تصویر

fill : رنگ شکل

rect : برای کشیدن مستطیل

rx : مقدار گرد شدن x

ry : مقدار گرد شدن y

style : قرار دادن استایل با css

 

طراحی آنلاین

برای طراحی آنلاین اشکال خود می توانید از سایت زیر استفاده کنید و با گزینه save as در سربرگ file آن را با فرمت svg ذخیره کنید.

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

نمونه کد:

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 16 ) دیگر تگ های html

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

کاراکترهای خاص

برای تایپ کاراکترهای خاص مانند @ و یا # در html می توان از کدهای خاص آن استفاده کرد.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

لیست این کاراکترها را می توانید در سایت زیر ببینید.

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

تگ iframes

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

در صورت هم نام بودن myiframe مانند کد بالا در صورت کلیک بر روی لینک ، سایت مورد نظر به صورت آی فریم باز می شود.

پشتیانی از مرورگر اینترنت اکسپلولر

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

کد <!doctype html>

این کد برای دانستن ورژن html شما توسط مرورگر می باشد و به صورت زیر استفاده می شود.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

تگ span

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

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

 

0

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


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

قسمت 17 ) رنگ ها

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

برای استفاده از رنگ در وب مدهای محتلفی وجود دارد که مهمترین آن ها مدهای CMYK و RGB و HEX می باشد.

CMYK یا : Cyan Magenta Yellow Black 

از این حالت بیشتر برای چاپ عکس های باکیفیت استفاده می شود و از چهار رنگ استفاده می شود.

اطلاعات بیشتر :

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

کد رنگ ها در این حالت:

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

به طور مثال برای نمایش رنگ سیاه باید هر چهار رنگ 100% باشند.

 

RGB یا : Red Green Black

از این مد بیشتر برای وب سایت ها استفاده می شود و بحث آن استفاده از شعاع نور می باشد و رنگ واقعی موجود نیست.

اطلاعات بیشتر:

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

برعکس cmyk در صورت استفاده کامل از سه رنگ در این حالت رنگ سفید تولید می شود.

 

HEX یا FF6600

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

هر کدام از کاراکترها می تواند مقدار 0 تا f را بگیرد که به جای 10 حرف a قرار می گیرد.

اطلاعت بیشتر :

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

مشکلی که این نوع از رنگ دهی دارد این است که ممکن است در مرورگرهای مختلف رنگ ها به شکل های مختلفی نمایش داده شوند. برای حل این مشکل رنگ های Web Safe بوجود آمده اند که 216 عدد می باشند.

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

 

رنگ های فلت

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

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

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

لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

0

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


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

قسمت 18 ) تگ head

لطفا وارد و یا عضو شوید تا بتوانید image را ببینید

/monthly_2017_09/line.png.cf8bffa7ffa0c52fb846248ce72f08bc.png" alt="line.png">

این تگ محل قرار گرفتن فایل های استایل و توضیحات سایت می باشد.

قرار دادن فایل css

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

قرار دادن فایل اسکریپت

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

تگ های متا

این تگ ها توضیحاتی درباره سایت به مرورگرها می دهند و زبان سایت را مشخص می کنند.

لطفا وارد و یا عضو شوید تا بتوانید code را ببینید

کدهای بالا به ترتیب:

  • تعیین یونیکد متن سایت
  • توضیحی درباره سایت شما
  • کلمات کلیدی سایت شما
  • نویسنده سایت
  • رفرش شدن سایت در هر 20 ثانیه
  • رنگ مرورگر در موبایل
  • کپی رایت سایت شما
  • دیگر متاتگ ها برای شبکه های اجتماعی می باشند.
  • تگ هایی با نام Cache برای کنترل کش شدن سایت برای کاربر می باشد.

 

0

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


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

برای ارسال دیدگاه یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

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

ایجاد یک حساب کاربری

برای حساب کاربری جدید در سایت ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط
      کامنت ها
      در واقعیت کامنت ها واقعا زیاد مفید نیستند. چون نه به عمد، اما اطلاعات خوبی به خواننده ی کد نمی دهند.
      کد تغییر می کند و اتفاقات مختلف در آن می افتد. اما کامنت معمولا این تغییرات را همراهی نمی کند. پس کامنت نادقیق خیلی بدتر از نبودن کامنت است.
      نکات مورد توجه در مورد کامنت ها:
      کامنت ها کد های بد را خوب نمی کنند. زمانی که کد گیج کننده ای می نویسیم سعی میکنیم با نوشتن کامنت بدی کد را جبران کنیم، اما بهتر است کامنت را پاک کرده و از اول کد را بنویسیم. کار خود را در کد توضیح دهید. به جای اضافه کردن کامنت سعی کنید کد خود را خوانا بنویسید. چون یک کد تمیز زودتر از یک کد کثیف با کامنت فهمیده می شود. کامنت های خوب:
      کامنت های مجاز: که قوانین را اعلام می کنند. مثل کپی رایت. کامنت های آموزنده: مثل کامنتی که فرمت تاریخ و زمان را نشان می دهد. توضیح دادن مقصود: در صورتی که واقعا هدف را بیان کند. شفاف سازی: باز هم اولویت با نوشتن کد شفاف است تا کامنت. هشدار در مورد عواقب: فرض کنید یک متد sleep() داریم که زمان بر است. کامنت در مورد این موضوع می تواند خواننده را آگاه کند. کامنت های To Do: کارهایی که باید انجام شوند اما تا الان انجام نشده اند. تقویت:برای تقویت اهمیت چیزی که ظاهرا مهم به نظر نمی رسد. java doc یا امکانات مشابه در سایر زبان ها کامنت های بد:
      کامنت های من من کننده کامنت های زاید: کامنت های که خواندنشان بیشتر از خواندن کد وقت می گیرد. کامنت های گمراه کننده کامنت های اجباری کامنت های ژورنالی: کامنت هایی که مثل لاگ در کد ایجاد می شود مثل نام نویسنده یا ویرایشگر و تاریخ. کامنت های نویز: کامنت هایی که هیچ اطلاعاتی نمی دهند: مثل نوشتن کامنت default constructor Position markers: //////////////// که برای جدا سازی استفاده می شود اگر زیاد باشد مثل نویز می شود و هیچ کمکی نمی کند. کامنت های نزدیک کروشه و براکت ها: مثل end while// {  که وقتی حلقه خیلی طولانی باشد، جای بسته شدن حلقه ها را نشان می دهد. بهتر است به جای این کار طول توابع کمتر شود تا چایان حلقه ها راحت پیدا شود. کد های comment-out: کد هایی که نوشته شده اند بعد کامنت شده و به حال خود رها شده اند. کامنت های غیر محلی: هر کامنت باید نزدیک کد مربوط به خودش باشد. اطلاعات اضافی و بیش از حد در کامنت Function header ها: بهتر است به جای توضیح کار توابع یک نام خوب که کارش را نشان می دهد، انتخاب کنیم.   متدها
      مواردی که برای نوشتن متدهای تمیز قابل توجه اند:
      باید کوتاه باشد. برای فهم بهتر در موارد لازم از تو رفتگی استفاده شود. هر تابع باید فقط یک کار انجام دهد و آن را به خوبی انجام دهد. برای اطمینان از اینکه تابع ما فقط یک کار انجام می دهد باید مطمین شویم تمام statement های درون تابع در یک سطح از abstraction هستند. قانون Step down: میخواهیم کدها بصورت یک روایت از بالا به پایین خوانده شوند. تا حد امکان switch-case استفاده نکنیم و آن را در پلی مورفیسم دفن کنیم. چون یک switch حتی با دو case هم طولانی است. برای توابع از اسم های توصیفی استفاده کنید که عملکرد تابع از روی نام آن قابل فهم باشد. تعداد آرگومان های تابع باید تا حد امکان کم باشد. ایده ال ترین حالت بدون آرگومان است و تعداد 3 و بیشتر، آرگومان فقط در موارد خیلی خاص باید استفاده شود. از try/catch ها استفاده کنید.   نام های معنادار
       متغییر ها، توابع و کلاس ها همه نام دارند. نام گذاری درست در فهم کد و تمیز بودن آن بسیار موثر است:
      از نام هایی که هدفشان معلوم است استفاده کنید. از نام هایی که اطلاعات درست نمی دهند (disinformation) بپرهیزید. بعضی لغات معنای تثبیت شده ای در ذهن دارند. از این لغات برای معانی دیگر استفاده نکنید. برای مثال hp مربوط به پلتفرم unix است. اگر در کد خود وتر (hypotenues) دارید شاید ظاهرا hp نام خوبی برای آن به نظر برسد. اما گمراه کننده است و نباید از آن استفاده کرد. از کلماتی مانند list تنها در کاربرد خودشان استفاده کنید. مثلا اگر گروهی از دانش آموزان دارید که در سیستم بصورت list نیستند متغییرشان را studentList نام گذاری نکنید. studentGroup نام بهتری ست. از کلمات خیلی مشابه برای متغییر های مختلف استفاده نکنید. چون اشتباها به جای یکدیگر در نظر گرفته می شوند: xyzControllerForEfficientHandelingOfSetting
      xyzControllerForEfficientStorageOfSetting
      از O و L تک استفاده نکنید چون با 0 و 1 اشتباه گرفته می شوند. تفاوت های معنادار ایجاد کنید. مثلا a1 و a2 هیچ اطلاعاتی به ما نمی دهد (noninformative). تنها می توان فهمید که یک سری هستند. تفاوت بی معنی ایجاد نکنید. در واقع از noise word استفاده نکنید. مثلا ProductData و ProductInfo هیچ تفاوتی ندارند. یا نام گذاری کلاس مشتری به CustomerObject درست نیست. چون Customer به تنهایی اطلاعات را می رساند و Object در ادامه ی آن اضافه است. از نام های قابل تلفظ استفاده کنید. مثلا مخفف genymdhms، که مربوط به تاریخ و سال و ماه و... است، نام خوبی نیست.  از نام های قابل جستجو استفاده کنید. مثلا اگر نام متغیر تک حرف باشد، سرچ آن هزار نتیجه دارد و پیدا کردن جواب سخت است. اما MAX_STUDENT به راحتی قابل پیدا کردن است. تک حرف ها بهتر است تنها برای نام متغیرهای local استفاده شوند. از کد کردن بپرهیزید. مثل استفاده از I در ابتدای نام interface ها و یا انتهای Imp در انتهای نام کلاس های پیاده ساز. نام کلاس ها باید یک اسم یا یک عبارت اسمیه باشد. نام متدها باید یک فعل یا یک عبارت فعلیه باشد. بامزگی نکنید. چون نام های بامزه تنها در ذهن افراد درگیر شوخی می مانند. برای هر مفهوم فقط از یک اسم استفاده کنید. مثلا برای گرفتن اطلاعات از get و fetch و retrieve و ... در کلاس های مختلف استفاده نکنید. بعدا از کجا باید بفهمید که کدام متعلق به کدام است و تفاوتشان چیست؟ برای مفاهیم متفاوت از یک اسم استفاده نکنید. از نام های موجود در solution domain استفاده کنید. خوانندگان کد، برنامه نویس هستند و از لغات موجود در علم کامپیوتر مطلعند پس نام هایی مثل jobQueue یا accountVisitor مفهوم را می رساند. کلمات با معنا در نام ها اضافه کنید. فرض کنید متغیر های firstname, lastname, country, state و ... را می بینید. با دیدن این متغیرها می فهمیم که مربوط به آدرس هستند. اما اگر فقط متغیر state را ببینیم چطور؟ آیا متوجه می شویم مربوط به آدرس است؟ می توانیم یک context با معنا به آنها اضافه کنیم که مشخص شود مربوط به آدرس اند. به این شکل: addrFirstname, addrLastname, addrCountry, addrState و ... با این نام گذاری خواننده می فهمد که این متغیرها مربوط به یک مفهوم بزرگترند. اما راه بهتر تعریف کلاس Address است که در این صورت علاوه بر خواننده، کامپایلر هم می فهمد که این متغییر ها به مفهوم بزرگتری وابسته اند. کلمات بی معنا در نام ها اضافه نکنید. مثلا اگر نام پروژه Gas Station Delux است، منطقی نیست قبل از نام همه ی متغیر های برنامه GSD اضافه کنیم چون اطلاعاتی نمی دهد و نام ها را بدون هیچ مزیتی طولانی می کند.  
      منبع: لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

      کتاب مورد استفاده : لطفا وارد و یا عضو شوید تا بتوانید link را ببینید

    • توسط
      در این پست از آی ترفند برای شما آموزش هایی را از سایت lynda آماده کرده ایم که می توانید آن ها را به رایگان دانلود کنید.
       
      برای مشاهده لیست دانلود به لینک زیر بروید:
       

      لطفا وارد و یا عضو شوید تا بتوانید link را ببینید
    • توسط

      لطفا وارد و یا عضو شوید تا بتوانید image را ببینید
      /monthly_2017_08/vip-itarfand.PNG.44e060109967f13058a4ccba97235de2.PNG"> نرم افزار PSpice یک شبیه ساز برای مدارهای الکتریکی می باشد که در رشته مهندسی کامپیوتر و درس مدارهای الکتریکی از آن برای شبیه سازی و تحلیل مدارهای الکتریکی استفاده می شود.
      ابتدا نرم افزار را از
      لطفا وارد و یا عضو شوید تا بتوانید link را ببینید
      دانلود کنید و توسط راهنما آن را کرک کنید. به محل نصب نرم افزار بروید و از پوشه Capture فایل capture.exe را اجرا کنید.

      بعد از باز شدن نرم افزار از سربرگ File و قسمت New گزینه Project را انتخاب کنید.

      برای پروژه خود یک نام انتخاب کنید و سپس حالت آن را بر روی Analog قرار دهید و سپس محل ذخیره آن را مشخص کنید.

      در صفحه باز شده بر روی Create A Blank Project کلیک کنید.

      اکنون پروژه شما ایجاد شده است.
      برای افزودن گزینه به مدار بر روی گزینه مشخص شده در عکس زیر کلیک کنید.

      در صفحه باز شده بر روی Add Library کلیک کنید و تمام فایل ها را انتخاب کنید و سپس بر روی Open کلیک کنید و سپس از قسمت Part آیتم دلخواه خود را انتخاب کنید.

      برای وصل کردن دو آیتم به هم (سیم) گزینه مشخص شده در عکس زیر را انتخاب کنید.

       
    • توسط

      لطفا وارد و یا عضو شوید تا بتوانید image را ببینید
      /monthly_2017_08/vip-itarfand.PNG.44e060109967f13058a4ccba97235de2.PNG" alt="vip-itarfand.PNG"> نرم افزار modelsim یک شبیه ساز زبان های توصیف سخت افزاری می باشد که در رشته مهندسی کامپیوتر و درس مدارهای منطقی از آن برای شبیه سازی مدارها به زبان verilog استفاده می شود.
      برای ایجاد و کار با این نرم افزار این پست از انجمن آی ترفند را دنبال کنید.
      ابتدا نرم افزار را از
      لطفا وارد و یا عضو شوید تا بتوانید link را ببینید
      دانلود کنید و طبق راهنمایی داخل آن ، نرم افزار را کرک کنید. بعد از باز کردن نرم افزار برای ایجاد پروژه جدید از سربرگ File و قسمت New گزینه Project را انتخاب کنید.

      در صفحه باز شده یک نام برای پروژه خود قرار دهید.

      سپس بر روی Create New File کلیک کنید.

      در صفحه باز شده یک نام برای فایل خود قرار دهید و نوع آن را بر روی Verilog قرا دهید.

      اکنون می توانید کدهای خود را مانند عکس زیر بنویسید.

      بعد از نوشتن کدها برای کامپایل کردن فایل بر روی آن راست کلیک کنید و از قسمت Compile گزینه Compile Selected را انتخاب کنید.

      برای تست کدهای خود مانند عکس بالا در قسمت مشخص شده راست کلیک کنید از قسمت Add To Project گزینه File را انتخاب کنید و نوع آن را نیز به Verilog تغییر دهید.

      برای دیدن خروجی کدهای خود بعد از اطمینان از ذخیره شدن فایل ها در هارد با Ctrl+S از سربرگ Simulate گزینه Start Simulation را انتخاب کنید.

      در صفحه باز شده از قسمت Work فایل تست خود را انتخاب کنید و بر روی ok کلیک کنید.

      اکنون با صفحه زیر روبرو می شوید.

      بر روی قسمت مشخص شده راست کلیک کنید و مانند عکس عمل کنید.

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