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

ا توجه به پيشرفت روز افزون تكنولوژي اينترنت و سخت افزارهاي مرتبط با آن ، همواره مشكلات خاصي نيز در اين ميان در بين كاربران مختلف گزارش شده است. اينترنت پر سرعت امروزه مهمترين بحث در اين حوزه ميباشد كه تكنولوژي هايي نظير DSL ، ADSL ، EDSL و ... را در بر ميگيرد. اكثر كاربران ممكن است به نحوي از اين سيستم هاي ارتباطي استفاده نمايند و امروزه از لحاظ هزينه و ... استفاده از آنها نسبت به خطوط Dialup در بسياري از شركت ها و ... مفيدتر ميباشد. اما ممكن است برخي از كاربران با سخت افزارهاي مرتبط با اين تكنولوژي ها و استفاده از آنها در محيط ويندوز XP  دچار اشكال باشند. مقاله امروز من در مورد يكي از همين مشكلات و رفع آن ميباشد.

بقیه در ادامه مطلب

آیا تا به حال موقعیتی پیش آمده که بخواهید بین دو کلمه فاصله بیشتری وجود داشته باشد. یا بخواهید علامت کپی رایت را نشان دهید. این کاراکتر های ویژه با استفاده از کدهای ویژه در صفحه شما قرار می گیرند. این کدهای ویژه با علامت & (امپرسند) شروع می شوند و با تعدادی حرف یا عدد ادامه پیدا می کنند و با ; (نقطه ویرگول) پایان می یابند. برای مثل زمانی که شما می خواهید بین دو کلمه فضای خالی اضافی بگذارید باید از کد;nbsp&  استفاده کنید که فضای خالی اضافه می کند. مطابق مثال زیر:

Ehsan Q

نتیجه به این صورت خواهد بود:

Ehsan Q

فاصله اول بین کلمات با فشار دادن دکمه Space ایجاد می شود. مرورگر فاصله اول را تشخیص می دهد اما بعد از آن هر تعداد فاصله که باشد تفاوتی نمی کند و شما فقط یک فاصله را در مرورگر می بینید. افزودن کد ;nbsp& مرورگر را مجبور می کند تا بین دو کلمه فاصله اضافی بگذارد. شما با تکرار این کد می توانید به هر تعداد که بخواهید فاصله خالی ایجاد کنید.مانند زیر:

Ehsan      Q

نتیجه:

Ehsan       Q

این فرمان 6 فضای خالی اضافی بین دو کلمه ایجاد می کند. و در مجموع 7فضای خالی داریم.

بحث بعدی ما علامت کپی رایت است. شما می توانید به همان روشی که برای فضای خالی اضافی ایجاد کردیم این علامت را نیز به وجود بیاورید. یعنی با استفاده از کد آن. کد علامت کپی رایت این است:  ;copy& به این مثال توجه کنید:

متن نتیجه:

this page Copyright © 2007 by me

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

در این لینک می توانید تعدادی از این کاراکترهای ویژه را به همراه کد سازنده آنها ببینید

کار کردن با فونتها و رنگ و اندازه آنها در HTML

در این قسمت از درس به سراغ کار با فونتها و اندازه آنها می رویم.

اندازه فونت:

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

<font size="x">matne ba andaze x namyesh dade mishvad </font>

به جای «x» عددی با علامت منفی یا مثبت قرار می گیرد. وقتی که می خواهیم یک متن بزرگتر دیده شود از علامت مثبت و زمانی که می خواهیم متن کوچکتر شود از علامت منفی استفاده می کنیم. به مثال زیر توجه کنید:

<font size="+2">matne ba andaze +2 namyesh dade mishvad </font>

این هم نتیجه تغییر سایز فونت:

matne ba andaze x namyesh dade mishvad

برای کوچکتر کردن متن نیز به همین صورت عمل می کنیم:

<font size="-2">matne ba andaze -2 namyesh dade mishvad </font>

این هم متن کوچک شده:

matne ba andaze -2 namyesh dade mishvad

