تبلیغات
Par30net | پارســـی نت
ورود کاربران
نام کاربری :
کلمه عبور :
کلمه عبور خود را فراموش کرده ام ؟
منوی کاربری

Make Your HomePage    Send Email To Admin    Add to Favorites

پیغام مدیر : با عرض سلام و خسته نباشی دوستانی که مایلند با ما تبادل لینک کنند از قسمت لینک دوستان لینک خود را برای ما ارسال نمایند

با تشکر   

عضویت در سایت


تماس با ما


ارسال پیام

لینكهای ویژه
لینك دوستان
چت بامدیـــــر
جستجوگر

Google
  
            
     در كل اینترنت
     در پارســـی نت

نظر سنجی

نظر شما راجع به رنگبندی سایت چیست ؟






آمار وب
بازدید های امروز:
بازدیدهای دیروز:
بازدید این ماه :
بازدید ماه گزشته:
کل بازدید ها:
نویسندگان سایت:
كل مطالب ارسالی:
آخرین به روز رسانی:
طراح قالب

Hosted by:

IranHost

ساعــــت

نویسنده گان
  • سید حسین رفعتی(416)

  • موضوعات












    آرشیو
  • هفته چهارم فروردین 1389 ( 5 )
  • هفته چهارم دی 1388 ( 115 )
  • هفته سوم دی 1388 ( 1 )
  • هفته دوم دی 1388 ( 18 )
  • هفته اول دی 1388 ( 212 )
  • هفته چهارم آذر 1388 ( 78 )
  • همه آرشیوها
  • آخرین پستها

    اس ام اس sms ماه رمضان – سری ۳

    اس ام اس و پیامک رمضان – سری ۴

    اس ام اس عید فطر

    اس ام اس عید غدیر خم – سری ۳

    اس ام اس ولادت حضرت محمد و امام صادق

    مقدمه آموزش CSS

    اصول نوشتن کد های CSS

    استفاده از شناسه Style

    CSS در HEAD صفحه

    فایل CSS خارج از صفحه

    تنظیم طول و عرض عناصر

    ایجاد کادر برای عناصر

    حاشیه و تو رفتگی عناصر صفحه

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

    کار با متنها ( بخش اول )

    کار با متنها (بخش دوم )

    تنظیم فونت با CSS

    تنظیم رنگ متن با CSS

    تنظیم رنگ و تصویر زمینه

    تنظیم تکرار تصویر زمینه

  • همه پستها
  • لوگو دوستان


    وضعیت


    »آدرس آی پی شما:

      AddThis Feed Button



    تبلیغات
    امروز :



     آخرین اخبار سایت

    چت روم پارسِِــــی نت را اندازی شد (جدید)

    شما دوستان عزیز می توانید با عضویت در سایت و ورود به حساب کاربری خود از چت روم سایت پارســــی نت بهرمند شوید         ( تاریخ ارسال : 25/10/1388 )











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

    برای ارسال بنر خود اینجا كلیك كنید

    اس ام اس sms ماه رمضان – سری ۳

    پست: 429  |  موضوع مرتبط: سرگرمی > اس ام اس ایام

    اس ام اس sms ماه رمضان – سری ۳ اس ام اس sms ماه رمضان – سری ۳

     

     

     


    مشاهده اس ام اس ...


    نوشته: سید حسین رفعتی ساعت: 04:44 ب.ظ تاریخ: یکشنبه 29 فروردین 1389 |+|
    اس ام اس و پیامک رمضان – سری ۴

    پست: 428  |  موضوع مرتبط: سرگرمی > اس ام اس ایام

    اس ام اس و پیامک رمضان – سری ۴ اس ام اس و پیامک رمضان – سری ۴

     

     

     


    مشاهده اس ام اس ...


    نوشته: سید حسین رفعتی ساعت: 04:21 ب.ظ تاریخ: یکشنبه 29 فروردین 1389 |+|
    اس ام اس عید فطر

    پست: 427  |  موضوع مرتبط: سرگرمی > اس ام اس ایام

    اس ام اس عید فطر اس ام اس عید فطر

     

     

     


    مشاهده اس ام اس ...


    نوشته: سید حسین رفعتی ساعت: 04:19 ب.ظ تاریخ: یکشنبه 29 فروردین 1389 |+|
    اس ام اس عید غدیر خم – سری ۳

    پست: 426  |  موضوع مرتبط: سرگرمی > اس ام اس ایام

    اس ام اس عید غدیر خم – سری ۳ اس ام اس عید غدیر خم – سری ۳

     

     

     


    مشاهده اس ام اس ...


    نوشته: سید حسین رفعتی ساعت: 04:16 ب.ظ تاریخ: یکشنبه 29 فروردین 1389 |+|
    اس ام اس ولادت حضرت محمد و امام صادق

    پست: 425  |  موضوع مرتبط: سرگرمی > اس ام اس ایام

    اس ام اس ولادت حضرت محمد و امام صادق اس ام اس ولادت حضرت محمد و امام صادق

     

     

     


    مشاهده اس ام اس ...


    نوشته: سید حسین رفعتی ساعت: 04:00 ب.ظ تاریخ: یکشنبه 29 فروردین 1389 |+|
    مقدمه آموزش CSS

    پست: 423  |  موضوع مرتبط: آموزشی > CSS

    آموزش CSS

    آموزش کار با استایل (CSS)

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

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

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

    اگر انتقاد یا پیشنهادی برای بهتر شدن این قسمت دارید می توانید از طریق «فرم تماس با ما» ما را مطلع کنیم. ما نیز خوشحال می شویم از نظرات شما در جهت بهبود این بخش استفاده کنیم.



    نوشته: سید حسین رفعتی ساعت: 03:41 ب.ظ تاریخ: یکشنبه 27 دی 1388 |+|
    اصول نوشتن کد های CSS

    پست: 422  |  موضوع مرتبط: آموزشی > CSS

    آموزش CSS

    استفاده از کلاس و id در طراحی صفحات با CSS

    • سلکتور کلاس

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

    p.black {color: black}
    p.red {color:red}

    در مرحله بعد باید برای هر پاراگرافی که می خواهیم به رنگ مشکی باشد از شناسه "class="black در تگ <p> استفاده کنیم و برای پاراگراف قرمز از شناسه "class="red. البته نام کلاسها اختیاری است ولی بهتر است آنها را طوری انتخاب کنید که مفهوم داشته باشند تا وقتی که حجم استایل شما بیشتر شد به گنگ نباشد. در مثال زیر می توانید کد مربوط به نوشتن دو پاراگراف بالا را در متن HTML ملاحظه کنید:

    <p class="black">این متنی است که به رنگ مشکی نمایش داده می شود</p>
    <p class="red">این متن به رنگ قرمز نمایش داده می شود.</p>

    نکته : شما می توانید بیش از یک کلاس برای یک تگ HTML تعریف کنید اما برای این کار نباید دو بار از شناسه class استفاده کرد. بلکه باید در یک شناسه class نام دو کلاس مورد نظر را با یک فاصله بین آنها وارد کرد. برای مثال برای پاراگراف زیر از دو کلاس فرضی red و center استفاده شده است:

    <p class="red center">این متن پاراگرافی است که تحت تأثیر دو کلاس red و center قرار دارد</p>

    در نوشتن استایل می توان از نوشتن نام تگ در سلکتور کلاس چشم پوشی کرد. در این صورت ویژگیهای تعریف شده در آن کلاس بر هر تگ HTML که از کلاس مربوطه در شناسه class آن استفاده شده باشد اثر می گذارد. برای مثال در کلاس زیر ویژگی وسط چین را تعریف می کنیم و از نام تگ در سلکتور کلاس استفاده نمی کنیم:

    .center {text-align: center}

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

    <p class="center">متن این پاراگراف به صورت وسط چین نمایش داده می شود</p>
    <div class="center">متن این قسمت به صورت وسط چین نمایش داده می شود</div>
    <h2 class="center">متن این سرفصل به صورت وسط چین نمایش داده می شود</h2>

    تذکر : هیچ وقت نام کلاس را با یک عدد شروع نکنید چون در این صورت مرورگرهای Mozilla و Firefox نمی توانند از آن کلاس استفاده کنند.

    ما می توانیم از سلکتور کلاس برای تگی که حاوی شناسه class است استفاده کنیم که در قسمتهای قبلی در این مورد توضیح داده شد. علاوه بر این می توانیم از ویژگیهای تعریف شده در سلکتور کلاس برای تگهایی که در یک تگ محتوی شناسه class قرار دارند نیز استفاده کنیم. مثلا برای لینکهایی که در یک DIV قرار دارند و برای DIV کلاس تعریف شده است. برای این کار در نوشتن استایل مربوطه باید پس از نقطه که مشخص کننده سلکتور کلاس است نام کلاس را وارد کنیم و پس از وارد کردن یک فضای خالی نام تگی که می خواهیم ویژگیهای بر روی آن اعمال شود. به مثال زیر توجه کنید:

    در این مثال از استایل زیر در استفاده می کنیم:

    .test { border: #F00 1px double }
    .test a { color: green }
    .test a:hover { border: yellow 2px solid }

    کد HTML زیر برای این مثال مورد استفاده قرار می گیرد:

    <div class="test">
    <a href="#">لینک آزمایشی شماره 1</a>
    </div>
    <a href="#">لینک آزمایشی شماره 2</a>

    می توانید نتیجه را در اینجا مشاهده کنید:

     
    همانطور که در مثال بالا می بینید خواص لینک آزمایشی شماره 1 تحت تأثیر استایل مورد استفاده برای تگ DIV قرار دارد ولی لینک آزمایشی شماره 2 مانند سایر لینکهای خارج از DIV نمایش داده می شود.

     


    • افزودن استایل به نوع مشخصی از عناصر

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

    • <"input type="text>
      کادرهای متنی که در فرمها استفاده می شود.
    • <"input type="checkbox>
      چک باکس هم با استفاده از تگ <input> به وجود می آید.
    • <"input type="radio>
      در ساختن دکمه های رادیو هم از همان تگ استفاده می شود.
    • <"input type="button>
      این تگ در ساختن هم استفاده می شود.
    • <"input type="submit>
      برای ساختن دکمه ارسال فرم هم از تگ <input> استفاده می شود.

    حالا فرض کنید ما در یک صفحه از چند نمونه از عناصر بالا استفاده کرده ایم ولی فقط می خواهیم ویژگیهای یکی از آنها را تغییر دهیم. دو روش برای این کار وجود دارد: یکی استفاده از کلاس است که در این روش اگر تعداد زیادی از عنصر مورد نظر در صفحه وجود داشته باشد باید به همان تعداد از شناسه class در تگهای آنها استفاده کنیم و ممکن است این کار باعث افزایش حجم صفحه یا موجب سختی در نوشتن کد شود. روش دوم تعریف کردن سلکتور input برای عناصر مورد نظر است که به صورت زیر انجام می گیرد:

    فرض کنید می خواهیم فقط عرض کادرهای متنی را در صفحه تغییر دهیم. در صورتی که در استایل از سلکتور input به تنهایی استفاده کنیم عرض همه چک باکسها ، دکمه ارسال، دکمه های رادیو و سایر عناصری که از تگ <input> استفاده کرده اند نیز تغییر می کند. برای انجام این کار می توانید سلکتور را به صورت زیر تعریف کنیم:

    input[type="text"] {
    width: 200px
    }

    کد استایلی که در بالا نوشتیم فقط بر روی کادر های متنی که در آنها از شناسه "type="text استفاده شده است اثر می گذارد.

    البته این روش ممکن است در مرورگر Internet Explorer پشتیبانی نشود اما مرورگرهای Firefox و Opera از آن پشتیبانی می کنند.


    سلکتور id

    روش دیگری که برای تعریف استایل وجود دارد استفاده از id است. شناسه id احتمالاً در آینده جایگزین شناسه name در تگهای HTML می شود بنا بر این در هرصفحه نباید بیش از یک بار از هر ID استفاده شود. اگر بیش از یک بار از یک id استفاده شود کارایی صفحه تغییری نمی کند ولی صفحه اعتبار خود را از دست می دهد. سلکتور id با علامت # مشخص می شود. با استایل زیر همه عناصر که شناسه "id="border دارند با کادری سبز رنگ نمایش داده می شوند:

    #border { border: green thin solid }

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

    <h3 id="border">این یک سرفصل با اندازه 3 است</h3>
    <div id="border">این قسمت یک div است </div>

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

    این یک سرفصل با اندازه 3 است

    این قسمت یک div است

    همانطور که کلاس را می توانستیم برای یک عنصر مشخص تعریف کنیم در مورد id نیز می توانیم این کار را انجام دهیم. به استایل زیر توجه کنید:

    p#border { border: green thin solid }

    استایل بالا فقط روی پاراگرافی که شناسه "id="green در آن به کا رفته اثر می گذارد.

    نکته : هرگز نام یک id را با یک عدد آغاز نکنید چون در این صورت مرورگرهای Mozilla و Firefox نمی توانند از آن استفاده کنند.



    نوشته: سید حسین رفعتی ساعت: 03:38 ب.ظ تاریخ: یکشنبه 27 دی 1388 |+|
    استفاده از شناسه Style

    پست: 421  |  موضوع مرتبط: آموزشی > CSS

    آموزش CSS

    وارد کردن CSS در تگهای HTML با استفاده از شناسه Style

    ساده ترین راه برای افزودن استایل به یک صفحه استفاده از شناسه style در تگهای HTML است.
    برای افزودن استایل به یک تگ باید عبارت " "=style را وارد تگ مربوطه کنیم و ویژگیهای مورد نیاز خود را بین دو دابل کوت ( " ) وارد می کنیم. مثلاً فرض کنید می خواهیم به یک تگ DIV استایل اضافه کنیم. در این صورت تگ DIV به صورت زیر در می آید.

    <div style="property:value"

    برای نمونه وقتی بخواهیم متن داخل یک DIV به رنگ سبز نمایش داده شود می توانیم به صورت زیر تگ DIV را بنویسیم:

    <div style="color:green">متن داخل DIV </div>

    توجه کنید که بین ویژگی color و رنگ سبز ( green ) از علامت دو نقطه ( : ) استفاده شده نه از علامت مساوی که در تگهای HTML استفاده می شود. همچنین لازم نیست مقادیر مورد نظر را بین علامت های نقل قول ( " ) قرار دهیم. می توانید نتیجه به کارگیری کد بالا را در سطر زیر مشاهده کنید:

    متن داخل DIV

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

    این امکان نیز وجود دارد که به یک تگ HTML بیش از یک ویژگی افزوده شود. تنها کافی است بین ویژگیهای مختلف از یک نقطه ویرگول ( ; ) استفاده کنیم. برای مثال اگر بخواهیم متنی که در یک DIV قرار دارد به رنگ قرمز و به صورت ایتالیک باشد می توانیم به صورت زیر کد DIV را بنویسیم:

    <div style="color:red; font-style:italic">این متن قرمز رنگ و ایتالیک است.</div>

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

    این متن قرمز رنگ و ایتالیک است.

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

    <div style="color:blue; font-style:italic; font-weight:bold; font-size:12pt; text-align:center">متن مورد نظر اینجا قرار می گیرد.</div>

    در این مثال ما متنی را با رنگ آبی، ایتالیک، ضخیم، اندازه فونت 12pt و در وسط صفحه خواهیم داشت:

    متن مورد نظر اینجا قرار می گیرد.

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



    نوشته: سید حسین رفعتی ساعت: 03:37 ب.ظ تاریخ: یکشنبه 27 دی 1388 |+|
    كل مطالب ارسالی;:

    تعداد کل صفحات:    53

        ( 1 )     ( 2 )     ( 3 )     ( 4 )     ( 5 )     ( 6 )     ( 7 )     ( ... )
    f