برای تغییر رنگ متنها نیز می توانیم به روش زیر عمل کنیم، با این فرمان :

<font color="y">matne ba reng y namyesh dade mishvad </font>

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

برای دریافت مقدار هگزا دسیمال رنگها و نام رنگها  اینجا کیک کنید  و برای تبدیل اعداد به معادل هگزا دسیمال از این برنامه استفاده کنید(تبدیل اعداد به معادل هگزا دسیمال حجم برای دانلود ۷ کیلو بایت)

برای شروع با اسم رنگ شروع می کنیم:

<font color="red">matne ba reng red namyesh dade mishvad </font>

نتیجه کد بالا:

matne ba reng red namyesh dade mishvad

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

<font color="#ff0000">matne ba cod reng #ff0000 </font>

نتیجه کد بالا:

matne ba cod reng #ff0000

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

فرض کنید می خواهید رنگ و اندازه متنی را همراه با هم تغییر دهید. برای این کار می توانید از دو تگ <font> استفاده کنید.

همچنین می توانید از شناسه های size و color در یک تگ<font> استفاده کنید. مانند زیر:

<font color="gold" size="+2">matne ba cod reng talay vasize +2 </font>

نتیجه کد بالا:

matne ba cod reng talay va size +2

شما می توانید رنگ فونت را در تگ body تعریف کنید که بعداً به آن می پردازیم.

<h1>HEADING1</h1>

نتیجه کد بالا:

HEADING1

<h2>HEADING2</h2>

نتیجه کد بالا:

HEADING2

<h3>HEADING3</h3>

نتیجه کد بالا(در حال کوچک شدن):

HEADING3

<h4>HEADING4</h4>

نتیجه کد بالا(در حال کوچکتر شدن):

HEADING4

<h5>HEADING5</h5>

نتیجه کد بالا(در حال کوچکتر شدن):

HEADING5

<h6>HEADING6</h6>

نتیجه کد بالا(در حال کوچکتر شدن):

HEADING6

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

·       وقتی که تگ <br> در متنی وارد می شود بقیه آن خط به خط بعد منتقل می شود. در حقیقت تگ <br> یا همان Line Break کاری مشابه فشردن کلید Enter به همراه Shift را انجام می دهد. قابل ذکر است که این تگ نیازی به تگ پایانی ندارد. به یک مثال توجه کنید:

This is the first line <br> Here is the second line

نتیجه مثال بالا به اینگونه است:

This is the first line
Here is the second line

مرورگر اصولاً تا وقتی که به کمبود فضا برای یک خط بر نخورد به خط بعدی نمی رود. اما تگ <br> مرورگر را مجبور می کند به خط بعدی برود.مثلاً متن زیر را در ویرایشگر متن خود بنویسید و به صورت html ذخیره کنید، فقط یک خط را در مرورگر خود خواهید دید:

من،

 یک خط

 جدید می خواهم

نتیجه به این صورت خواهد بود:

من، یک خط جدید می خواهم

برای اینکه نتیجه ای مشابه متن نوشته شده در ویرایشگر متن داشته باشیم، باید متن را به این صورت بنویسیم:

من،<br> یک خط<br> جدید می خواهم

این هم نتیجه:

من،

یک خط

جدید می خواهم

 تگ<p> پاراگراف است. این تگ باعث ایجاد یک فضای خالی عمودی بین دو خط در دو پاراگراف می شود. درست مثل اینکه شما
را دو بار تایپ کنید.از این تگ در اول پاراگراف برای تمایز دو پاراگراف استفاده می شود. به مثال زیر توجه کنید:

خط اول از پاراگراف اول <br> خط دوم از پاراگراف اول <p> این هم پاراگراف جدید </p>

و نتیجه به این صورت است:

خط اول از پاراگراف اول
خط دوم از پاراگراف اول

این هم پاراگراف جدید

تگ پاراگراف هم نیازی به تگ پایانی ندارد. اما شما می توانید برای فهم بهتر آنرا در متن خود به کار ببرید. مثلاً به این صورت:

<p> پاراگراف اول </p> <p> پاراگراف دوم<br> ادامه پاراگراف دوم </p>

این متن همان نتیجه ای را دارد که متن زیر دارد:

<p> پاراگراف اول</p> <p> پاراگراف دوم<br> ادامه پاراگراف دوم </p>

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

پاراگراف اول

پاراگراف دوم
ادامه پاراگراف دوم

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

ضخیم کردن متن

<b>matn dar in ghesmat zakhim namayesh dade mishavad<b/>

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

matn dar in ghesmat zakhim namayesh dade mishavad

کج  کردن متن

<i>matn dar in ghesmat kaj namayesh dade mishavad<i/>

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

matn dar in ghesmat kaj namayesh dade mishavad

 زیر خط دار کردن متن

<u>matn dar in ghesmat zirkhatdar namayesh dade mishavad<u/>

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

matn dar in ghesmat zirkhatdar namayesh dade mishavad

متن خط خورده

<strike>khat khorde<u/>

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

matn dar in ghesmat khatkhorde namayesh dade mishavad

وسط چین کردن متن

<center>matn dar vasate sahfe namayesh dade mishavad<center/>

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

matn dar vasate sahfe namayesh dade mishavad

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

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

<i><center>EhsanQ<center/></i>

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

EhsanQ

آیا ترتیب قرار گرفتن تگهای پایانی مهم است؟ در پاسخ باید گفت در مثال بالا خیر، اما مواردی وجود دارد که ترتیب قرار گرفتن تگها مهم است مثلاً قرار گرفتن تگ پایانی قبل از اشتباه است. شما با تمرین و تجربه می توانید این نکته را فرا بگیرید. شما می توانید برای جلو گیر از اشتباه HTML را به صورت زیر بنویسید:

<b> <i> matn be shorate zakhim va kaj </i> </b>

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

matn be shorate zakhim va kaj

اما این روش خسته کننده است. در اینجا مهم نیست تگها به چه صورت باز و بسته شوند. اما نکته مهمی که باید در نظر داشته باشید این است که متنها تحت تأثیر تگهایی که قبل از آنها باز شدهاند و بسته نشده اند قرار می گیرند.

توجه داشته باشید که تأثیر یک تگ تمام می شود وقتی که تگ بسته شود.

مثال زیر را در نظر داشته باشید:

<b><i><u>1www.naftboys.blogfa.com</u></i></b>

این نتیجه را به ما می دهد:

1www.naftboys.blogfa.com

اما این یکی:

<u><i><b>1www.naftboys</b></i>.blogfa.com</u>

این نتیجه را به ما می دهد:

1www.naftboys .blogfa.com

شما به جایی برای ذخیره کردن متن خود دارید که می تواند جایی روی هارد دیسک شما، یک فلاپی دیسک یا یک سرور باشد. البته شما برای استفاده از HTML نیاز ندارید حتماً به اینترنت متصل باشید، شما می توانید با استفاده از یک مرورگر وب در کامپیوتر خود از HTML استفاده کنید.
برای ذخیره کردن فایلی که با Notepad نوشته اید کافی است از منوی File گزینه Save As را انتخاب کرده و مسیری را برای ذخیره فایل انتخاب کنید و در کادر File Name در پایین پنجره Save As نام فایل را با پسوند html بنویسید. در آخر هم دکمه Save را کلیک کنید.

خیلی ها بهم میگن چطوری می توانیم برنامه نویسی یاد بگیریم؟ در جواب بایدبگم خیلی ها توقع دارن با خوندن کتاب و دیدن فیلم های آموزش برنامه نویسی، برنامه نویس بشن ولی اصلاً اینطوری نیست. قدم اول خواندن کتاب و دیدن فیلم های آموزش برنامه نویسی هست که من فیلم رو هم پیشنهاد نمیکنم برنامه نویس باید پر حوصله باشه نه اینکه از روی تنبلی بره سراغ فیلم . فیلم برای آموزش مثلاً فتوشاپ هست . شما میتونی از همین کتاب هایی که به زبان انگلیسی و فارسی در اینترنت موجود هست هم استفاده کنی و آموزش های دیگه که روی وبلاگ های انگلیسی و فارسی هست . و مقدمات و یه سری مباحث رو یاد بگیری و بعد برای اینکه واقعاً بتونی برنامه نویس بشی و هر چی بهت گفتن بنویسی باید در عمل کار کنی. یعنی یه پروژه برای خودت انتخاب بکنی هر چند ساده و روش کار کنی . تا عملی کار نکنی برنامه نویس نمیشی.مثلاً یه پروژه ی ساده بگیر و اون چیزایی که از کتاب ها و سایت های آموزشی یاد گرفتی را در ساختش استفاده کن. و اون چیزایی هم که بلد نیستی رو بگرد توی اینترنت پیدا کن یا از کسی بپرس. و همینطوری ادامه بده. اگه شما خیلی ام حرفه ای بشی بازم به آموزش نیاز داری و هر روز باید علمت به روز بشه و با تکنولوژی های جدید آشنا بشی. بعد که احساس کردی میتونی برنامه نویسی کنی و کاری بهت بدن میتونی انجام بدی . برو کار مشتری رو قبول کن هر بار که برای مشتری کار انجام بدی تجربه ات بیشتر میشه. 

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

امیدورام موفق باشید.

داشتم با مرورگر کروم کار میکردم. برخی مواقع وقتی میبینم سایتم رنگش مناسب نیست یا فلان عنصر رو کم داره یا نوع و اندازه ی فونت مناسب نیست روی عنصر در مرورگر کروم راست کلیک میکنم و گزینه ی  Inspect element را انتخاب میکنم. راحت میتونی عنصرت رو تغییر بدی یا اگه متن بود رنگ و اندازه و نوعش رو تغییر بدی. و یا اون عنصر مورد نظر را حذف کنی و به جاش چیز دیگه بیاری. اینطوری میتونی یه پیش نمایش از تغییراتت ببینی. ولی خب یه بار پیش میاد بخوای از این تغییراتی که انجام دادی یه عکس بگیری. میتونی از افزونه ی Full Page Screen Capture که مخصوص مرورگر کروم هست استفاده کنی. وقتی روی لینک زیر کلیک کردید بعد در پنجره ی باز شده روی دکمه ی سبز رنگ اضافه شد به کروم یا add to chrome کلیک کنید.

Full Page Screen Capture

امروز قالب وبلاگم رو عوض کردم. یک قالب نوشتم که گرافیک بهتری داشته باشه. این قالب از نظر استاندارد w3c مشکلی نداره و با سایت http://validator.w3.org/ بررسیش کردم و مشکلی نداشت. چون برخی از دستورات بلاگ اسکای قدیمی هست چند تا اخطار میده ولی کدهایی که من نوشتم مشکلی از لحاظ استاندارد نداره. و سعی کردم سئو رو هم رعایت کنم. برای اینکه جستجوگرش فعال بشه در قسمت نمای وبلاگ به قسمت ابزارک ها بروید و جستجو را فعال کنید دیگر امکانات مثل تقویم را هم می توانید در قسمت برنامه های جانبی فعال کنید. این قالب همه ی تگ های بلاگ اسکای رو تقریباً پشتیبانی میکنه. و برعکس برخی قالب ها که وقتی در قسمت ویرایش وارد میکنید این قالب دیگه اخطاری نمیده. قسمت اشتراک در فرندفا رو جایگزین دیگر شبکه های اجتماعی خارجی کردم. اسلاید شویی که برای قالب گذاشتم همان اسلاید شویی هست که طریقه ی ساختش رو توی کتاب آموزش سریع و آسان جی کوئری آموزش دادم.

اگر هر اشکالی در قالب دیدید بهم بگید تا اصلاح کنم.

دانلود قالب وبلاگ برنامه نویسی

دانلود اسلاید شو قالب